JSPM

  • Created
  • Published
  • Downloads 68544438
  • Score
    100M100P100Q248314F
  • License MIT

Transforms css values and at-rule params into the tree

Package Exports

  • postcss-value-parser
  • postcss-value-parser/lib/unit

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (postcss-value-parser) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Travis CI

postcss-value-parser

Transforms css values and at-rule params into the tree.

Usage

var parser = require('postcss-value-parser');

/*{
    nodes: [
      type: 'function',
      value: 'rgba',
      before: '',
      after: '',
      nodes: [
        { type: 'word', value: '233' },
        { type: 'div', value: ',', before: '', after: ' ' },
        { type: 'word', value: '45' },
        { type: 'div', value: ',', before: '', after: ' ' },
        { type: 'word', value: '66' },
        { type: 'div', value: ',', before: ' ', after: '' },
        { type: 'word', value: '.5' }
      ]
    ]
  }*/
parser('rgba(233, 45, 66 ,.5)').walk(function (node) {
  if (node.type === 'function' && node.value === 'rgba') {
    var color = node.nodes.filter(function (node) {
      return node.type === 'word';
    }).map(function (node) {
      return Number(node.value);
    }); // [233, 45, 66, .5]

    node.type = 'word';
    node.value = convertToHex(color);
  }
}).toString(); // #E92D42

Prevent walking into function

parser('url(some url) 50% 50%')
  .walk(function (node) {
    // Your code

    if (node.type === 'function' && node.value === 'url') {
      return false;
    }
  })
  .toString();

Url node

url( /path/to/image )

will be parsed to

[{
  type: 'function',
  value: 'url',
  before: ' ',
  after: ' ',
  nodes: [
    { type: 'word', value: '/path/to/image' }
  ]
}]

Node types

  • { type: 'word', value: 'any' }
  • { type: 'string', value: 'string', quote: '"' }
  • { type: 'string', value: 'string', quote: '\'' }
  • { type: 'div', value: '/' , before: ' ', after: ' ' }
  • { type: 'div', value: ',', before: ' ', after: ' ' }
  • { type: 'div', value: ':', before: ' ', after: ' ' }
  • { type: 'space', value: ' ' } space as a separator
  • { type: 'function', value: 'name', before: '', after: '', nodes: [] }

API

var valueParser = require('postcss-value-parser');

valueParser.unit(value)

Returns parsed value.

// .2rem
{
  number: '.2',
  unit: 'rem'
}

valueParser.stringify(nodes)

Stringifies node and array of nodes.

valueParser.walk(nodes, cb[, bubble])

Walks each node and recursively each nodes of functions. If bubble is false and callback returns false on function node then deeper walking will be prevented. Returns this instance.

  • nodes - value-parser node or nodes
  • cb(node, index, nodes)
  • bubble walk since the deepest functions nodes

var p = valueParser(value)

Returns parsed tree.

p.nodes

Root nodes list.

p.toString()

Stringify tree to the value.

p.walk(cb[, bubble])

Walks each node since p.nodes.

License

MIT © Bogdan Chadkin