All Projects → strapi → Buffet

strapi / Buffet

Buffet.js — React Components Library made with styled-components

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Buffet

Uniforms
A React library for building forms from any schema.
Stars: ✭ 1,368 (+228.85%)
Mutual labels:  react-components, component-library
tiny-ui
⚛️ A friendly UI component set for React.js
Stars: ✭ 202 (-51.44%)
Mutual labels:  react-components, component-library
Styleguide
The VTEX Design System and React component library.
Stars: ✭ 138 (-66.83%)
Mutual labels:  react-components, component-library
Axiom React
Axiom - Brandwatch design system and React pattern library
Stars: ✭ 41 (-90.14%)
Mutual labels:  react-components, component-library
Hiui
HIUI is a solution that is adequate for the fomulation and implementation of interaction and UI design standard for front, middle and backend.
Stars: ✭ 366 (-12.02%)
Mutual labels:  react-components, component-library
Paragon
💎 Accessible components done right.
Stars: ✭ 52 (-87.5%)
Mutual labels:  react-components, component-library
paragon
💎 An accessible, theme-ready design system built for learning applications and Open edX.
Stars: ✭ 85 (-79.57%)
Mutual labels:  react-components, component-library
Pivotal Ui
Pivotal's design system & component library
Stars: ✭ 637 (+53.13%)
Mutual labels:  react-components, component-library
engage-ui
Engage UI is a React component library designed to help developers and designers creater the delightful web experiences.
Stars: ✭ 14 (-96.63%)
Mutual labels:  react-components, component-library
fyndiq-ui
Library of reusable web frontend components for Fyndiq
Stars: ✭ 39 (-90.62%)
Mutual labels:  react-components, component-library
React Atlas
Composable React components with CSS Modules.
Stars: ✭ 36 (-91.35%)
Mutual labels:  react-components, component-library
Operational Ui
Building blocks for effective operational interfaces
Stars: ✭ 258 (-37.98%)
Mutual labels:  react-components, component-library
Baseweb
A React Component library implementing the Base design language
Stars: ✭ 7,213 (+1633.89%)
Mutual labels:  react-components, component-library
Neumorphic Ui
📚 A library of components based on the concept of neumorphism
Stars: ✭ 82 (-80.29%)
Mutual labels:  react-components, component-library
Awesome Ui Component Library
Curated list of framework component libraries for UI styles/toolkit
Stars: ✭ 702 (+68.75%)
Mutual labels:  react-components, component-library
Semantic Ui React
The official Semantic-UI-React integration
Stars: ✭ 12,561 (+2919.47%)
Mutual labels:  react-components, component-library
Cp Design
A configurable Mobile UI Components(React hooks+Typescript+Scss)组件库
Stars: ✭ 465 (+11.78%)
Mutual labels:  react-components, component-library
Circuit Ui
SumUp's component library for the web
Stars: ✭ 625 (+50.24%)
Mutual labels:  react-components, component-library
lerna-starter
Simple React UI Development environment boilerplate to develop, test and publish your React components.
Stars: ✭ 55 (-86.78%)
Mutual labels:  react-components, component-library
smores-react
🍭 Marshmallow React components
Stars: ✭ 34 (-91.83%)
Mutual labels:  react-components, component-library



React Components Library made with styled-components

Monthly download on NPM Travis Build Status Strapi on Slack

Getting Started

Installation

Using yarn

yarn add @buffetjs/core @buffetjs/hooks  @buffetjs/styles
# Install the required dependencies
yarn add lodash prop-types react react-dom react-router-dom styled-components

or npm

npm install @buffetjs/core @buffetjs/styles @buffetjs/hooks --save
# Install the required dependencies
npm install lodash prop-types react react-dom react-router-dom styled-components --save

Example

Import buffet.js into your project as follows:

import React from 'react';
import {
  Enumeration,
} from '@buffetjs/core';

const Page = () => {
  const [state, setState] = React.useState('milk');

  return (
    <header>
      <p>Title</p>
    </header>
    <section>
      <Enumeration
        name="enumeration"
        onChange={({ target: { value } }) => setState(value)}
        options={[
          {
            value: 'flour',
            label: 'Flour',
          },
          {
            value: 'milk',
            label: 'Milk',
          },
          {
            value: 'butter',
            label: 'Butter',
          },
        ]}
        value={state}
      />
    </section>
    <footer>
      Made with love by Strapi
    </footer>
  );
}

export default Page;

Documentation

See the documentation at buffetjs.io/storybook for more informations.

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].