React Advanced
React Advanced is a library with high-performance, customizable and perfect React components. See the list of available components
Principles
- High performance
- No dependencies. Small bundle size
- Semver. No breaking changes on the patch version
- Easy customization
- Zero bugs policy
- Easy start with default behavior
Installation
yarn add react-advanced
or
npm install --save react-advanced
Usage
import React from 'react';
import { render } from 'react-dom';
import SidebarLayout from 'react-advanced/SidebarLayout';
const Sidebar = (props) => (
<div style={{ width: 300 }}>
<button onClick={() => props.toggle(false)}>Close</button>
Your Sidebar
</div>
);
const App = () => (
<SidebarLayout Leftbar={Sidebar} Rightbar={Sidebar}>
{props => (
<div style={{ textAlign: 'center' }}>
<button style={{ float: 'left' }} onClick={() => props.toggleLeftbar()}>Open left</button>
Your content
<button style={{ float: 'right' }} onClick={() => props.toggleRightbar()}>Open right</button>
</div>
)}
</SidebarLayout>
);
render(<App />, document.getElementById('root'));
Components
- SidebarLayout - A layout component with material sidebars
Contribution
Write your ideas or feedback about library to the issues. Vote for features in which you are interested. Contribution guide will be added soon.