inline-style-parser

An inline style parser copied from css/lib/parse/index.js:

InlineStyleParser(string)

Example:

var parse = require('inline-style-parser');
parse('color: #BADA55;');

Output:

[ { type: 'declaration',
    property: 'color',
    value: '#BADA55',
    position: Position { start: [Object], end: [Object], source: undefined } } ]

JSFiddle | Repl.it

See usage and examples.

Installation

NPM:

$ npm install inline-style-parser --save

Yarn:

$ yarn add inline-style-parser

CDN:

<script src="https://unpkg.com/inline-style-parser@latest/dist/inline-style-parser.min.js"></script>
<script>
  window.InlineStyleParser(/* string */);
</script> 

Usage

Import the module:

// CommonJS
const parse = require('inline-style-parser');
 
// ES Modules
import parse from 'inline-style-parser';

Parse single declaration:

parse('left: 0');

Output:

[
  {
    type: 'declaration',
    property: 'left',
    value: '0',
    position: {
      start: { line: 1, column: 1 },
      end: { line: 1, column: 8 },
      source: undefined
    }
  }
]

Parse multiple declarations:

parse('left: 0; right: 100px;');

Output:

[
  {
    type: 'declaration',
    property: 'left',
    value: '0',
    position: {
      start: { line: 1, column: 1 },
      end: { line: 1, column: 8 },
      source: undefined
    }
  },
  {
    type: 'declaration',
    property: 'right',
    value: '100px',
    position: {
      start: { line: 1, column: 10 },
      end: { line: 1, column: 22 },
      source: undefined
    }
  }
]

Parse declaration with missing value:

parse('top:');

Output:

[
  {
    type: 'declaration',
    property: 'top',
    value: '',
    position: {
      start: { line: 1, column: 1 },
      end: { line: 1, column: 5 },
      source: undefined
    }
  }
]

Parse unknown declaration:

parse('answer: 42;');

Output:

[
  {
    type: 'declaration',
    property: 'answer',
    value: '42',
    position: {
      start: { line: 1, column: 1 },
      end: { line: 1, column: 11 },
      source: undefined
    }
  }
]

Invalid declarations:

parse('');      // []
parse();        // throws TypeError
parse(1);       // throws TypeError
parse('width'); // throws Error
parse('/*');    // throws Error

Testing

Run tests:

$ npm test

Run tests in watch mode:

$ npm run test:watch

Run tests with coverage:

$ npm run test:coverage

Run tests in CI mode:

$ npm run test:ci

Lint files:

$ npm run lint

Fix lint errors:

$ npm run lint:fix

Release

Only collaborators with credentials can release and publish:

$ npm run release
$ git push --follow-tags && npm publish

License

MIT. See license from original project.