Material-ui: JSS array syntax stopped working

[EliyaD]

Since JSS comes bundled in material-ui I am guessing that the problem is with your fork.

When I do

const styles = theme => ({
  main: {
    margin: [100, 50]
  }
})

I get margin: 100px, 50px; Notice the comma between the values.

If id do just

const styles = theme => ({
  main: {
    margin: 100
  }
})

it works fine

[TheHolyWaffle]

Are you using the builtin material-ui withStyles? Might be related to #9293 then, vendor prefixing also doesn't work. Looks like a plugin problem in general.

[giapelle]

Same problem here with version 1.0.0-beta.22
jss-expand seem completely broken (or not loaded?)
With beta.21 all was ok.

[zhming0]

We have the same problem in beta-22. JSS presets were not loaded I think?

[EliyaD]

This is not a vendor prefix issue, this is only array syntax issue with any CSS rule that accepts such (using withStyles).
Also, I am using beta 21, not 22

[tony-kerz]

with beta-22, i'm seeing:

padding: [1, 2, 3, 4]

converted to:

padding: 1px, 2px, 3px, 4px;

which chokes cause should convert to the below (no commas between values):

padding: 1px 2px 3px 4px;

[moshensky]

Probably something with the jss config. If you configure it manually all works correctly:

import { SheetsRegistry } from 'react-jss/lib/jss'
import JssProvider from 'react-jss/lib/JssProvider'
import { create } from 'jss'
import preset from 'jss-preset-default'
import createGenerateClassName from 'material-ui/styles/createGenerateClassName'
const jss = create({ plugins: preset().plugins })
jss.options.createGenerateClassName = createGenerateClassName

<JssProvider jss={jss}>
  <theme provider> and whatever make sense in your case
</JssProvider>

You could read more css in js and right to left example is pretty good

[rosskevin]

This is very likely https://github.com/mui-org/material-ui/pull/9129

Please review the release notes https://github.com/mui-org/material-ui/releases/tag/v1.0.0-beta.22

[rosskevin]

So this appears to be as expected, I'm going to close this issue since there has been no further comments for 4 days.

[ilyador]

Is there a material-ui specific way to enable this plugin?