mpal9000 / jss-props-sort

Make rule props extend each other instead of override.

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.

Demo - JSS


Usage example

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

jss.use(propsSort)

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

console.log(styleSheet.toString())

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

console.log(styleSheet.classes)

{ container: "jss-0-0" }

Run tests

npm i
npm run test

License

MIT