n0x3u5 / fusionbook

Develop and test FusionCharts components in isolation

FusionBook

Develop and test FusionCharts components in isolation

API

import FusionBook, { Story } from 'fusionbook';
import SmartRendererParser from 'fusionbook/smart-renderer.js';
import HTMLParser from 'fusionbook/html.js';
import LegendItem from './legend-item.js';

// Instill the ability to understand SmartRenderer components to FusionBook
FusionBook.registerParser(SmartRendererParser);
FusionBook.registerParser(HTMLParser);

// Creates a story named "Legend Item"
const legendItemStory = new Story('Legend Item');

// Adds a "with defaults" chapter to the story
legendItemStory.addChapter(
  'with defaults',
  story => story.attachChild(LegendItem)
);

// Adds a "with background" chapter to the story
legendItemStory.addChapter(
  'with background',
  story => story.attachChild(LegendItem).configure({ showBackground: true })
);

// Creates a story named "Div Element"
const divStory = new Story('Div Element');

// Adds a "with 50% opacity" chapter to the story
divStory.addChapter(
  'with 50% opacity',
  story => {
    const divElement = document.createElement('div');

    divElement.style.opacity = 0.5;

    story.appendChild(divElement);
  }
);

// export the created stories
export default [legendItemStory, divStory];

CLI

# Starts a server at localhost:3000 with the stories in the given folder
fusionbook --load "path/to/main/stories/file.js"

fusionbook's Issues

Prevent dist from being tracked by git

Use custom build CSS for Semantic UI

Scaffold the folder structure for the cli, the library and the client

Add support for nested chapters

Styling of components

Create base FusionBook component

Create component to show info in tabs

Decide API to create a FusionBook and its Chapters

Create Sidebar component

Create component to load the visual