All Projects → ticketmaster → storybook-styled-components

ticketmaster / storybook-styled-components

Licence: Apache-2.0 License
No description or website provided.

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to storybook-styled-components

Storybook Addon Styled Component Theme
storybook addon
Stars: ✭ 168 (+121.05%)
Mutual labels:  styled-components, addon, storybook
Storybook Addon
Develop themable components with Emotion/Styled Components/Material-UI with help of Storybook & React Theming
Stars: ✭ 122 (+60.53%)
Mutual labels:  styled-components, addon, storybook
chicio.github.io
👻 Fabrizio Duroni (me 😄) personal website. Created using GatsbyJS, Styled Components, Storybook, Typescript, tsParticles, GitHub pages, Github Actions, Upptime.
Stars: ✭ 20 (-73.68%)
Mutual labels:  styled-components, storybook
storybook-addon-next
A no config Storybook addon that makes Next.js features just work in Storybook
Stars: ✭ 184 (+142.11%)
Mutual labels:  addon, storybook
create-material-ui-app
create-react-app + storybook + storybook-addon-material-ui
Stars: ✭ 55 (-27.63%)
Mutual labels:  addon, storybook
React Loading
Build a smooth and lightweight react component loading with css 🎉 .
Stars: ✭ 234 (+207.89%)
Mutual labels:  styled-components, storybook
Arc
React starter kit based on Atomic Design
Stars: ✭ 2,780 (+3557.89%)
Mutual labels:  styled-components, storybook
storybook-addon-mock
This addon allows you to mock fetch or XMLHttpRequest in the storybook.
Stars: ✭ 67 (-11.84%)
Mutual labels:  addon, storybook
storybook-addon-headless
A Storybook addon to preview content from a headless CMS in components
Stars: ✭ 23 (-69.74%)
Mutual labels:  addon, storybook
paygreen-ui
UI PayGreen Components: React, Styled Component
Stars: ✭ 29 (-61.84%)
Mutual labels:  styled-components, storybook
smores-react
🍭 Marshmallow React components
Stars: ✭ 34 (-55.26%)
Mutual labels:  styled-components, storybook
Govuk React
An implementation of the GOV.UK Design System in React using CSSinJS
Stars: ✭ 219 (+188.16%)
Mutual labels:  styled-components, storybook
Lerna Yarn Workspaces Monorepo
🐉 A Monorepo with multiple packages and a shared build, test, and release process.
Stars: ✭ 201 (+164.47%)
Mutual labels:  styled-components, storybook
storybook-xstate-addon
A storybook addon to assist with writing stories that rely on xstate
Stars: ✭ 48 (-36.84%)
Mutual labels:  addon, storybook
2019 12
🎟 급증하는 트래픽에도 안정적인 예약 서비스, Atomic Pattern을 적용한 재사용 가능한 컴포넌트, 실용적인 Testing을 주제로 하는 이벤트 서비스
Stars: ✭ 169 (+122.37%)
Mutual labels:  styled-components, storybook
react-library-starter
A library starter kit and bundler for your React projects, powered by Rollup. ⚡
Stars: ✭ 22 (-71.05%)
Mutual labels:  styled-components, storybook
React95
A React components library with Win95 UI
Stars: ✭ 1,779 (+2240.79%)
Mutual labels:  styled-components, storybook
medly-components
🧩 Medly components provides numerous themable react components, each with multiple varitaions of sizes, colors, position etc.
Stars: ✭ 66 (-13.16%)
Mutual labels:  styled-components, storybook
blue-collar-rocket
I built this as a capstone project of our web development boot camp. Blue Collar Rocket is an app to streamline processes in craftsmanship.
Stars: ✭ 13 (-82.89%)
Mutual labels:  styled-components, storybook
react-awesome-notifications
A beautiful fully customizable React + Redux notification system built with styled-components
Stars: ✭ 29 (-61.84%)
Mutual labels:  styled-components, storybook

storybook-styled-components

DEPRECATED!

This plugin has issues when used with Storybook v5 and beyond, and there's a better option available at: https://github.com/echoulen/storybook-addon-styled-component-theme

Theme Picker Animation

Switch between themes and see how your components react

Set It Up

inside your storybook addons, register the storybook-styled-components:

// addons.js
import "storybook-styled-components/register";

In your config.js, define your theme configuration and pass it in to the addDecorator function

// config.js
import { configure, addDecorator } from "@storybook/react";
import { withThemes } from "storybook-styled-components";

// then import your themes
import firstTheme from "./src/themes/first";
import secondTheme from "./src/themes/second";

const themes = {
  "First Theme": firstTheme,
  "Second Theme": secondTheme
};

// now add the decorator
addDecorator(withThemes(themes));
// done!

This is still a Work In Progress ... Feedback welcomed

Read The License

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].