Questions tagged [react-with-styles]

react-with-style is a package in npm, which provides styles to enhance components in React.

29 questions
4
votes
2 answers

How I can access to DOM node inside of withStyle component?

I'm working on react project and in this project my colleagues and I are using Material UI, for some reason I wanna access to DOM node of another component that wrapped by a HOC. I used react ref for this. but I just get the withStyle object, see…
user10516706
4
votes
1 answer

How can I use a custom theme with react-dates?

I'm trying to style my react-dates DayPickerRangeController in Typescript, using react-with-styles and Aphrodite. I'm using this code, emulating the code from https://github.com/airbnb/react-dates#interfaces: const ThemedStyleSheet =…
MaxGabriel
  • 7,617
  • 4
  • 35
  • 82
4
votes
1 answer

Using Airbnb's "react-with-styles" in React Native

Does anyone have a clear example of how to use react-with-styles (with react-with-styles-interface-react-native) inside a React Native project? The only example provided in their GitHub page is for a React project.
3
votes
1 answer

Writing CSS in JS code to remove arrow buttons from TextField

I am building a webpage with React and Material-UI. I have a TextField element and I want to remove the arrow buttons - if I were using CSS I would use the following…
user2260199
  • 877
  • 4
  • 13
  • 20
2
votes
2 answers

withSyles HOC does not pass innerRef along with other props when passing through React.forwardRef

I'm passing the ref using React.forwardRef to the down component which usually works. )} .../> However when I have HOC (higher order component)…
2
votes
1 answer

How to change font color of disabled TextField Material UI React js

I'm trying to change disabled TextField font color and I followed related questions about it in stackoverflow but when I create a new TextField like below it does not work and shows nothing. import {withStyles} from…
2
votes
1 answer

Typescript shows error after wrapping a React component with withStyles and withTranslation HOC

I'm trying to write a React component using Typescript, withStyles from @material-ui/core and withTranslation from react-i18next. Both of this wrappers are HOC. Typescript complains that there is an error about types. For some reason this line does…
Zied Hf
  • 491
  • 3
  • 10
  • 30
1
vote
1 answer

Material-UI: The key `paperFullWidth` provided to the classes prop is not implemented in WithStyles(ForwardRef(Dialog))

Material-UI: The key paperFullWidth provided to the classes prop is not implemented in WithStyles(ForwardRef(Dialog)). You can only override one of the following: root.
Gülsen Keskin
  • 657
  • 7
  • 23
1
vote
2 answers

React withStyles throws error when using 'direction'

I have a simple React website and am using the withStyles feature to pass styles to a material-ui Grid element. When trying to use direction: "column" in the style, I get the error message included below. This is in a .jsx file. I have found a fix…
jpc
  • 129
  • 3
  • 16
1
vote
1 answer

Invoke nested child method using refs reactJS WithStyles

I am trying to access a method in a nested chilld component using refs. This is to delete data in the nested delete component. My code is as follows (simplified code): Parent Class: class Parent extends Component { constructor(props) { …
toing_toing
  • 2,334
  • 1
  • 37
  • 79
1
vote
1 answer

How can I return a react component using withStyles?

The question here is not about how to export, but, how to return a React object with the css injected? I'm trying to achieve something like it: return ( withStyles(this.props.style)() ); Where the intention is to return…
Dan
  • 1,518
  • 5
  • 20
  • 48
1
vote
1 answer

Can I make styles apply to classes other than the first defined in a file?

I have inherited some code and I've been manipulating it, but I came across something that makes me scratch my head. I am not sure whether the issue I am having relates to specifically to react.js or more generally to CSS / javascript... In this…
levraininjaneer
  • 1,157
  • 2
  • 18
  • 38
1
vote
0 answers

React Material-UI: open dialog by button (in higher level) with createRef not working with using 'withMobileDialog'

In my demo here https://codesandbox.io/s/zq833pq6o3 you can open one dialog(Child-Dialog) in two different ways. by an button who is in this dialog (Button: OPEN BY THIS) by an button from the parent level (Button: OPEN BY REF) But the same case…
0
votes
1 answer

how to adapt withStyles for mui v5?

If we have a legacy MUI snippet like this: import React from 'react'; import { withStyles } from '@material-ui/core/styles'; import Paper from '@material-ui/core/Paper'; import Grid from '@material-ui/core/Grid'; import Hidden from…
user9695260
  • 347
  • 3
  • 17
0
votes
0 answers

How to pass props in withStyles?

Is this the right way? const styles = { text : props => ({ color : props.color, }) } By following this, the color is being applied to the text. But on refreshing, the color which was passed through props vanishes and the default black…
1
2