JSS plugin that ensures style properties extend each other instead of override

Inspired by React Native. When using this plugin, more specific properties will not be overwritten by less specific.

Make sure you read how to use plugins in general.

Demo - JSS


Usage example

import jss from 'jss'
import propsSort from 'jss-props-sort'

jss.use(propsSort())

const sheet = jss.createStyleSheet({
  container: {
    'border-left': '1px solid red',
    border: '3px solid green'
  }
})

console.log(sheet.toString())

.jss-0-0 {
  border: 3px solid green;
  border-left: 1px solid red;
}

console.log(sheet.classes)

{ container: "jss-0-0" }

Run tests

npm i
npm run test

License

MIT