Write Storybook in ClojureScript with ease.
Library is still undergoing development, so expect frequent changes to the API. The current version only supports Reagent.
fan-fiction
does not include Reagent as its dependency, so
add both as the development dependency to your tool of choice.
fan-fiction.reagent
contains two macros:
foreword
: creates thedefault
property that Storybook expects.defstory
: well, the story.
(ns hello.world
(:require [fan-fiction.reagent :refer [foreword defstory]]))
(defn greeting [person] ;; this probably should be in a different namespace
[:h1 "Hello, " person "!"])
(foreword :title "Greeting component"
:component greeting
:hide-controls false) ;; default is true
(defstory hello-world [greeting "World"])
hide-controls
is an alias of the longer hideNoControlsWarning
setting.
The equivalent Component Story Format (CSF) in JavaScript is as follows:
import React from 'react';
import { Greeting } from './greeting';
export default {
title: 'Greeting component',
component: Greeting,
parameters: {controls: {hideNoControlsWarning: false}}
};
export const HelloWorld = () => <Greeting name='World' />;
Copyright © 2021 Shaolang Ai
Distributed under the MIT License