buffer-components - Buffer's shared collection of React UI components 🤜🤛

  •        3

A shared set of UI Components using React and CSS Modules. To use this in your project start at the usage section. If you'd like to add to this library skip to component development.

https://github.com/bufferapp/buffer-components#readme
https://github.com/bufferapp/buffer-components

Dependencies:

@bufferapp/react-keyframes : 0.2.5
react-autocomplete : 1.7.2
react-day-picker : 6.2.1

Tags
Implementation
License
Platform

   




Related Projects

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.

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.

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.


jest-styled-components - Jest utilities for Styled Components

  •    Javascript

A set of utilities for testing Styled Components with Jest. This package improves the snapshot testing experience and provides a brand new matcher to make expectations on the style rules. Jest snapshot testing is an excellent way to test React components (or any serializable value) and make sure things don't change unexpectedly. It works with Styled Components but there are a few problems that this package addresses and solves.

dumb-react

  •    Javascript

Dumb React is a collection of React components used to create a static (dumb) website screen. Why do this? Many React tutorials or boilerplates I've encountered are either too basic ("here's a button component!") or more often too complex ("here's a simple babel typescript redux cssmodules isometric oh god oh god oh god..."). I wanted to be able to draw a straight line from how a simple component ("atom" in atomic design speak) makes its way into a full page. There are a ton of different ways to build reusable components and put dynamic content inside them, and many teams — even ones that aren't building highly-interactive web apps that would actually benefit from a tool like React — are reaching for React to create component-driven experiences. So in that spirit, I wanted to create a demo that shows how to construct a whole screen (even if it's a dumb, static one) out of React components.

rebass - :atom_symbol: React UI component library & design system, built with styled-components and styled-system

  •    Javascript

React UI component library & design system, built with styled-system, with support for styled-components & emotion. Rebass is a library of highly-composable, primitive UI components for React, built with styled-components to keep styles isolated and reduce the need to write custom CSS in your application. Based upon a configurable design system, Rebass‘s props API makes building consistent, responsive web apps simpler and faster.

snapguidist - Snapshot testing for React Styleguidist

  •    Javascript

Jest Snapshot Testing for React Styleguidist. In v4, snapshots have been renamed to .sg (as opposed to .snap) to avoid conflicts with Jest, and improve compatibility with create-react-app.

react-uwp - 📱⌨️ React Components that Implement Microsoft's UWP Design & Fluent Design.

  •    TypeScript

React Components that Implement Microsoft's UWP Design & Fluent Design System. Visit react-uwp.com online to review the API, see the components in action with live. Or build the documentation to locally.

ui-harness - Create, isolate and test modular UI components in React.

  •    Javascript

Isolate, test and document modular UI with React using familiar describe/it testing semantics. With the UIHarness you can go from an empty NPM module, to cleanly building isolated React components using best-practices in well under a minute.

design-system-react - Salesforce Lightning Design System in React

  •    Javascript

Welcome to the project! 👋 This library is the React implementation of the Salesforce Lightning Design System. This library has a peer dependency on @salesforce-ux/design-system, react, and react-dom. It is tested with React 16 and has a stable API despite its version number. Please polyfill this library in order to meet your target environment needs. Please view Create React App Setup for more information on using this library with Create React App.

snapshot-diff - Diffing snapshot utility for Jest

  •    Javascript

Diffing snapshot utility for Jest. Takes two values, and return their difference as a string, ready to be snapshotted with toMatchSnapshot(). Especially helpful when testing the difference between different React component states.

kit - Tools for developing, documenting, and testing React component libraries

  •    Javascript

Install the Kit CLI to get started with isolated component development. Create an examples folder for your components. This folder can be used for development, documentation, and testing purposes.

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.

react-testing-library - 🐐 Simple and complete React DOM testing utilities that encourage good testing practices

  •    Javascript

Simple and complete React DOM testing utilities that encourage good testing practices. You want to write maintainable tests for your React components. As a part of this goal, you want your tests to avoid including implementation details of your components and rather focus on making your tests give you the confidence for which they are intended. As part of this, you want your testbase to be maintainable in the long run so refactors of your components (changes to implementation but not functionality) don't break your tests and slow you and your team down.

react-testing-library - 🐐 Simple and complete React DOM testing utilities that encourage good testing practices

  •    Javascript

Simple and complete React DOM testing utilities that encourage good testing practices. You want to write maintainable tests for your React components. As a part of this goal, you want your tests to avoid including implementation details of your components and rather focus on making your tests give you the confidence for which they are intended. As part of this, you want your testbase to be maintainable in the long run so refactors of your components (changes to implementation but not functionality) don't break your tests and slow you and your team down.

reuse - ♻️ Reuse React components to create new ones

  •    TypeScript

Thanks to @eldargab for the package name on npm. This enables (sub)atomic design approach.

ant-motion - :bicyclist: Animate specification and components of Ant Design

  •    Javascript

Animation specification and components of Ant Design. Ant Motion is a motion design specification from Ant Design, and also provide a complete solution with lots of out-of-box animations for your React applications.





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.