Hi @abhilashWipadika alredy is available the new version 1.16.0 of react-rainbow-components, here you can review the release notes https://github.com/nexxtway/react-rainbow/releases/tag/v1.16.0
1 reply
Hi, I'm getting this error in nextjs
And here's
isValidColor.js"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports["default"] = isValidColor;
function isValidColor(color) {
var element = document.createElement('a');
element.style.color = color;
return element.style.color !== '';
}
@mDinni it is in our roadmap
@mDinni you can check some solutions nexxtway/react-rainbow#939, also we have one example here nexxtway/rainbow-next-experience#1
Can you provide more info about your use case, thus we can review it
Gladly! I want to have users guess on a date that a child will be born on. The creator of the pool (expecting parent) gives the expected due date (for example December 15). Once the users (friends and family of the expecting parents) come to give their votes/bets/hunches they would click on a calendar that should in this case open on December by default, without having Dec-15-2020 already in the defaultValue of the calendar. Especially if the parents decide to describe the due date as "around Christmas", "mid-December" or similar, instead of picking a date.
PhoneInput you can use it from version v1.16.0
const theme = {
rainbow: {
palette: {
brand: "#80deea",
mainBackground: "#303030",
// secondaryBackground: "#383838"
}
}
};
const Container = styled.div`
background-color: ${props => props.theme.rainbow.palette.background.secondary};
height: 100%;
`;
ReactDOM.render(
<Provider store={store}>
<Application theme={theme}>
<Container>
<App />
</Container>
</Application>
</Provider>,
document.getElementById("root")
);
Can anyone tell me what I did wrong in this. I'm trying to change my whole application to the cyan dark mode from the Q&A but when I run it, it says that the rainbow prop is undefined. I don't know why I'm facing this because just a little while ago it was running as intended and I don't see any difference from the example code in the Q&A and mine.
And I would also like to know if radio group component can be shown horizontally as a row or not? By default it shows only in column wise.
@nemethzoli1997_gitlab generally we limit the amount of props in a component, while use cases appear we will be adding props to support them, in this way we keep the components API as clean as possible and limiting possibles breaking change in the future
In this case max and min are valid uses of the input and we should add them, I will add it to our road map, thanks for you feedback
In this case max and min are valid uses of the input and we should add them, I will add it to our road map, thanks for you feedback
@Nabanit33503728_twitter You are referring to the RadioGroup component right? https://react-rainbow.io/#/RadioGroup If so, that component now only supports landscape view but it would be a nice addition to be able to change the orientation.
Anyway maybe the RadioButtonGroup component can fit your use case https://react-rainbow.io/#/RadioButtonGroup
Thanks for your feedback, we will discuss your proposal
Anyway maybe the RadioButtonGroup component can fit your use case https://react-rainbow.io/#/RadioButtonGroup
Thanks for your feedback, we will discuss your proposal
Hi @minhho3199 can you tell me which version of
styled-components are you using? I think this could be the problem.
How can I manually customize the size of the Avatar component? I used the size prop and set it to large but it was too small for me so I want to make it a custom size
@nemethzoli1997_gitlab the library has issues when used with next.js, you can use some components but others will break your app, here is an example of how you can use it:
https://github.com/nexxtway/rainbow-next-experience
Although supporting next.js is in our road map
https://github.com/nexxtway/rainbow-next-experience
Although supporting next.js is in our road map
@TahimiLeonBravo Thank you for the answer. There is an unrelated question that I want to ask. I see that the value prop of the Input component prevents you from editing the text in the input. However I need the value prop as I need to display info that I fetch from the back end. But now I'm unable to make edits to the input. I'm thinking that the solution is in the onChange prop but I don't yet know how to implement it
@nemethzoli1997_gitlab That would be great!! You can start by finding a component that don’t render in next.js then you can open an issue to discuss about what is the problem and how we can fix it, then when discussion is finished you can submit a PR with the fix.
Note that some components will work fine with ssr but others use things like the window or the document, then this will crash. We need to research about how the community solve this issues and the different approaches to takle this.
Note that some components will work fine with ssr but others use things like the window or the document, then this will crash. We need to research about how the community solve this issues and the different approaches to takle this.
@minhho3199 the input is a controlled component that means that you will have to props to control it onChange and value, every time you type the onChange will send a new value and you need to keep a state to hold that new value and send it back to the input through the value prop like:
const [value, setValue] = useState(initValue);
return (
<Input value={value} onChange={(event) => setValue(event.target.value)} />
);
I think we should add a controlled example with a initial value set in the input