Visitar URL original
GitHub - timthing/storybook-addons-abstract: Storybook addon for linking Abstract layer and collection shares to stories · GitHub
Skip to content

About

Storybook addon for linking Abstract layer and collection shares to stories

Resources

Stars

0 stars

Watchers

0 watching

Forks

 
 

Repository files navigation

Storybook addon for Abstract integration

A addon for storybook that allows you to link to Abstract layers and collections in the storybook panel!

Example

Examples

Install

npm install @timthing/storybook-addons-abstract@latest

Usage

within addons.js:

import '@timthing/storybook-addons-abstract/register';

within your stories:

import React from "react";
import { storiesOf } from "@storybook/react";

storiesOf("Blog", module)
  .addParameters({
    abstract: {
      // Copy a collection or layer share url from Abstract
      url: "https://share.goabstract.com/733ca894-a4bb-43e3-a2b1-dd27ff6d00c4"
    }
  })
   // Name your stories after layers in the collection
  .add("Blog Index", () => <BlogIndex />)
  .add("Blog Gallery", () => <BlogGallery />)
  .add("Blog Post", () => <BlogPost />);

or using the new Component Story Format api:

import React from "react";
import { BlogIndex, BlogGallery, BlogPost } from "../";

export default {
  parameters: {
    abstract: {
      // Copy a collection or layer share url from Abstract
      url: "https://share.goabstract.com/733ca894-a4bb-43e3-a2b1-dd27ff6d00c4"
    }
  }
};

// Name your stories after layers in the collection
export const blogIndex = () => (
  <BlogIndex />
);

export const blogGallery = () => (
  <BlogGallery />
);

export const blogPost = () => (
  <BlogPost />
);

About

Storybook addon for linking Abstract layer and collection shares to stories

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages