import { Meta } from '@storybook/blocks';
import { parameters } from './utils/docsPage.js';

<Meta title="Intro" parameters={{ ...parameters }} />

# @reuters-graphics/graphics-components

<p>
  <a href="https://www.npmjs.com/package/@reuters-graphics/graphics-components">
    <img src="https://badge.fury.io/js/@reuters-graphics%2Fgraphics-components.svg" alt="npm version" style={{ display: 'inline-block', margin: '0 5px 0 0' }} />
  </a>

  <a href="https://github.com/reuters-graphics/graphics-components">
    <img src="https://badgen.net/badge/icon/GitHub?icon=github&label" alt="GitHub" style={{ display: 'inline-block', margin: '0 5px 0 0' }} />
  </a>
</p>

Svelte components, SCSS and more you can use in graphics projects.

## Getting started

1. Install

```bash
pnpm i @reuters-graphics/graphics-components
```

2. Checkout the [guides](?path=/docs/guides-using-these-docs--page), if you haven't, or dive straight into the docs to start using components.

```svelte
<script>
  import { BodyText } from '@reuters-graphics/graphics-components';
</script>

<BodyText text={'Hello world!'} />
```