npm.io
4.0.1 • Published 1 week ago

@epilot/base-elements

Licence
MIT
Version
4.0.1
Deps
15
Size
4.6 MB
Vulns
0
Weekly
0
Install scriptsThis package runs scripts during installation (preinstall/install/postinstall)

@epilot/base-elements

General purpose React components for epilot UI elements.

base-elements.dev.epilot.io

Based on Material UI

Quick start

yarn
yarn start

Storybook

yarn run storybook
yarn run build-storybook

Run locally on http://localhost:5500/bundle.js

Contributing MDX (markdown documentation)

Add a .stories.mdx file alongside the story (example: stories/Progress.design.stories.mdx)

Add a <Meta> tag as follows:

import { Meta } from '@storybook/addon-docs';
import { Progress } from '../src';

<Meta title='Elements/Feedback/Progress/Design' component={Progress} />;

Pass the component you're documenting, as well as a title according to where you want your story to show up in navigation:

Example navigation

You can then add your documentation with markdown, embedded stories and images, as shown in this full example:

import { Canvas, Meta, Story } from '@storybook/addon-docs';
import { Progress } from '../src'

<Meta
  title="Elements/Feedback/Progress/Design"
  component={Progress}
/>

# Progress Indicator

Embedded story
<Canvas>
  <Story id="elements-feedback-progress--circular-progress-indeterminade-story" />
</Canvas>

Here is an image using Markdown:

![My image](/img/progress-image-demo.png)

Here is an image using MDX:

<img src="/img/progress-image-demo.png" alt="My image" />