@alfheim/generator-nef-stories-mdx

@alfheim/generator-nef-stories-mdx

This package is part of the battery used to create new components for the Nasdaq Experience Framework. This package creates an <ComponentName>.stories.mdx file, which contains component stories to display in Storybook.

In order to use MDX files in your Storybook, you will need to install the @storybook/addon-docs addon. For more information on how to get set up, please see here.

Note: It is recommended that you install and use generator-nef-component rather than installing this package directly, unless you need to modify the individual file generators.

By default, a component named Test created using this generator looks as follows:

import { Meta, Story, Preview } from "@storybook/addon-docs/blocks";
import { withKnobs } from "@storybook/addon-knobs/react";

import Test from ".";

<Meta title="Test" component={Test} decorators={[withKnobs]} />

# Test

<Preview>
  <Story name="basic use">
    <Test />
  </Story>
</Preview>

## Introduction

`Test` is a React component.

## Usage

\`\`\`javascript
import { Test } from "@nef/core";
\`\`\`

## Properties

| propName    | propType                           | defaultValue | isRequired | Description                                     |
| ----------- | ---------------------------------- | ------------ | ---------- | ----------------------------------------------- |
| `className` | string                             | -            | -          | is the class name of the component              |
| `children`  | oneOfType( node, arrayOf( node ) ) | -            | -          | is the children to be passed into component     |
| `style`     | object                             | -            | -          | is the style object to be passed into component |
| `name`      | string                             | -            | -          | id to be passed to the DOM                      |
| `id`        | string                             | -            | -          | name to be passed to the DOM                    |

Getting started

To install, simply run:

yarn add @alfheim/generator-nef-stories-mdx --dev

or

npm install @alfheim/generator-nef-stories-mdx --dev

Contributing

We'd love to have your helping hand on alfheim! Go over to our issues section and see if there's anything we're looking for help with OR open up a PR if you have an idea for a way to improve the library.

License

Alfheim is open source software licensed as MIT.