{"size": 1429, "ext": "js", "max_stars_repo_path": "src/ui/Typography/Typography.stories.js", "max_stars_repo_name": "vtfk/component-library", "max_stars_repo_stars_event_min_datetime": null, "max_stars_repo_stars_event_max_datetime": null, "max_issues_repo_path": "src/ui/Typography/Typography.stories.js", "max_issues_repo_name": "vtfk/component-library", "max_issues_repo_issues_event_min_datetime": "2021-02-08T23:40:07.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-31T05:15:57.000Z", "max_forks_repo_path": "src/ui/Typography/Typography.stories.js", "max_forks_repo_name": "vtfk/component-library", "max_forks_repo_forks_event_min_datetime": "2021-03-23T14:55:50.000Z", "max_forks_repo_forks_event_max_datetime": "2022-02-24T14:41:07.000Z"}
{"max_stars_count": null, "max_issues_count": 318, "max_forks_count": 2, "avg_line_length": 18.0886075949, "max_line_length": 99, "alphanum_fraction": 0.6207137859}
import React from 'react'
import { getConfig } from '../../../scripts/storybook/storyConfig'

import {
  Heading1,
  Heading2,
  Heading3,
  Heading4,
  Paragraph,
  Link,
  SkipLink,
  ErrorMessage
} from '.'

export default getConfig(
  { title: 'Typography', component: Heading1 }
)

export function heading1 () {
  return (
    <Heading1>Heading 1</Heading1>
  )
}

export function heading2 () {
  return (
    <Heading2>Heading 2</Heading2>
  )
}

export function heading3 () {
  return (
    <Heading3>Heading 3</Heading3>
  )
}

export function heading4 () {
  return (
    <Heading4>Heading 4</Heading4>
  )
}

export function Text () {
  return (
    <div>
      <Paragraph>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</Paragraph>
      <Paragraph size='small'>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</Paragraph>
    </div>
  )
}

export function textLink () {
  return (
    <div>
      <Link href='https://vtfk.no'>Link</Link>
      <br />
      <Link noStyle href='https://vtfk.no'>Link without style</Link>
      <br />
      <Link size='small' onClick={() => { console.log('onClick!') }}>Link</Link>
    </div>
  )
}

export function skipLink () {
  return (
    <p>
      (Visible on tab)
      <br />
      <SkipLink href='https://vtfk.no'>Skip link</SkipLink>
    </p>
  )
}

export function errorMessage () {
  return (
    <ErrorMessage>Her er feilmeldingen</ErrorMessage>
  )
}
