Fork me on GitHub
#reagent
<
2019-06-08
>
hyoo02:06:29

Hi I am trying to test material-ui 4.0 with reagent. everything was okay until 3.9, but the theme/styling does not work in 4.0. It looks like material-ui uses react hook in 4.0, and that seems be the breaking change. Is there an issue to adapt components using react hook in reagent?

hyoo03:06:25

nvm, I just found that there was a bug in an old version of hoist-non-react-statics.

Trevor14:06:47

Hi folks I'm using Material-UI and I'm trying to make a radio button list per this example: https://material-ui.com/components/radio-buttons/ And to make a FormControlLabel the control prop needs a react component I think So what would the proper hiccup syntax look like for something like the following?

<RadioGroup
          aria-label="Gender"
          name="gender1"
          className={classes.group}
          value={value}
          onChange={handleChange}
        >
          <FormControlLabel 
                value="female" 
                control={<Radio />}  ;; <== Cant' figure this one out! 
                label="Female" />
/>
I have something like this currently, but it says control is undefined at runtime
[:> RadioGroup
        [:> FormControlLabel {:control  (:> Radio) :value (str 1) :label "blah"}]        
        ]

valtteri15:06:25

Hi @trevor670! Try this:

:control (r/as-element [:> Radio {...}])
…`r` refers to reagent.core

valtteri15:06:28

Reasoning is that you’re handing a reagent component (hiccup) to material-ui and it can’t make sense of it. That’s why you need to transform it to a real react element yourself.

Trevor23:06:50

Thanks @valtteri! I'll give that a shot.