		@@ -0,3 +1,8 @@
		# 0.2.0 - 2014-08-212

		* Add map option
		* GNU style error message

		# 0.1.0 - 2014-08-01

		First release based on [rework-vars](https://github.com/reworkcss/rework-vars) v3.1.1

index.js

		@@ -5,3 +5,3 @@ /**

		var balanced = require('balanced-match')
		var balanced = require("balanced-match")

		@@ -12,4 +12,4 @@ /**

		var VAR_PROP_IDENTIFIER = '--'
		var VAR_FUNC_IDENTIFIER = 'var'
		var VAR_PROP_IDENTIFIER = "--"
		var VAR_FUNC_IDENTIFIER = "var"

		@@ -20,18 +20,21 @@ /**

		module.exports = function (options) {

		module.exports = function(options) {
		return function(style) {
		options = options \|\| {}
		var map = {}
		var map = options.map \|\| {}
		var preserve = (options.preserve === true ? true : false)

		// define variables
		style.eachRule(function (rule) {
		style.eachRule(function(rule) {
		var varNameIndices = []
		if (rule.type !== 'rule') return
		if (rule.type !== "rule") {
		return
		}

		// only variables declared for `:root` are supported for now
		if (rule.selectors.length !== 1 \|\| rule.selectors[0] !== ":root" \|\| rule.parent.type !== "root") return
		if (rule.selectors.length !== 1 \|\| rule.selectors[0] !== ":root" \|\| rule.parent.type !== "root") {
		return
		}

		rule.each(function (decl, i) {
		rule.each(function(decl, i) {
		var prop = decl.prop
		@@ -53,3 +56,5 @@ var value = decl.value
		// remove empty :root {}
		if (rule.decls.length === 0) rule.removeSelf()
		if (rule.decls.length === 0) {
		rule.removeSelf()
		}
		}
		@@ -59,10 +64,12 @@ })
		// resolve variables
		style.eachDecl(function (decl, i) {
		style.eachDecl(function(decl) {
		var resolvedValue
		var value = decl.value

		// skip values that don't contain variable functions
		if (!value \|\| value.indexOf(VAR_FUNC_IDENTIFIER + '(') === -1) return
		// skip values that don’t contain variable functions
		if (!value \|\| value.indexOf(VAR_FUNC_IDENTIFIER + "(") === -1) {
		return
		}

		resolvedValue = resolveValue(value, map)
		resolvedValue = resolveValue(value, map, decl.source)

		@@ -93,21 +100,31 @@ if (!preserve) {
		* @param {Object} map A map of variable names and values
		* @param {Object} source source object of the declaration containing the rule
		* @return {String} A property value with all CSS variables substituted.
		*/

		function resolveValue(value, map) {
		// matches `name[, fallback]`, captures 'name' and 'fallback'
		function resolveValue(value, map, source) {
		// matches `name[, fallback]`, captures "name" and "fallback"
		var RE_VAR = /([\w-]+)(?:\s,\s)?(.*)?/
		var balancedParens = balanced('(', ')', value)
		var varStartIndex = value.indexOf('var(')
		var varRef = balanced('(', ')', value.substring(varStartIndex)).body
		var balancedParens = balanced("(", ")", value)
		var varStartIndex = value.indexOf("var(")

		if (!balancedParens) throw new SyntaxError('postcss-custom-properties: missing closing ")" in the value "' + value + '"')
		if (varRef === '') throw new Error('postcss-custom-properties: var() must contain a non-whitespace string')
		if (!balancedParens) {
		throw new SyntaxError(gnuMessage("missing closing ')' in the value '" + value + "'", source))
		}

		var varFunc = VAR_FUNC_IDENTIFIER + '(' + varRef + ')'
		var varRef = balanced("(", ")", value.substring(varStartIndex)).body
		if (varRef === "") {
		throw new Error(gnuMessage("var() must contain a non-whitespace string", source))
		}

		var varResult = varRef.replace(RE_VAR, function (_, name, fallback) {
		var varFunc = VAR_FUNC_IDENTIFIER + "(" + varRef + ")"

		var varResult = varRef.replace(RE_VAR, function(_, name, fallback) {
		var replacement = map[name]
		if (!replacement && !fallback) throw new Error('postcss-custom-properties: variable "' + name + '" is undefined')
		if (!replacement && fallback) return fallback
		if (!replacement && !fallback) {
		throw new Error(gnuMessage("variable '" + name + "' is undefined", source))
		}
		if (!replacement && fallback) {
		return fallback
		}
		return replacement
		@@ -126,1 +143,11 @@ })
		}

		/**
		* return GNU style message
		*
		* @param {String} message
		* @param {Object} source
		*/
		function gnuMessage(message, source) {
		return (source ? (source.file ? source.file : "<css input>") + ":" + source.start.line + ":" + source.start.column : "") + " " + message
		}

package.json

		{
		"name": "postcss-custom-properties",
		"version": "0.1.0",
		"description": "PostCSS that polyfill CSS custom properties for cascading variable module",
		"version": "0.2.0",
		"description": "PostCSS plugin to polyfill W3C CSS Custom Properties for cascading variables",
		"keywords": [
		@@ -29,2 +29,5 @@ "css",
		"devDependencies": {
		"jscs": "^1.5.9",
		"jshint": "^2.5.2",
		"jshint-stylish": "^0.4.0",
		"postcss": "^2.1.0",
		@@ -35,4 +38,6 @@ "tap-colorize": "^1.2.0",
		"scripts": {
		"test": "node test \| tap-colorize"
		"jscs": "jscs .js /.js",
		"jshint": "jshint . --exclude node_modules --reporter node_modules/jshint-stylish/stylish.js",
		"test": "npm run jscs && npm run jshint && tape test \| tap-colorize"
		}
		}

README.md

		# postcss-custom-properties [![Build Status](https://travis-ci.org/postcss/postcss-custom-properties.png)](https://travis-ci.org/postcss/postcss-custom-properties)

		A [PostCSS](https://github.com/postcss/postcss) plugin to polyfill the
		[W3C-style CSS Custom Properties for cascading variables](http://www.w3.org/TR/css-variables/).
		> [PostCSS](https://github.com/postcss/postcss) plugin to transform [W3C CSS Custom Properties for cascading variables](http://www.w3.org/TR/css-variables/) syntax to more compatible CSS.

		N.B. For now the polyfill _is not complete_. It currently just aims to provide a future-proof way of using a _limited subset_ of the features provided by native CSS variables.
		N.B. For now the transformation _is not complete_. It currently just aims to provide a future-proof way of using a _limited subset_ of the features provided by native CSS variables.

		_[Checkout opened issue to know the state of this plugin](issues)._

		Why not `postcss-vars` ? Because [there is already a plugin with this name](http://github.com/iamvdo/postcss-vars) that have severals bugs & untested code.
		But I look forward to merge those 2 plugins & deprecate this one ([see opened issue](https://github.com/iamvdo/postcss-vars/issues/4)).

		## Installation

		```
		npm install postcss-custom-properties
		```
		$ npm install postcss-custom-properties

		@@ -20,13 +20,38 @@ ## Usage
		// dependencies
		var fs = require('fs')
		var postcss = require('postcss')
		var customProperties = require('postcss-custom-properties')
		var fs = require("fs")
		var postcss = require("postcss")
		var customProperties = require("postcss-custom-properties")

		// css to be processed
		var css = fs.readFileSync('build/build.css', 'utf8')
		var css = fs.readFileSync("input.css", "utf8")

		// process css using postcss-custom-properties
		var out = postcss(customProperties()).process(css).css
		var output = postcss()
		.use(customProperties())
		.process(css)
		.css
		```

		Using this `input.css`:

		```css
		:root {
		--color: red;
		}

		div {
		color: var(--color);
		}
		```

		you will get:

		```css
		div {
		color: red;
		}
		```

		Checkout [tests](test) for more.

		### Options
		@@ -39,7 +64,25 @@
		```js
		var out = postcss(customProperties({preserve: true})).process(css).css
		var out = postcss()
		.use(customProperties({preserve: true}))
		.process(css)
		.css
		```

		#### `map` (default: `{}`)

		Allow you to pass an object of variables

		---

		## Contributing

		Work on a branch, install dev-dependencies, respect coding style & run tests before submitting a bug fix or a feature.

		$ git clone https://github.com/postcss/postcss-custom-properties.git
		$ git checkout -b patch-1
		$ npm install
		$ npm test

		## [Changelog](CHANGELOG.md)

		## [License](LICENSE-MIT)
		## [License](LICENSE)

postcss-custom-properties - npm Package Compare versions

Improved metrics

Worsened metrics