storybook-state - Manage component state in React storybook.

  •        54

An extension for Storybook that manages the state of a stateless component. This makes it easier to write stories for stateless components. Register the extension in addons.js.

https://github.com/dump247/storybook-state#readme

Dependencies:

react-json-view : ^1.13.3

Tags
Implementation
License
Platform

   




Related Projects

storybook - UI component dev & test: React, Vue, Angular, React Native, Ember, Web Components & more!

  •    TypeScript

Storybook is a development environment for UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components. Storybook runs outside of your app. This allows you to develop UI components in isolation, which can improve component reuse, testability, and development speed. You can build quickly without having to worry about application-specific dependencies.

storybook - Interactive UI component dev & test: React, React Native, Vue, Angular

  •    Javascript

Storybook is a development environment for UI components. It allows you to browse a component library, view the different states of each component, and interactively develop and test components. Storybook runs outside of your app. This allows you to develop UI components in isolation, which can improve component reuse, testability, and development speed. You can build quickly without having to worry about application-specific dependencies.

loki - 👁 Visual Regression Testing for Storybook

  •    Javascript

There are a few visual regression tools for the web, but most either cannot be run headless or use phantomjs which is deprecated and a browser nobody is actually using. They usually also require you to maintain fixtures. With react-native it's now possible to target multiple platforms with a single code base, but there's no single tool to test all to my knowledge. Loki aims to have easy setup, no to low maintenance cost, reproducible tests independent of which OS they are run on, runnable on CI and support all platforms storybook does.

react-popover - A smart popover component for ReactJS

  •    Javascript

react-popover >= 0.5.0 supports React 16 while react-popover < 0.5.0 works with React 15.x.x and likely lower. There is no plan to support older versions of this library with back-ported patches and PRs for that purpose are not welcome since it increases maintenance for the authors. Look at the stories in our storybook.


storybook-deployer - Deploy your storybook as a static site

  •    Javascript

Then you can run npm run deploy-storybook to deploy the Storybook to GitHub Pages. Make sure to set the output directory as .out.

storybook-deployer - Deploy your storybook as a static site

  •    Javascript

Then you can run npm run deploy-storybook to deploy the Storybook. If you need to configure the output directory you can supply the out flag.

vue-play - 🍭 A minimalistic framework for demonstrating your Vue components

  •    Javascript

A minimalistic framework for demonstrating your Vue components, inspired by react-storybook. The only thing you really need to worry about is ./play/index.js, since you will write scenarios or dynamically load scenarios there.

Storybook

  •    Java

Are you a novelist, a writer or an author? Storybook is a scene-based software for all creative writers that helps to organize your story. Storybook assists you in structuring your book.

design-system - Storybook Design System

  •    Javascript

Note: this design system is not used in Storybook's UI. The stack is different and theming requirements of Storybook add complexity beyond the scope of this project. However, Storybook's visual design is identical to what's here. The Storybook design system codifies existing UI components into a central, well-maintained repository. It is built to address having to paste the same components into multiple projects again and again. This simplifies building UI's with Storybook's design patterns.

arc - React starter kit based on Atomic Design

  •    Javascript

ARc (Atomic React) is a React starter kit based on the Atomic Design methodology. It's progressive, which means that you can start with the basic boilerplate and try the other features when you are comfortable. If you find this useful, please don't forget to star ⭐️ the repo, as this will help to promote the project. Follow me on Twitter and GitHub to keep updated about this project and others.

ignite-andross - The original React Native boilerplate from Infinite Red - Redux, React Navigation, & more

  •    Javascript

NOTE: This repo has been renamed from ignite-ir-boilerplate-andross to ignite-andross. Although web traffic and git operations for the previous name will be redirected, we recommend you update any links and git urls for this repo. You can also change the React Native version; just keep in mind, we may not have tested this just yet.

constate - Scalable state manager using React context

  •    TypeScript

React state management library built with scalability in mind. You can start simple with local state and scale up to global state with ease when needed. In computer science, a container is a class, a data structure, or an abstract data type (ADT) whose instances are collections of other objects. In other words, they store objects in an organized way that follows specific access rules.

react-automata - A state machine abstraction for React

  •    Javascript

A state machine abstraction for React that provides declarative state management and automatic test generation. react and react-test-renderer are peer dependencies.

react-powerplug - :electric_plug: Renderless Containers

  •    Javascript

React PowerPlug is a set of pluggable renderless components and helpers that provides different types of state and logic utilities that you can use with your dumb components. It creates state and passes down the logic to the children, so you can handle your data. Read about the Render Props pattern.

reactn - React, but with built-in global state management.

  •    TypeScript

ReactN is a extension of React that includes global state management. It treats global state as if it were built into React itself -- without the boilerplate of third party libraries. For support, reach out to us on the Reactiflux Discord channel #reactn.

reach-ui - The Accessible Foundation for React Apps and Design Systems.

  •    Javascript

Now you can edit the files in packages/* and storybook will automatically reload your changes. Note: If you change an internal dependency you will need to run yarn build again. For example, if working on MenuButton requires a change to Rect (an internal dependency of MenuButton), you will need to run yarn build for the changes to Rect to show up in your MenuButton example.

redux-form - A Higher Order Component using react-redux to keep form state in a Redux store

  •    Javascript

redux-form works with React Redux to enable an html form in React to use Redux to store all of its state. You can play around with redux-form in these sandbox versions of the Examples.





We have large collection of open source products. Follow the tags from Tag Cloud >>


Open source products are scattered around the web. Please provide information about the open source projects you own / you use. Add Projects.