rsuite / rsuite.github.io Goto Github PK

React Suite documentation site. The library will stop updating. For documentation related issues, please visit https://github.com/rsuite/rsuite/tree/master/docs.

HTML 94.62% JavaScript 4.20% CSS 0.02% Dockerfile 0.01% Less 1.15%

rsuite react react-dom awesome-react-stuff react-components

rsuite.github.io's Introduction

English | 中文版

React Suite is a set of react component libraries for enterprise system products. It is a well-thought-out and developer-friendly UI framework.

UI Design

React Suite Design Prototype and specification, click to view.

Supported Platforms

Browser

React Suite supports the latest, stable releases of all major browsers and platforms. IE<=10 is no longer supported since React Suite 5.0. React Suite is designed and implemented for use on modern desktop browsers rather than mobile browsers.

IE	Edge	Firefox	Chrome	Safari
>=11	>=14	>= 45	>= 49	>= 10

Server

React Suite supports server side rendering. Support Next.js to build applications.

Supported development environment

Supports React 16 +
Supports TypeScript
Supports Electron
Supports Reason

Installation

React Suite is available as an npm package.

npm i rsuite --save

or if you prefer Yarn

yarn add rsuite

Usage

Here's a simple example

import { Button } from 'rsuite';
import 'rsuite/styles/index.less'; // or 'rsuite/dist/rsuite.min.css'

function App() {
  return <Button appearance="primary">Hello World</Button>;
}

Live preview on CodeSandbox

Documentation

You can go through full documentation or start with following sections

More examples

Previous major versions

The previous major version 4.x will no longer receive new features, and it is recommended to upgrade to the latest 5.x releases. Bug fixes for 4.x are still being supported for a period of time, and security fixes are supported until 6.x is in progress.

Documentations for previous major versions

Changelog

Detailed changes for each release are documented in the release notes.

Contribution

Make sure you've read the guidelines before you start contributing.

Supporting React Suite

If you like React Suite, you can show your support by either

Starring this repo
Leaving a comment here if you are using React Suite in your project (like we do 😄)
Becoming a backer on OpenCollective

This project exists thanks to all the people who contribute.

License

rsuite.github.io's People

Contributors

Stargazers

Watchers

rsuite.github.io's Issues

Datepicker format issue

I was trying to specify the format for DatePicker component to DD MMM YYY. It changes the format of date that is displayed post selection. But, the date that is displayed in the header section of the component is still displayed in default format. My expectation was that it would respect the format configuration too. Below in the image the difference can be seen.

How can set a lower limit for date for eg. 1900?

Also, in few places in documentation, Disabled has been spelt as Diasbled. It's minor but visible :)

unexpected extra eventListener binding on DOMHelper-events demo

https://rsuitejs.com/en/components/dom-helper

In the example code, a new eventListener will be created each time when button on is clicked

 <Button
    onClick={() => {
      this.listener = on(this.btn, 'click', () => {
        alert('click');
      });
    }}
  >

Broken Link in next.rsuitejs.com

Hello, In CheckerPicker component as well as Popup component, the container and prevent overflow sections refers to broken link which is

/**
 *  PreventOverflowContainer from
 *  https://github.com/rsuite/rsuite.github.io/blob/master/src/components/PreventOverflowContainer.js
 */

any idea if this can be fixed? I really need that PreventOverflowContainer, thanks!

Table margin between rows

Hello, it's possible to alter transform: translate3d(0px, 46px, 0px) on each table row to add a little bit margin?

so, instead of this

it will look like this

thank you

Update Right-to-left Guide

The content of https://rsuitejs.com/en/guide/rtl is outdated.

Timeline is always rendered broken

Hello,

hope someone can help with this...

I wanted to implement a Timeline component in my UI, so I copied the code from https://rsuitejs.com/en/components/timeline and pasted it into my app, so I could modify it and adapt it to my specific needs.

The problem is that the timeline is always rendered broken, here's a picture:

As you can see it's completely broken, and I have no idea how to make it work, since there's not much I can do, it should render exactly as what you show on the website docs.

Please advise. Thank you very much!