[bug] Docs say syntax one way, but output is another way.

Expected behavior:

The docs on Alternative syntax for space and comma separated values say that

export default {
  button: {
      border: ['1px solid red', '1px solid blue'],
  },
};

should compile to

.button-0-1-179 {
  border: 1px solid red, 1px solid blue;
}

Describe the bug:

But instead it is missing a comma, so the output looks like

.button-0-1-179 {
  border: 1px solid red 1px solid blue;
}

so there’s either a bug with the docs, or a bug with the lib. Which one?

Note that the docs for jss-extended Full syntax conflict with the Core JSON syntax doc.

The output for

  a: {
    border: [
      // Numbers can become default unit automatically.
      [1, 'solid', 'red'],
      [1, 'solid', 'blue']
    ]
  },

looks as expected, with a comma.

Codesandbox link:

Paste

export default {
  button: {
      border: ['1px solid red', '1px solid blue'],
  },
  a: {
    border: [
      // Numbers can become default unit automatically.
      [1, 'solid', 'red'],
      [1, 'solid', 'blue']
    ]
  },
};

into the repl.

(P.S. It would be neat if the repl updated the URL with a query so we can paste a repl URL and the visitor can see the same code, like the Babel repl).

Versions (please complete the following information):

• see repl

[kof]

Mb though it needs to be fixed in the docs, because for jss-expand it probably does make sense. Its just confusing that we have different output for the same syntax.

Plugins should add syntax, but not change the existing syntax in a confusing way.

[kof]

Btw. even in the core, the simple [] syntax can be used, because it needs nothing special, it will be just converted to a string by js.