import React from 'react';
import { Heading } from '@digigov/ui/typography/Heading';
import { HeadingCaption } from '@digigov/ui/typography/HeadingCaption';

export const Default = (_: any) => (
  <>
    <HeadingCaption size="xl">caption for ds-heading-xl </HeadingCaption>
    <Heading size="lg" element="h2">
      {' '}
      ds-heading-xl{' '}
    </Heading>
    <HeadingCaption size="lg">caption for ds-heading-lg </HeadingCaption>
    <Heading size="lg" element="h2">
      {' '}
      ds-heading-lg{' '}
    </Heading>
    <HeadingCaption size="md">caption for ds-heading-md </HeadingCaption>
    <Heading size="md" element="h3">
      {' '}
      ds-heading-md{' '}
    </Heading>
  </>
);

export default Default;