rsuite/rsuite

A suite of React components

Evans Obeng

@iamevansobeng

Does rsuite have a display property that can let me hide a particular component on mobile and visible on big screens ?

1 reply

UI Palette

@uipalette

So can i use it for mobile web development

1 reply

Glenn Welser

@glennwelser_twitter

Trying to set what month is displayed when opening the DatePicker. calendarDefaultDate doesn't seem to do it. Anyone know how to accomplish this? The calendar always opens to the current date.

Nisal K.

@Nzent

Is there any Card component? I couldn't find it😫

raslan3333

@raslan3333

Is there any Card component? I couldn't find it😫
@raslan3333
yes there is
u can use panel component as a card
go to Panel page and search for Card section

Nisal K.

@Nzent

@raslan3333 Founded, Thank you 👍

raslan3333

@raslan3333

you are welcome

thevjantony

@thevjantony_twitter

Hello, I want to change the color of SidNav to a different color (custom theme) and here is my import

import 'rsuite/dist/styles/rsuite-default.css';
import './custom-theme.less';

This is what I have in my custom-theme.less file

@base-color: #e91e63;

However I am not seeing this magenta color in my sideNav when the component is rendered

any idea what I am doing wrong?

ufhs14

@ufhs14

while not find ref in select ?

Rajorshi Roy

@royz

when I use a proxied component in a <FormControl> using the "accepter" property, the input field gets defocused each time the onChange property is triggered

Malcolm MacArthur

@mmacarthur_gitlab

Hello, when I follow the "Use in create-react-app Customize theme" Instructions exactly, I get an this error:

@line-height-large: unit(@line-height-large-computed / @font-size-large); // ~1.375
                                      ^
Error evaluating function `unit`: the first argument to unit must be a number. Have you forgotten parenthesis?
      Error in \node_modules\rsuite\lib\styles\variables.less (line 105, column 20)

Has anyone else received this error? I don't want to add parenthesis for every single division line, every time I install rsuite.

Boris Kremenovic

@bkremenovic

hello

anybody using autoHeight prop in <Table> ?

it's not working for me

1 reply

raslan3333

@raslan3333

does anybody know how to customize input style (like background)?

Simon Guo

@simonguo

Hello, when I follow the "Use in create-react-app Customize theme" Instructions exactly, I get an this error:
@line-height-large: unit(@line-height-large-computed / @font-size-large); // ~1.375
                                      ^
Error evaluating function `unit`: the first argument to unit must be a number. Have you forgotten parenthesis?
      Error in \node_modules\rsuite\lib\styles\variables.less (line 105, column 20)
Has anyone else received this error? I don't want to add parenthesis for every single division line, every time I install rsuite.

@mmacarthur_gitlab This problem has been fixed, caused by less 4.
rsuite/rsuite#1415

george-of-314

@george-of-314

<Table> component. If data json contains HTML code - how correctly output code in table? Now it shows Hello,<br />Lorem ipsum...... Also, how to set row height to auto? wordWrap autoHeight didn't help. Row height is still 46px (default value)

1 reply

Troy Morvant

@TroyMorvant

When I try to use the Steps component example with icons I get a typescript error:

1 reply

const instance = (
  <Steps current={1}>
    <Steps.Item title="Finished" icon={<Icon icon="pencil-square" size="lg" />} />
    <Steps.Item title="In Progress" icon={<Icon icon="book" size="lg" />} />
    <Steps.Item title="Waiting" icon={<Icon icon="wechat" size="lg" />} />
    <Steps.Item title="Waiting" icon={<Icon icon="steam-square" size="lg" />} />
  </Steps>
);

[!] Error: 'Icon' is not exported by node_modules/rsuite/es/index.js, imported by src/components/atomic/stepper/index.tsx
https://rollupjs.org/guide/en/#error-name-is-not-exported-by-module
src/components/atomic/stepper/index.tsx (1:56)
1: import {Steps, Panel, Placeholder, Button, ButtonGroup, Icon} from 'rsuite';
                                                           ^

dreizwo

@dreizwo

I have a styling issue according MultiCascader (Cascade OFF): When Multicascader cascade property is active and you select a child level parent level will be marked with a "minus". Wich is fine so that you can see that some of lower levels have been selected. When cascade is off these parent elements are not marked. Are there any workarounds to get them rendered like Cascade "on" but without having its functionality. (see Examples Multicasascader > Default and select Sichuan > Chengdu > Jingiang on cascade and not cascade)

Ismael Pérez

@Aventris__twitter

Hi huys.
I was doing the Table tree example from rsuite-table and i was wondering how can i set a custom padding to child elements

Ismael Pérez

@Aventris__twitter

Ok so i saw that the variable "LAYER_WIDTH" from
node_modules -> rsuite-table -> constants.js file controlls the padding of expadnded rows.
How can i changue LAYER_WIDTH value from my app?

Luca Ruggieri

@lruggieri

@TroyMorvant same issue with examples on Nav, Navbar, Sidevav or anything that uses the Icon component really.
Attempted import error: 'Icon' is not exported from 'rsuite'.

Kaharo

@Kaharo

hi guys. I am trying to make clicked row in Table look different ( changing bg color for row or cell in css) but struggling to do it. any examples you have seen?

Carlos Moreno

@clmoreno

Hi, i'm working on some designs and i'm wondering if you guys have any sketch, figma, ilustrator or photoshop file (or in any design tool) i can use to get the components design.

niroren

@niroren

anyone has experience with AutoComplete?

VikramRaju711

@VikramRaju711

hi i am new to react could anyone help me how to use these components i have installed rsuite but find no change in style ?

Carlos Moreno

@clmoreno

@VikramRaju711 follow the Quick start guide.
https://rsuitejs.com/guide/usage/

If styles is the issue maybe the css/less import is missing.

Add this line to your App.js
import 'rsuite/lib/styles/index.less'; // or 'rsuite/dist/styles/rsuite-default.css'

(use the .less file if your react environment supports less otherwise use the .css version )

Mauri

@MauriD20__twitter

Hi, im new to this feature. I want to set max-height to the List it displays, but cant find a way. could someone help me pls?

Joshua Weidema

@joshuaweidema_twitter

Maybe a dumb question but.. does anyone know if there is a scss-theme version out there?

mohier

@mohier

hi, i have a problem with modal responsive view

Abu Mubarak

@abumubarak-dev

Hello

Any support for media query?

Chukwuemeka Ifeora

@Emyboy

Hi there, I'm totally new to this. Those anyone know why the Modal isn't responsive on a mobile screen?

MarvelSQ

@MarvelSQ

Hi there, I'm totally new to this. Those anyone know why the Modal isn't responsive on a mobile screen?

rsuite component was not mobile compatible

moonlit

@moonlitusun

请问下你们的table滚动条有处理transform不是整数的时候会字体模糊的情况吗

1 reply

http://47.106.152.205/demo.png

滚动的时候的第一行很模糊

Arifullah irfann

@irfan1452

is it free to use ?

1 reply

Kaharo

@Kaharo

how to make sidenav menu as in rsuite (icons without texts)? Is it done with just sidenav without text?

george-of-314

@george-of-314

<Whisper placement="top" trigger="click" speaker={<Tooltip>Blah</Tooltip>}>Text</Whisper> - how to close tooltip in 5 seconds? Thanks

george-of-314

@george-of-314

The solution is: <Whisper .... open={this.state.open} onOpen={() => {setTimeout(function () {this.setState({open: !this.state.open})}.bind(this),5000)}}>

isshiren

@isshiren

Hello There,
Is there any idea to support for React17 ?

Where communities thrive

People

Repo info

Activity