		(function (global, factory) {
		typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
		typeof define === 'function' && define.amd ? define(factory) :
		(global.Fela = factory());
		typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
		typeof define === 'function' && define.amd ? define(factory) :
		(global.Fela = factory());
		}(this, function () { 'use strict';

		var babelHelpers = {};
		babelHelpers.typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
		return typeof obj;
		} : function (obj) {
		return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
		};
		var babelHelpers = {};
		babelHelpers.typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) {
		return typeof obj;
		} : function (obj) {
		return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
		};

		babelHelpers.classCallCheck = function (instance, Constructor) {
		if (!(instance instanceof Constructor)) {
		throw new TypeError("Cannot call a class as a function");
		}
		};
		babelHelpers.classCallCheck = function (instance, Constructor) {
		if (!(instance instanceof Constructor)) {
		throw new TypeError("Cannot call a class as a function");
		}
		};

		babelHelpers.createClass = function () {
		function defineProperties(target, props) {
		for (var i = 0; i < props.length; i++) {
		var descriptor = props[i];
		descriptor.enumerable = descriptor.enumerable \|\| false;
		descriptor.configurable = true;
		if ("value" in descriptor) descriptor.writable = true;
		Object.defineProperty(target, descriptor.key, descriptor);
		}
		babelHelpers.createClass = function () {
		function defineProperties(target, props) {
		for (var i = 0; i < props.length; i++) {
		var descriptor = props[i];
		descriptor.enumerable = descriptor.enumerable \|\| false;
		descriptor.configurable = true;
		if ("value" in descriptor) descriptor.writable = true;
		Object.defineProperty(target, descriptor.key, descriptor);
		}
		}

		return function (Constructor, protoProps, staticProps) {
		if (protoProps) defineProperties(Constructor.prototype, protoProps);
		if (staticProps) defineProperties(Constructor, staticProps);
		return Constructor;
		};
		}();
		return function (Constructor, protoProps, staticProps) {
		if (protoProps) defineProperties(Constructor.prototype, protoProps);
		if (staticProps) defineProperties(Constructor, staticProps);
		return Constructor;
		};
		}();

		babelHelpers.extends = Object.assign \|\| function (target) {
		for (var i = 1; i < arguments.length; i++) {
		var source = arguments[i];
		babelHelpers.extends = Object.assign \|\| function (target) {
		for (var i = 1; i < arguments.length; i++) {
		var source = arguments[i];

		for (var key in source) {
		if (Object.prototype.hasOwnProperty.call(source, key)) {
		target[key] = source[key];
		}
		for (var key in source) {
		if (Object.prototype.hasOwnProperty.call(source, key)) {
		target[key] = source[key];
		}
		}
		}

		return target;
		};
		return target;
		};

		babelHelpers.inherits = function (subClass, superClass) {
		if (typeof superClass !== "function" && superClass !== null) {
		throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
		babelHelpers.inherits = function (subClass, superClass) {
		if (typeof superClass !== "function" && superClass !== null) {
		throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
		}

		subClass.prototype = Object.create(superClass && superClass.prototype, {
		constructor: {
		value: subClass,
		enumerable: false,
		writable: true,
		configurable: true
		}
		});
		if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
		};

		subClass.prototype = Object.create(superClass && superClass.prototype, {
		constructor: {
		value: subClass,
		enumerable: false,
		writable: true,
		configurable: true
		}
		});
		if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
		};
		babelHelpers.objectWithoutProperties = function (obj, keys) {
		var target = {};

		babelHelpers.objectWithoutProperties = function (obj, keys) {
		var target = {};
		for (var i in obj) {
		if (keys.indexOf(i) >= 0) continue;
		if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
		target[i] = obj[i];
		}

		for (var i in obj) {
		if (keys.indexOf(i) >= 0) continue;
		if (!Object.prototype.hasOwnProperty.call(obj, i)) continue;
		target[i] = obj[i];
		}
		return target;
		};

		return target;
		};
		babelHelpers.possibleConstructorReturn = function (self, call) {
		if (!self) {
		throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
		}

		babelHelpers.possibleConstructorReturn = function (self, call) {
		if (!self) {
		throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
		}
		return call && (typeof call === "object" \|\| typeof call === "function") ? call : self;
		};

		return call && (typeof call === "object" \|\| typeof call === "function") ? call : self;
		};
		babelHelpers.toConsumableArray = function (arr) {
		if (Array.isArray(arr)) {
		for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];

		babelHelpers;
		return arr2;
		} else {
		return Array.from(arr);
		}
		};

		babelHelpers;

		function __commonjs(fn, module) { return module = { exports: {} }, fn(module, module.exports), module.exports; }

		/**
		* generates a hashcode from a string
		* taken from http://stackoverflow.com/a/7616484
		*
		* @param {string} str - str used to generate the unique hash code
		* @return {string} compressed content hash
		*/
		function generateHash(str) {
		var hash = 0;
		var iterator = 0;
		var char = void 0;
		var length = str.length;
		function __commonjs(fn, module) { return module = { exports: {} }, fn(module, module.exports), module.exports; }

		// return a `s` for empty strings
		// to symbolize `static`
		if (length === 0) {
		return '';
		}
		/* weak */
		/**
		* generates a hashcode from a string
		* taken from http://stackoverflow.com/a/7616484
		*
		* @param {string} str - str used to generate the unique hash code
		* @return {string} compressed content hash
		*/
		function generateContentHash(str) {
		var hash = 0;
		var iterator = 0;
		var char = void 0;
		var length = str.length;

		for (; iterator < length; ++iterator) {
		char = str.charCodeAt(iterator);
		hash = (hash << 5) - hash + char;
		hash \|= 0;
		}

		return '-' + hash.toString(36);
		// return a `s` for empty strings
		// to symbolize `static`
		if (length === 0) {
		return '';
		}

		/**
		* stringifies an object without any special character
		* uses a sort version of the obj to get same hash codes
		*
		* @param {Object} obj - obj that gets stringified
		* @return {string} stringyfied sorted object
		*/
		function sortedStringify(obj) {
		return Object.keys(obj).sort().reduce(function (str, prop) {
		// only concatenate property and value
		// without any special characters
		return str + prop + obj[prop];
		}, '');
		for (; iterator < length; ++iterator) {
		char = str.charCodeAt(iterator);
		hash = (hash << 5) - hash + char;
		hash \|= 0;
		}

		/**
		* generates an unique reference id by content hashing props
		*
		* @param {Object} props - props that get hashed
		* @return {string} reference - unique props reference
		*/
		var generatePropsReference = (function (props) {
		return generateHash(sortedStringify(props));
		});
		return '-' + hash.toString(36);
		}

		var formats = {
		'.woff': 'woff',
		'.eof': 'eof',
		'.ttf': 'truetype',
		'.svg': 'svg'
		};
		/**
		* generates an unique reference hash
		*
		* @param {Object} style - style that get hashed
		* @return {string} hash - unique style hash
		*/
		var generateStyleHash = (function (style) {
		return generateContentHash(JSON.stringify(style));
		});

		// Returns the font format for a specific font source
		function getFontFormat(src) {
		return Object.keys(formats).reduce(function (format, extension) {
		if (src.indexOf(extension) > -1) {
		format = formats[extension];
		}
		return format; // eslint-disable-line
		}, undefined);
		}
		/* weak */
		var formats = {
		'.woff': 'woff',
		'.eot': 'eot',
		'.ttf': 'truetype',
		'.svg': 'svg'
		};

		/**
		* pipes a style object through a list of plugins
		*
		* @param {Object} style - style object to process
		* @param {Object} meta - additional meta data
		* @param {Function[]} plugins - plugins used to process style
		* @return {Object} processed style
		*/
		function processStyle(style, meta, plugins) {
		return plugins.reduce(function (processedStyle, plugin) {
		return plugin(processedStyle, meta);
		}, style);
		}
		// Returns the font format for a specific font source
		function getFontFormat(src) {
		return Object.keys(formats).reduce(function (format, extension) {
		if (src.indexOf(extension) > -1) {
		format = formats[extension];
		}
		return format; // eslint-disable-line
		}, undefined);
		}

		/**
		* diffs a style object against a base style object
		*
		* @param {Object} style - style object which is diffed
		* @param {Object?} base - base style object
		*/
		function diffStyle(style) {
		var base = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
		/* weak */
		/**
		* pipes a style object through a list of plugins
		*
		* @param {Object} style - style object to process
		* @param {Object} meta - additional meta data
		* @param {Function[]} plugins - plugins used to process style
		* @return {Object} processed style
		*/
		function processStyle(style, meta, plugins) {
		return plugins.reduce(function (processedStyle, plugin) {
		return plugin(processedStyle, meta);
		}, style);
		}

		return Object.keys(style).reduce(function (diff, property) {
		var value = style[property];
		// recursive object iteration in order to render
		// pseudo class and media class declarations
		if (value instanceof Object && !Array.isArray(value)) {
		var nestedDiff = diffStyle(value, base[property]);
		if (Object.keys(nestedDiff).length > 0) {
		diff[property] = nestedDiff;
		/**
		* diffs a style object against a base style object
		*
		* @param {Object} style - style object which is diffed
		* @param {Object?} base - base style object
		*/
		function diffStyle(style) {
		var base = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};

		return Object.keys(style).reduce(function (diff, property) {
		var value = style[property];
		// recursive object iteration in order to render
		// pseudo class and media class declarations
		if (value instanceof Object && !Array.isArray(value)) {
		var nestedDiff = diffStyle(value, base[property]);
		if (Object.keys(nestedDiff).length > 0) {
		diff[property] = nestedDiff;
		}
		} else {
		// diff styles with the base styles to only extract dynamic styles
		if (value !== undefined && base[property] !== value) {
		// remove concatenated string values including `undefined`
		if (typeof value === 'string' && value.indexOf('undefined') > -1) {
		return diff;
		}
		} else {
		// diff styles with the base styles to only extract dynamic styles
		if (value !== undefined && !base.hasOwnProperty(property) \|\| base[property] !== value) {
		// remove concatenated string values including `undefined`
		if (typeof value === 'string' && value.indexOf('undefined') > -1) {
		return diff;
		}
		diff[property] = value;
		}
		diff[property] = value;
		}
		return diff;
		}, {});
		}
		}
		return diff;
		}, {});
		}

		var index$1 = __commonjs(function (module) {
		'use strict';
		var index$1 = __commonjs(function (module) {
		'use strict';

		var uppercasePattern = /[A-Z]/g;
		var msPattern = /^ms-/;
		var uppercasePattern = /[A-Z]/g;
		var msPattern = /^ms-/;
		var cache = {};

		function hyphenateStyleName(string) {
		return string.replace(uppercasePattern, '-$&').toLowerCase().replace(msPattern, '-ms-');
		}
		function hyphenateStyleName(string) {
		return string in cache ? cache[string] : cache[string] = string.replace(uppercasePattern, '-$&').toLowerCase().replace(msPattern, '-ms-');
		}

		module.exports = hyphenateStyleName;
		});
		module.exports = hyphenateStyleName;
		});

		var hypenateStyleName = (index$1 && typeof index$1 === 'object' && 'default' in index$1 ? index$1['default'] : index$1);
		var hypenateStyleName = (index$1 && typeof index$1 === 'object' && 'default' in index$1 ? index$1['default'] : index$1);

		/**
		* generates a valid CSS string containing style
		*
		* @param {Object} style - object containing CSS declarations
		* @returns {string} valid CSS string with dash cased properties
		*/
		function cssifyObject(style) {
		return Object.keys(style).reduce(function (css, prop) {
		// prevents the semicolon after
		// the last rule declaration
		if (css.length > 0) {
		css += ';';
		/* weak */
		var warning = function warning() {
		return true;
		};

		if (true) {
		warning = function warning(condition, message) {
		if (!condition) {
		if (typeof console !== 'undefined') {
		console.error(message); // eslint-disable-line
		}
		css += hypenateStyleName(prop) + ':' + style[prop];
		return css;
		}, '');
		}
		}
		};
		}

		/**
		* renders keyframes into a CSS string with all prefixes
		*
		* @param {Object} frames - validated frame declarations
		* @param {string} animationName - animation reference naming
		* @param {string[]} prefixes - list of used vendor prefixes
		* @return {string} valid CSS string
		*/
		function cssifyKeyframe(frames, animationName) {
		var prefixes = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [''];
		var warning$1 = warning;

		var keyframe = Object.keys(frames).reduce(function (css, percentage) {
		return css + percentage + '{' + cssifyObject(frames[percentage]) + '}';
		}, '');
		/**
		* generates a valid CSS string containing style
		*
		* @param {Object} style - object containing CSS declarations
		* @returns {string} valid CSS string with dash cased properties
		*/
		function cssifyObject(style) {
		return Object.keys(style).reduce(function (css, prop) {
		// warn if invalid values are rendered
		warning$1(typeof style[prop] === 'string' \|\| typeof style[prop] === 'number', 'The invalid value `' + style[prop] + '` has been used as `' + prop + '`.');

		return prefixes.reduce(function (css, prefix) {
		return css + '@' + prefix + 'keyframes ' + animationName + '{' + keyframe + '}';
		}, '');
		}
		// prevents the semicolon after
		// the last rule declaration
		if (css.length > 0) {
		css += ';';
		}

		/**
		* creates a new renderer instance
		*
		* @param {Object} config - renderer configuration
		* @return {Object} new renderer instance
		*/
		function createRenderer() {
		var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
		css += hypenateStyleName(prop) + ':' + style[prop];
		return css;
		}, '');
		}

		// the renderer is the key
		var renderer = {
		listeners: [],
		keyframePrefixes: config.keyframePrefixes \|\| ['-webkit-', '-moz-'],
		plugins: config.plugins \|\| [],
		/**
		* renders keyframes into a CSS string with all prefixes
		*
		* @param {Object} frames - validated frame declarations
		* @param {string} animationName - animation reference naming
		* @param {string[]} prefixes - list of used vendor prefixes
		* @return {string} valid CSS string
		*/
		function cssifyKeyframe(frames, animationName) {
		var prefixes = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [''];

		// try and use readable selectors when
		// prettySelectors is on and not in a prod environment
		prettySelectors: config.prettySelectors && true,
		mediaQueryOrder: config.mediaQueryOrder \|\| [],
		var keyframe = Object.keys(frames).reduce(function (css, percentage) {
		return css + percentage + '{' + cssifyObject(frames[percentage]) + '}';
		}, '');

		/**
		* clears the sheet's cache but keeps all listeners
		*/
		clear: function clear() {
		renderer.fontFaces = '';
		renderer.keyframes = '';
		renderer.statics = '';
		renderer.rules = '';
		renderer.mediaRules = renderer.mediaQueryOrder.reduce(function (rules, media) {
		rules[media] = '';
		return rules;
		}, {});
		return prefixes.reduce(function (css, prefix) {
		return css + '@' + prefix + 'keyframes ' + animationName + '{' + keyframe + '}';
		}, '');
		}

		renderer.rendered = {};
		renderer.base = {};
		renderer.ids = [];
		renderer.callStack = [];
		/**
		* creates a new renderer instance
		*
		* @param {Object} config - renderer configuration
		* @return {Object} new renderer instance
		*/
		function createRenderer() {
		var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

		// emit changes to notify subscribers
		renderer._emitChange({ type: 'clear' });
		},
		// the renderer is the key
		var renderer = {
		listeners: [],
		keyframePrefixes: config.keyframePrefixes \|\| ['-webkit-', '-moz-'],
		plugins: config.plugins \|\| [],

		// try and use readable selectors when
		// prettySelectors is on and not in a prod environment
		prettySelectors: config.prettySelectors && true,
		mediaQueryOrder: config.mediaQueryOrder \|\| [],

		/**
		* renders a new rule variation and caches the result
		*
		* @param {Function} rule - rule which gets rendered
		* @param {Object?} props - properties used to render
		* @return {string} className to reference the rendered rule
		*/
		renderRule: function renderRule(rule) {
		var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
		/**
		* clears the sheet's cache but keeps all listeners
		*/
		clear: function clear() {
		renderer.fontFaces = '';
		renderer.keyframes = '';
		renderer.statics = '';
		renderer.rules = '';
		renderer.mediaRules = renderer.mediaQueryOrder.reduce(function (rules, media) {
		rules[media] = '';
		return rules;
		}, {});

		// rendering a rule for the first time
		// will create an ID reference
		if (renderer.ids.indexOf(rule) < 0) {
		renderer.ids.push(rule);
		renderer.rendered = {};
		renderer.base = [];
		renderer.ids = [];
		renderer.baseClassName = [];
		renderer.callStack = [];

		// directly render the static base style to be able
		// to diff future dynamic style with those
		if (Object.keys(props).length > 0) {
		renderer.renderRule(rule, {});
		}
		}
		// emit changes to notify subscribers
		renderer._emitChange({ type: 'clear' });
		},

		// uses the reference ID and the props to generate an unique className
		var ruleId = renderer.ids.indexOf(rule);

		var classNamePrefix = 'c';
		var propsReference = generatePropsReference(props);
		/**
		* renders a new rule variation and caches the result
		*
		* @param {Function} rule - rule which gets rendered
		* @param {Object?} props - properties used to render
		* @param {Object?} defaultProps - properties used to render the static style
		* @return {string} className to reference the rendered rule
		*/
		renderRule: function renderRule(rule) {
		var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
		var defaultProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};

		// extend the className with prefixes in development
		// this enables better debugging and className readability
		if (true) {
		classNamePrefix = (renderer._selectorPrefix ? renderer._selectorPrefix + '__' : '') + (renderer.prettySelectors && rule.name ? rule.name + '__' : '') + 'c';
		// replace the cryptic hash reference with a concatenated and simplyfied version of the props object itself
		if (renderer.prettySelectors && Object.keys(props).length > 0) {
		propsReference += '__' + Object.keys(props).sort().map(function (prop) {
		return prop + '-' + props[prop];
		}).join('---').replace(/ /g, '_').match(/[-_a-zA-Z0-9]*/g).join('');
		}
		// rendering a rule for the first time
		// will create an ID reference
		if (renderer.ids.indexOf(rule) === -1) {
		renderer.ids.push(rule);

		// directly render the static base style to be able
		// to diff future dynamic style with those
		try {
		renderer.renderRule(rule, defaultProps, defaultProps);
		} catch (error) {
		warning$1(false, 'Nested props have been used without passing \'defaultProps\'. This will disable static style splitting for \'' + (rule.name ? rule.name : 'unkown_rule') + '\'.');
		}
		}

		var className = classNamePrefix + ruleId + propsReference;
		var ruleId = renderer.ids.indexOf(rule);

		// only if the cached rule has not already been rendered
		// with a specific set of properties it actually renders
		if (!renderer.rendered.hasOwnProperty(className)) {
		// process style using each plugin
		var style = processStyle(rule(props), {
		type: 'rule',
		className: className,
		id: ruleId,
		props: props,
		rule: rule
		}, renderer.plugins);
		var ruleProps = babelHelpers.extends({}, defaultProps, props);

		// diff style objects with base styles
		var diffedStyle = diffStyle(style, renderer.base[ruleId]);
		var style = rule(ruleProps);
		var styleId = renderer._generateStyleId(style);

		renderer.rendered[className] = false;
		var className = 'c' + styleId;

		if (Object.keys(diffedStyle).length > 0) {
		renderer._renderStyle(className, diffedStyle);
		}
		// extend the className with prefixes in development
		// this enables better debugging and className readability
		if (true) {
		className = (renderer._selectorPrefix ? renderer._selectorPrefix + '__' : '') + (renderer.prettySelectors && rule.name ? rule.name + '__' : '') + className;
		}

		// keep static style to diff dynamic onces later on
		if (className === classNamePrefix + ruleId) {
		renderer.base[ruleId] = diffedStyle;
		}
		}
		// only if the rule has not already been rendered
		// with a specific set of properties it actually renders
		if (!renderer.rendered.hasOwnProperty(className)) {
		// process style using each plugin
		var processedStyle = processStyle(style, {
		type: 'rule',
		className: className,
		props: ruleProps,
		rule: rule
		}, renderer.plugins);

		var baseClassName = classNamePrefix + ruleId;
		// if current className is empty
		// return either the static class or empty string
		if (!renderer.rendered[className]) {
		return renderer.rendered[baseClassName] ? baseClassName : '';
		// diff style objects with base styles
		var diffedStyle = diffStyle(processedStyle, renderer.base[ruleId]);
		renderer.rendered[className] = false;

		if (Object.keys(diffedStyle).length > 0) {
		renderer._renderStyle(className, diffedStyle);
		}

		renderer.callStack.push(renderer.renderRule.bind(renderer, rule, props));
		renderer.callStack.push(renderer.renderRule.bind(renderer, rule, props, defaultProps));

		// if the current className is a dynamic rule
		// return both classNames if static subset is not empty
		if (className !== baseClassName) {
		return (renderer.rendered[baseClassName] ? baseClassName + ' ' : '') + className;
		// keep static style to diff dynamic onces later on
		if (props === defaultProps) {
		renderer.base[ruleId] = diffedStyle;
		renderer.baseClassName[ruleId] = className;
		return renderer.rendered[className] ? className : '';
		}
		}

		return className;
		},
		var baseClassName = renderer.baseClassName[ruleId];

		// if current className is empty
		// return either the static class or empty string
		if (!renderer.rendered[className]) {
		return renderer.rendered[baseClassName] ? baseClassName : '';
		}

		/**
		* renders a new keyframe variation and caches the result
		*
		* @param {Keyframe} keyframe - Keyframe which gets rendered
		* @param {Object?} props - properties used to render
		* @return {string} animationName to reference the rendered keyframe
		*/
		renderKeyframe: function renderKeyframe(keyframe) {
		var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
		// if the current className is a dynamic rule
		// return both classNames if static subset is not empty
		if (className !== baseClassName) {
		return (renderer.rendered[baseClassName] ? baseClassName + ' ' : '') + className;
		}

		// rendering a Keyframe for the first time
		// will create cache entries and an ID reference
		if (renderer.ids.indexOf(keyframe) < 0) {
		renderer.ids.push(keyframe);
		}
		return className;
		},

		var propsReference = generatePropsReference(props);
		var prefix = renderer.prettySelectors && keyframe.name ? keyframe.name + '_' : 'k';
		var animationName = prefix + renderer.ids.indexOf(keyframe) + propsReference;

		// only if the cached keyframe has not already been rendered
		// with a specific set of properties it actually renders
		if (!renderer.rendered.hasOwnProperty(animationName)) {
		var processedKeyframe = processStyle(keyframe(props), {
		type: 'keyframe',
		keyframe: keyframe,
		props: props,
		animationName: animationName,
		id: renderer.ids.indexOf(keyframe)
		}, renderer.plugins);
		/**
		* renders a new keyframe variation and caches the result
		*
		* @param {Keyframe} keyframe - Keyframe which gets rendered
		* @param {Object?} props - properties used to render
		* @return {string} animationName to reference the rendered keyframe
		*/
		renderKeyframe: function renderKeyframe(keyframe) {
		var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};

		var css = cssifyKeyframe(processedKeyframe, animationName, renderer.keyframePrefixes);
		renderer.rendered[animationName] = true;
		renderer.keyframes += css;
		var style = keyframe(props);
		var styleId = renderer._generateStyleId(style);

		renderer.callStack.push(renderer.renderKeyframe.bind(renderer, keyframe, props));
		renderer._emitChange({
		name: animationName,
		style: processedKeyframe,
		css: css,
		type: 'keyframe'
		});
		}
		var animationName = 'k' + styleId;

		return animationName;
		},
		// extend the animationName with prefixes in development
		// this enables better debugging and className readability
		if (true) {
		animationName = (renderer.prettySelectors && keyframe.name ? keyframe.name + '__' : '') + animationName;
		}

		// only if the keyframe has not already been rendered
		// with a specific set of properties it actually renders
		if (!renderer.rendered.hasOwnProperty(animationName)) {
		var processedKeyframe = processStyle(style, {
		type: 'keyframe',
		keyframe: keyframe,
		props: props,
		animationName: animationName
		}, renderer.plugins);

		/**
		* renders a new font-face and caches it
		*
		* @param {FontFace} fontFace - fontFace which gets rendered
		* @return {string} fontFamily reference
		*/
		renderFont: function renderFont(family, files) {
		var properties = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
		var css = cssifyKeyframe(processedKeyframe, animationName, renderer.keyframePrefixes);
		renderer.rendered[animationName] = true;
		renderer.keyframes += css;

		var key = family + generatePropsReference(properties);
		renderer.callStack.push(renderer.renderKeyframe.bind(renderer, keyframe, props));
		renderer._emitChange({
		name: animationName,
		style: processedKeyframe,
		css: css,
		type: 'keyframe'
		});
		}

		if (!renderer.rendered.hasOwnProperty(key)) {
		(function () {
		var fontFace = {
		fontFamily: '\'' + family + '\'',
		src: files.map(function (src) {
		return 'url(\'' + src + '\') format(\'' + getFontFormat(src) + '\')';
		}).join(',')
		};
		return animationName;
		},

		var fontProperties = ['fontVariant', 'fontWeight', 'fontStretch', 'fontStyle', 'unicodeRange'];
		Object.keys(properties).filter(function (prop) {
		return fontProperties.indexOf(prop) > -1;
		}).forEach(function (fontProp) {
		return fontFace[fontProp] = properties[fontProp];
		});

		var css = '@font-face{' + cssifyObject(fontFace) + '}';
		/**
		* renders a new font-face and caches it
		*
		* @param {FontFace} fontFace - fontFace which gets rendered
		* @return {string} fontFamily reference
		*/
		renderFont: function renderFont(family, files) {
		var properties = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};

		renderer.rendered[key] = true;
		renderer.fontFaces += css;
		var key = family + generateStyleHash(properties);

		renderer.callStack.push(renderer.renderFont.bind(renderer, family, files, properties));
		renderer._emitChange({
		fontFamily: family,
		fontFace: fontFace,
		css: css,
		type: 'font'
		});
		})();
		}
		if (!renderer.rendered.hasOwnProperty(key)) {
		(function () {
		var fontFace = {
		fontFamily: '\'' + family + '\'',
		src: files.map(function (src) {
		return 'url(\'' + src + '\') format(\'' + getFontFormat(src) + '\')';
		}).join(',')
		};

		return family;
		},
		var fontProperties = ['fontVariant', 'fontWeight', 'fontStretch', 'fontStyle', 'unicodeRange'];
		Object.keys(properties).filter(function (prop) {
		return fontProperties.indexOf(prop) > -1;
		}).forEach(function (fontProp) {
		return fontFace[fontProp] = properties[fontProp];
		});

		var css = '@font-face{' + cssifyObject(fontFace) + '}';

		/**
		* renders static style and caches them
		*
		* @param {string\|Object} style - static style to be rendered
		* @param {string?} selector - selector used to render the styles
		* @return {string} rendered CSS output
		*/
		renderStatic: function renderStatic(style, selector) {
		var reference = typeof style === 'string' ? style : selector + sortedStringify(style);
		renderer.rendered[key] = true;
		renderer.fontFaces += css;

		if (!renderer.rendered.hasOwnProperty(reference)) {
		if (typeof style === 'string') {
		var css = style.replace(/\s{2,}/g, '');
		// remove new lines from template strings
		renderer.statics += css;
		renderer._emitChange({
		selector: selector,
		type: 'static',
		css: css
		});
		} else {
		var processedStyle = processStyle(style, {
		selector: selector,
		type: 'static'
		}, renderer.plugins);
		renderer.callStack.push(renderer.renderFont.bind(renderer, family, files, properties));

		var _css = cssifyObject(processedStyle);
		renderer.statics += selector + '{' + _css + '}';
		renderer._emitChange({
		fontFamily: family,
		fontFace: fontFace,
		css: css,
		type: 'font'
		});
		})();
		}

		renderer.callStack.push(renderer.renderStatic.bind(renderer, style, selector));
		renderer._emitChange({
		selector: selector,
		style: processedStyle,
		css: _css,
		type: 'rule'
		});
		}
		return family;
		},

		renderer.rendered[reference] = true;

		/**
		* renders static style and caches them
		*
		* @param {string\|Object} style - static style to be rendered
		* @param {string?} selector - selector used to render the styles
		* @return {string} rendered CSS output
		*/
		renderStatic: function renderStatic(style, selector) {
		var reference = typeof style === 'string' ? style : selector + JSON.stringify(style);

		if (!renderer.rendered.hasOwnProperty(reference)) {
		if (typeof style === 'string') {
		var css = style.replace(/\s{2,}/g, '');
		// remove new lines from template strings
		renderer.statics += css;
		renderer._emitChange({
		selector: selector,
		type: 'static',
		css: css
		});
		} else {
		var processedStyle = processStyle(style, {
		selector: selector,
		type: 'static'
		}, renderer.plugins);

		var _css = cssifyObject(processedStyle);
		renderer.statics += selector + '{' + _css + '}';

		renderer.callStack.push(renderer.renderStatic.bind(renderer, style, selector));

		renderer._emitChange({
		selector: selector,
		style: processedStyle,
		css: _css,
		type: 'rule'
		});
		}
		},

		renderer.rendered[reference] = true;
		}
		},

		/**
		* renders all cached styles into a single valid CSS string
		* clusters media query styles into groups to reduce output size
		* @return single concatenated CSS string
		*/
		renderToString: function renderToString() {
		var css = renderer.fontFaces + renderer.statics + renderer.rules;

		for (var media in renderer.mediaRules) {
		var rules = renderer.mediaRules[media];
		if (rules.length > 0) {
		css += '@media ' + media + '{' + rules + '}';
		}
		/**
		* renders all cached styles into a single valid CSS string
		* clusters media query styles into groups to reduce output size
		* @return single concatenated CSS string
		*/
		renderToString: function renderToString() {
		var css = renderer.fontFaces + renderer.statics + renderer.rules;

		for (var media in renderer.mediaRules) {
		var rules = renderer.mediaRules[media];
		if (rules.length > 0) {
		css += '@media ' + media + '{' + rules + '}';
		}
		}

		return css + renderer.keyframes;
		},
		return css + renderer.keyframes;
		},


		/**
		* Adds a new subscription to get notified on every rerender
		*
		* @param {Function} callback - callback function which will be executed
		* @return {Object} equivalent unsubscribe method
		*/
		subscribe: function subscribe(callback) {
		renderer.listeners.push(callback);
		return {
		unsubscribe: function unsubscribe() {
		return renderer.listeners.splice(renderer.listeners.indexOf(callback), 1);
		}
		};
		},
		/**
		* Adds a new subscription to get notified on every rerender
		*
		* @param {Function} callback - callback function which will be executed
		* @return {Object} equivalent unsubscribe method
		*/
		subscribe: function subscribe(callback) {
		renderer.listeners.push(callback);
		return {
		unsubscribe: function unsubscribe() {
		return renderer.listeners.splice(renderer.listeners.indexOf(callback), 1);
		}
		};
		},


		/**
		* rehydrates the whole cache using the callStack
		*/
		rehydrate: function rehydrate() {
		var callStack = renderer.callStack.slice(0);
		/**
		* rehydrates the whole cache using the callStack
		*/
		rehydrate: function rehydrate() {
		var callStack = renderer.callStack.slice(0);

		// clears the current callStack
		renderer.clear();
		// clears the current callStack
		renderer.clear();

		renderer._emitChange({ type: 'rehydrate', done: false });
		callStack.forEach(function (fn) {
		return fn();
		});
		renderer._emitChange({ type: 'rehydrate', done: true });
		},
		renderer._emitChange({ type: 'rehydrate', done: false });
		callStack.forEach(function (fn) {
		return fn();
		});
		renderer._emitChange({ type: 'rehydrate', done: true });
		},


		/**
		* calls each listener with a change object
		* gets only called if something actually changes
		*
		* @param {Function} callback - callback function which will be executed
		* @return {Object} equivalent unsubscribe method
		*/
		_emitChange: function _emitChange(change) {
		renderer.listeners.forEach(function (listener) {
		return listener(change, renderer);
		});
		},
		/**
		* generates a unique style id
		*
		* @param {Object} style - style object
		* @return {string} minimal string id
		*/
		_generateStyleId: function _generateStyleId(style) {
		var styleHash = generateStyleHash(style);

		if (renderer.ids.indexOf(styleHash) === -1) {
		renderer.ids.push(styleHash);
		}

		/**
		* iterates a style object and renders each rule to the cache
		*
		* @param {string} className - className reference to be rendered to
		* @param {Object} style - style object which is rendered
		*/
		_renderStyle: function _renderStyle(className, style) {
		var pseudo = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
		var media = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '';
		return renderer.ids.indexOf(styleHash).toString(36);
		},

		var ruleset = Object.keys(style).reduce(function (ruleset, property) {
		var value = style[property];
		// recursive object iteration in order to render
		// pseudo class and media class declarations
		if (value instanceof Object && !Array.isArray(value)) {
		// allow pseudo classes, attribute selectors and the child selector
		if (property.match(/^(:\|\[\|>)/) !== null) {
		renderer._renderStyle(className, value, pseudo + property, media);
		} else if (property.substr(0, 6) === '@media') {
		// combine media query rules with an `and`
		var query = property.slice(6).trim();
		var combinedMedia = media.length > 0 ? media + ' and ' + query : query;
		renderer._renderStyle(className, value, pseudo, combinedMedia);
		}
		} else {
		ruleset[property] = value;
		}
		return ruleset;
		}, {});

		// add styles to the cache
		if (Object.keys(ruleset).length > 0) {
		renderer.rendered[className] = true;
		/**
		* calls each listener with a change object
		* gets only called if something actually changes
		*
		* @param {Function} callback - callback function which will be executed
		* @return {Object} equivalent unsubscribe method
		*/
		_emitChange: function _emitChange(change) {
		renderer.listeners.forEach(function (listener) {
		return listener(change, renderer);
		});
		},

		var css = cssifyObject(ruleset);
		var selector = '.' + className + pseudo;
		var cssRule = selector + '{' + css + '}';

		if (media.length > 0) {
		if (!renderer.mediaRules.hasOwnProperty(media)) {
		renderer.mediaRules[media] = '';
		}
		/**
		* iterates a style object and renders each rule to the cache
		*
		* @param {string} className - className reference to be rendered to
		* @param {Object} style - style object which is rendered
		*/
		_renderStyle: function _renderStyle(className, style) {
		var pseudo = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
		var media = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : '';

		renderer.mediaRules[media] += cssRule;
		} else {
		renderer.rules += cssRule;
		var ruleset = Object.keys(style).reduce(function (ruleset, property) {
		var value = style[property];
		// recursive object iteration in order to render
		// pseudo class and media class declarations
		if (value instanceof Object && !Array.isArray(value)) {
		// allow pseudo classes, attribute selectors and the child selector
		if (property.match(/^(:\|\[\|>)/) !== null) {
		renderer._renderStyle(className, value, pseudo + property, media);
		} else if (property.substr(0, 6) === '@media') {
		// combine media query rules with an `and`
		var query = property.slice(6).trim();
		var combinedMedia = media.length > 0 ? media + ' and ' + query : query;
		renderer._renderStyle(className, value, pseudo, combinedMedia);
		}

		renderer._emitChange({
		selector: selector,
		style: ruleset,
		css: css,
		media: media,
		type: 'rule'
		});
		} else {
		ruleset[property] = value;
		}
		}
		};
		return ruleset;
		}, {});

		// initial setup
		renderer.keyframePrefixes.push('');
		renderer.clear();
		// add styles to the cache
		if (Object.keys(ruleset).length > 0) {
		renderer.rendered[className] = true;

		// enhance renderer with passed set of enhancers
		if (config.enhancers) {
		config.enhancers.forEach(function (enhancer) {
		return renderer = enhancer(renderer);
		});
		}
		var css = cssifyObject(ruleset);
		var selector = '.' + className + pseudo;
		var cssRule = selector + '{' + css + '}';

		return renderer;
		}
		if (media.length > 0) {
		if (!renderer.mediaRules.hasOwnProperty(media)) {
		renderer.mediaRules[media] = '';
		}

		function assign(base) {
		for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
		args[_key - 1] = arguments[_key];
		}

		return args.reduce(function (extend, obj) {
		for (var property in obj) {
		var value = obj[property];
		if (extend[property] instanceof Object && value instanceof Object) {
		extend[property] = assign({}, extend[property], value);
		renderer.mediaRules[media] += cssRule;
		} else {
		extend[property] = value;
		renderer.rules += cssRule;
		}

		renderer._emitChange({
		selector: selector,
		style: ruleset,
		css: css,
		media: media,
		type: 'rule'
		});
		}
		return extend;
		}, base);
		}
		};

		// initial setup
		renderer.keyframePrefixes.push('');
		renderer.clear();

		// enhance renderer with passed set of enhancers
		if (config.enhancers) {
		config.enhancers.forEach(function (enhancer) {
		return renderer = enhancer(renderer);
		});
		}

		function combineRules() {
		for (var _len = arguments.length, rules = Array(_len), _key = 0; _key < _len; _key++) {
		rules[_key] = arguments[_key];
		}
		return renderer;
		}

		return function combined(props) {
		return rules.reduce(function (style, rule) {
		return assign(style, rule(props));
		}, {});
		};
		/* weak */
		function assign(base) {
		for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
		args[_key - 1] = arguments[_key];
		}

		function enhance() {
		for (var _len = arguments.length, enhancers = Array(_len), _key = 0; _key < _len; _key++) {
		enhancers[_key] = arguments[_key];
		return args.reduce(function (extend, obj) {
		for (var property in obj) {
		var value = obj[property];
		if (extend[property] instanceof Object && value instanceof Object) {
		extend[property] = assign({}, extend[property], value);
		} else {
		extend[property] = value;
		}
		}
		return extend;
		}, base);
		}

		return function (createRenderer) {
		return function () {
		return enhancers.reduce(function (renderer, enhancer) {
		return enhancer(renderer);
		}, createRenderer.apply(undefined, arguments));
		};
		};
		function combineRules() {
		for (var _len = arguments.length, rules = Array(_len), _key = 0; _key < _len; _key++) {
		rules[_key] = arguments[_key];
		}

		var warning = function warning() {
		return true;
		return function combined(props) {
		return rules.reduce(function (style, rule) {
		return assign(style, rule(props));
		}, {});
		};
		}

		if (true) {
		warning = function warning(condition, message) {
		if (!condition) {
		if (typeof console !== 'undefined') {
		console.error(message); // eslint-disable-line
		}
		throw new Error(message);
		}
		};
		/* weak */
		function enhance() {
		for (var _len = arguments.length, enhancers = Array(_len), _key = 0; _key < _len; _key++) {
		enhancers[_key] = arguments[_key];
		}

		var warning$1 = warning;
		return function (createRenderer) {
		return function () {
		return enhancers.reduce(function (renderer, enhancer) {
		return enhancer(renderer);
		}, createRenderer.apply(undefined, arguments));
		};
		};
		}

		function createDOMInterface(renderer, node) {
		var isHydrating = false;
		/* weak */
		function createDOMInterface(renderer, node) {
		var isHydrating = false;

		var DOMInterface = {
		/**
		* updates DOM node styles performantly
		*
		* @param {Function} node - DOM node
		* @param {Object} change - object describing the changes
		* @param {Object} renderer - the renderer which triggered the change
		*/
		updateNode: function updateNode() {
		var change = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
		var DOMInterface = {
		/**
		* updates DOM node styles performantly
		*
		* @param {Function} node - DOM node
		* @param {Object} change - object describing the changes
		* @param {Object} renderer - the renderer which triggered the change
		*/
		updateNode: function updateNode() {
		var change = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};

		// setting the hydration flag to prevent DOM updates will immediately
		// get unset as soon as the rehydration process is done
		if (change.type === 'hydrate') {
		isHydrating = !change.done;
		}
		// setting the hydration flag to prevent DOM updates will immediately
		// get unset as soon as the rehydration process is done
		if (change.type === 'hydrate') {
		isHydrating = !change.done;
		}

		// only update DOM if the renderer is not hydrating at the moment
		if (!isHydrating) {
		// only use insertRule in production as browser devtools might have
		// weird behavior if used together with insertRule at runtime
		if (change.type === 'rule' && !change.media && false) {
		var sheet = node.sheet;
		// directly append new rules before media rules
		sheet.insertRule(change.selector + '{' + change.css + '}', sheet.cssRules.length);
		} else {
		node.textContent = renderer.renderToString();
		}
		// only update DOM if the renderer is not hydrating at the moment
		if (!isHydrating) {
		// only use insertRule in production as browser devtools might have
		// weird behavior if used together with insertRule at runtime
		if (change.type === 'rule' && !change.media && false) {
		var sheet = node.sheet;
		// directly append new rules before media rules
		sheet.insertRule(change.selector + '{' + change.css + '}', sheet.cssRules.length);
		} else {
		node.textContent = renderer.renderToString();
		}
		}
		};
		}
		};

		return DOMInterface;
		return DOMInterface;
		}

		function render(renderer, mountNode) {
		// check if the passed node is a valid element node which allows
		// setting the `textContent` property to update the node's content
		if (!mountNode \|\| mountNode.nodeType !== 1) {
		throw new Error('You need to specify a valid element node (nodeType = 1) to render into.');
		}

		function render(renderer, mountNode) {
		// check if the passed node is a valid element node which allows
		// setting the `textContent` property to update the node's content
		if (!mountNode \|\| mountNode.nodeType !== 1) {
		throw new Error('You need to specify a valid element node (nodeType = 1) to render into.');
		}
		// warns if the DOM node either is not a valid <style> element thus the styles do not get applied as Expected
		// or if the node already got the data-fela-stylesheet attribute applied suggesting it is already used by another Renderer
		warning$1(mountNode.nodeName === 'STYLE', 'You are using a node other than `<style>`. Your styles might not get applied correctly.');
		warning$1(!mountNode.hasAttribute('data-fela-stylesheet'), 'This node is already used by another renderer. Rendering might overwrite other styles.');

		// warns if the DOM node either is not a valid <style> element thus the styles do not get applied as Expected
		// or if the node already got the data-fela-stylesheet attribute applied suggesting it is already used by another Renderer
		warning$1(mountNode.nodeName === 'STYLE', 'You are using a node other than `<style>`. Your styles might not get applied correctly.');
		warning$1(!mountNode.hasAttribute('data-fela-stylesheet'), 'This node is already used by another renderer. Rendering might overwrite other styles.');
		// mark and clean the DOM node to prevent side-effects
		mountNode.setAttribute('data-fela-stylesheet', '');

		// mark and clean the DOM node to prevent side-effects
		mountNode.setAttribute('data-fela-stylesheet', '');
		var DOMInterface = createDOMInterface(renderer, mountNode);
		renderer.subscribe(DOMInterface.updateNode);

		var DOMInterface = createDOMInterface(renderer, mountNode);
		renderer.subscribe(DOMInterface.updateNode);
		// render currently rendered styles to the DOM once
		// if it is not already in DOM
		var css = renderer.renderToString();

		// render currently rendered styles to the DOM once
		// if it is not already in DOM
		var css = renderer.renderToString();

		if (mountNode.textContent !== css) {
		mountNode.textContent = css;
		}
		if (mountNode.textContent !== css) {
		mountNode.textContent = css;
		}
		}

		var index = {
		createRenderer: createRenderer,
		combineRules: combineRules,
		enhance: enhance,
		render: render
		};
		var index = {
		createRenderer: createRenderer,
		combineRules: combineRules,
		enhance: enhance,
		render: render
		};

		return index;
		return index;

		}));
		//# sourceMappingURL=fela.js.map

dist/fela.min.js

		@@ -1,1 +0,1 @@
		!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define(r):e.Fela=r()}(this,function(){"use strict";function e(e,r){return r={exports:{}},e(r,r.exports),r.exports}function r(e){var r=0,t=0,n=void 0,o=e.length;if(0===o)return"";for(;t<o;++t)n=e.charCodeAt(t),r=(r<<5)-r+n,r\|=0;return"-"+r.toString(36)}function t(e){return Object.keys(e).sort().reduce(function(r,t){return r+t+e[t]},"")}function n(e){return Object.keys(m).reduce(function(r,t){return e.indexOf(t)>-1&&(r=m[t]),r},void 0)}function o(e,r,t){return t.reduce(function(e,t){return t(e,r)},e)}function i(e){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return Object.keys(e).reduce(function(t,n){var o=e[n];if(o instanceof Object&&!Array.isArray(o)){var a=i(o,r[n]);Object.keys(a).length>0&&(t[n]=a)}else if(void 0!==o&&!r.hasOwnProperty(n)\|\|r[n]!==o){if("string"==typeof o&&o.indexOf("undefined")>-1)return t;t[n]=o}return t},{})}function a(e){return Object.keys(e).reduce(function(r,t){return r.length>0&&(r+=";"),r+=b(t)+":"+e[t]},"")}function u(e,r){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[""],n=Object.keys(e).reduce(function(r,t){return r+t+"{"+a(e[t])+"}"},"");return t.reduce(function(e,t){return e+"@"+t+"keyframes "+r+"{"+n+"}"},"")}function c(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},r={listeners:[],keyframePrefixes:e.keyframePrefixes\|\|["-webkit-","-moz-"],plugins:e.plugins\|\|[],prettySelectors:e.prettySelectors&&!1,mediaQueryOrder:e.mediaQueryOrder\|\|[],clear:function(){r.fontFaces="",r.keyframes="",r.statics="",r.rules="",r.mediaRules=r.mediaQueryOrder.reduce(function(e,r){return e[r]="",e},{}),r.rendered={},r.base={},r.ids=[],r.callStack=[],r._emitChange({type:"clear"})},renderRule:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};r.ids.indexOf(e)<0&&(r.ids.push(e),Object.keys(t).length>0&&r.renderRule(e,{}));var n=r.ids.indexOf(e),a="c",u=h(t),c=a+n+u;if(!r.rendered.hasOwnProperty(c)){var s=o(e(t),{type:"rule",className:c,id:n,props:t,rule:e},r.plugins),f=i(s,r.base[n]);r.rendered[c]=!1,Object.keys(f).length>0&&r._renderStyle(c,f),c===a+n&&(r.base[n]=f)}var l=a+n;return r.rendered[c]?(r.callStack.push(r.renderRule.bind(r,e,t)),c!==l?(r.rendered[l]?l+" ":"")+c:c):r.rendered[l]?l:""},renderKeyframe:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};r.ids.indexOf(e)<0&&r.ids.push(e);var n=h(t),i=r.prettySelectors&&e.name?e.name+"_":"k",a=i+r.ids.indexOf(e)+n;if(!r.rendered.hasOwnProperty(a)){var c=o(e(t),{type:"keyframe",keyframe:e,props:t,animationName:a,id:r.ids.indexOf(e)},r.plugins),s=u(c,a,r.keyframePrefixes);r.rendered[a]=!0,r.keyframes+=s,r.callStack.push(r.renderKeyframe.bind(r,e,t)),r._emitChange({name:a,style:c,css:s,type:"keyframe"})}return a},renderFont:function(e,t){var o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},i=e+h(o);return r.rendered.hasOwnProperty(i)\|\|!function(){var u={fontFamily:"'"+e+"'",src:t.map(function(e){return"url('"+e+"') format('"+n(e)+"')"}).join(",")},c=["fontVariant","fontWeight","fontStretch","fontStyle","unicodeRange"];Object.keys(o).filter(function(e){return c.indexOf(e)>-1}).forEach(function(e){return u[e]=o[e]});var s="@font-face{"+a(u)+"}";r.rendered[i]=!0,r.fontFaces+=s,r.callStack.push(r.renderFont.bind(r,e,t,o)),r._emitChange({fontFamily:e,fontFace:u,css:s,type:"font"})}(),e},renderStatic:function(e,n){var i="string"==typeof e?e:n+t(e);if(!r.rendered.hasOwnProperty(i)){if("string"==typeof e){var u=e.replace(/\s{2,}/g,"");r.statics+=u,r._emitChange({selector:n,type:"static",css:u})}else{var c=o(e,{selector:n,type:"static"},r.plugins),s=a(c);r.statics+=n+"{"+s+"}",r.callStack.push(r.renderStatic.bind(r,e,n)),r._emitChange({selector:n,style:c,css:s,type:"rule"})}r.rendered[i]=!0}},renderToString:function(){var e=r.fontFaces+r.statics+r.rules;for(var t in r.mediaRules){var n=r.mediaRules[t];n.length>0&&(e+="@media "+t+"{"+n+"}")}return e+r.keyframes},subscribe:function(e){return r.listeners.push(e),{unsubscribe:function(){return r.listeners.splice(r.listeners.indexOf(e),1)}}},rehydrate:function(){var e=r.callStack.slice(0);r.clear(),r._emitChange({type:"rehydrate",done:!1}),e.forEach(function(e){return e()}),r._emitChange({type:"rehydrate",done:!0})},_emitChange:function(e){r.listeners.forEach(function(t){return t(e,r)})},_renderStyle:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"",o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"",i=Object.keys(t).reduce(function(i,a){var u=t[a];if(u instanceof Object&&!Array.isArray(u)){if(null!==a.match(/^(:\|\[\|>)/))r._renderStyle(e,u,n+a,o);else if("@media"===a.substr(0,6)){var c=a.slice(6).trim(),s=o.length>0?o+" and "+c:c;r._renderStyle(e,u,n,s)}}else i[a]=u;return i},{});if(Object.keys(i).length>0){r.rendered[e]=!0;var u=a(i),c="."+e+n,s=c+"{"+u+"}";o.length>0?(r.mediaRules.hasOwnProperty(o)\|\|(r.mediaRules[o]=""),r.mediaRules[o]+=s):r.rules+=s,r._emitChange({selector:c,style:i,css:u,media:o,type:"rule"})}}};return r.keyframePrefixes.push(""),r.clear(),e.enhancers&&e.enhancers.forEach(function(e){return r=e(r)}),r}function s(e){for(var r=arguments.length,t=Array(r>1?r-1:0),n=1;n<r;n++)t[n-1]=arguments[n];return t.reduce(function(e,r){for(var t in r){var n=r[t];e[t]instanceof Object&&n instanceof Object?e[t]=s({},e[t],n):e[t]=n}return e},e)}function f(){for(var e=arguments.length,r=Array(e),t=0;t<e;t++)r[t]=arguments[t];return function(e){return r.reduce(function(r,t){return s(r,t(e))},{})}}function l(){for(var e=arguments.length,r=Array(e),t=0;t<e;t++)r[t]=arguments[t];return function(e){return function(){return r.reduce(function(e,r){return r(e)},e.apply(void 0,arguments))}}}function d(e,r){var t=!1,n={updateNode:function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if("hydrate"===n.type&&(t=!n.done),!t)if("rule"!==n.type\|\|n.media)r.textContent=e.renderToString();else{var o=r.sheet;o.insertRule(n.selector+"{"+n.css+"}",o.cssRules.length)}}};return n}function y(e,r){if(!r\|\|1!==r.nodeType)throw new Error("You need to specify a valid element node (nodeType = 1) to render into.");r.setAttribute("data-fela-stylesheet","");var t=d(e,r);e.subscribe(t.updateNode);var n=e.renderToString();r.textContent!==n&&(r.textContent=n)}var p={};p.typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},p.classCallCheck=function(e,r){if(!(e instanceof r))throw new TypeError("Cannot call a class as a function")},p.createClass=function(){function e(e,r){for(var t=0;t<r.length;t++){var n=r[t];n.enumerable=n.enumerable\|\|!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(r,t,n){return t&&e(r.prototype,t),n&&e(r,n),r}}(),p.extends=Object.assign\|\|function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},p.inherits=function(e,r){if("function"!=typeof r&&null!==r)throw new TypeError("Super expression must either be null or a function, not "+typeof r);e.prototype=Object.create(r&&r.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),r&&(Object.setPrototypeOf?Object.setPrototypeOf(e,r):e.__proto__=r)},p.objectWithoutProperties=function(e,r){var t={};for(var n in e)r.indexOf(n)>=0\|\|Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},p.possibleConstructorReturn=function(e,r){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!r\|\|"object"!=typeof r&&"function"!=typeof r?e:r};var h=function(e){return r(t(e))},m={".woff":"woff",".eof":"eof",".ttf":"truetype",".svg":"svg"},v=e(function(e){function r(e){return e.replace(t,"-$&").toLowerCase().replace(n,"-ms-")}var t=/[A-Z]/g,n=/^ms-/;e.exports=r}),b=v&&"object"==typeof v&&"default"in v?v.default:v,g={createRenderer:c,combineRules:f,enhance:l,render:y};return g});
		!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?module.exports=r():"function"==typeof define&&define.amd?define(r):e.Fela=r()}(this,function(){"use strict";function e(e,r){return r={exports:{}},e(r,r.exports),r.exports}function r(e){var r=0,t=0,n=void 0,o=e.length;if(0===o)return"";for(;t<o;++t)n=e.charCodeAt(t),r=(r<<5)-r+n,r\|=0;return"-"+r.toString(36)}function t(e){return Object.keys(h).reduce(function(r,t){return e.indexOf(t)>-1&&(r=h[t]),r},void 0)}function n(e,r,t){return t.reduce(function(e,t){return t(e,r)},e)}function o(e){var r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};return Object.keys(e).reduce(function(t,n){var i=e[n];if(i instanceof Object&&!Array.isArray(i)){var a=o(i,r[n]);Object.keys(a).length>0&&(t[n]=a)}else if(void 0!==i&&r[n]!==i){if("string"==typeof i&&i.indexOf("undefined")>-1)return t;t[n]=i}return t},{})}function i(e){return Object.keys(e).reduce(function(r,t){return r.length>0&&(r+=";"),r+=v(t)+":"+e[t]},"")}function a(e,r){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:[""],n=Object.keys(e).reduce(function(r,t){return r+t+"{"+i(e[t])+"}"},"");return t.reduce(function(e,t){return e+"@"+t+"keyframes "+r+"{"+n+"}"},"")}function u(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},r={listeners:[],keyframePrefixes:e.keyframePrefixes\|\|["-webkit-","-moz-"],plugins:e.plugins\|\|[],prettySelectors:e.prettySelectors&&!1,mediaQueryOrder:e.mediaQueryOrder\|\|[],clear:function(){r.fontFaces="",r.keyframes="",r.statics="",r.rules="",r.mediaRules=r.mediaQueryOrder.reduce(function(e,r){return e[r]="",e},{}),r.rendered={},r.base=[],r.ids=[],r.baseClassName=[],r.callStack=[],r._emitChange({type:"clear"})},renderRule:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};if(r.ids.indexOf(e)===-1){r.ids.push(e);try{r.renderRule(e,i,i)}catch(e){}}var a=r.ids.indexOf(e),u=y.extends({},i,t),s=e(u),c=r._generateStyleId(s),f="c"+c;if(!r.rendered.hasOwnProperty(f)){var l=n(s,{type:"rule",className:f,props:u,rule:e},r.plugins),d=o(l,r.base[a]);if(r.rendered[f]=!1,Object.keys(d).length>0&&r._renderStyle(f,d),r.callStack.push(r.renderRule.bind(r,e,t,i)),t===i)return r.base[a]=d,r.baseClassName[a]=f,r.rendered[f]?f:""}var p=r.baseClassName[a];return r.rendered[f]?f!==p?(r.rendered[p]?p+" ":"")+f:f:r.rendered[p]?p:""},renderKeyframe:function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},o=e(t),i=r._generateStyleId(o),u="k"+i;if(!r.rendered.hasOwnProperty(u)){var s=n(o,{type:"keyframe",keyframe:e,props:t,animationName:u},r.plugins),c=a(s,u,r.keyframePrefixes);r.rendered[u]=!0,r.keyframes+=c,r.callStack.push(r.renderKeyframe.bind(r,e,t)),r._emitChange({name:u,style:s,css:c,type:"keyframe"})}return u},renderFont:function(e,n){var o=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{},a=e+p(o);return r.rendered.hasOwnProperty(a)\|\|!function(){var u={fontFamily:"'"+e+"'",src:n.map(function(e){return"url('"+e+"') format('"+t(e)+"')"}).join(",")},s=["fontVariant","fontWeight","fontStretch","fontStyle","unicodeRange"];Object.keys(o).filter(function(e){return s.indexOf(e)>-1}).forEach(function(e){return u[e]=o[e]});var c="@font-face{"+i(u)+"}";r.rendered[a]=!0,r.fontFaces+=c,r.callStack.push(r.renderFont.bind(r,e,n,o)),r._emitChange({fontFamily:e,fontFace:u,css:c,type:"font"})}(),e},renderStatic:function(e,t){var o="string"==typeof e?e:t+JSON.stringify(e);if(!r.rendered.hasOwnProperty(o)){if("string"==typeof e){var a=e.replace(/\s{2,}/g,"");r.statics+=a,r._emitChange({selector:t,type:"static",css:a})}else{var u=n(e,{selector:t,type:"static"},r.plugins),s=i(u);r.statics+=t+"{"+s+"}",r.callStack.push(r.renderStatic.bind(r,e,t)),r._emitChange({selector:t,style:u,css:s,type:"rule"})}r.rendered[o]=!0}},renderToString:function(){var e=r.fontFaces+r.statics+r.rules;for(var t in r.mediaRules){var n=r.mediaRules[t];n.length>0&&(e+="@media "+t+"{"+n+"}")}return e+r.keyframes},subscribe:function(e){return r.listeners.push(e),{unsubscribe:function(){return r.listeners.splice(r.listeners.indexOf(e),1)}}},rehydrate:function(){var e=r.callStack.slice(0);r.clear(),r._emitChange({type:"rehydrate",done:!1}),e.forEach(function(e){return e()}),r._emitChange({type:"rehydrate",done:!0})},_generateStyleId:function(e){var t=p(e);return r.ids.indexOf(t)===-1&&r.ids.push(t),r.ids.indexOf(t).toString(36)},_emitChange:function(e){r.listeners.forEach(function(t){return t(e,r)})},_renderStyle:function(e,t){var n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"",o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"",a=Object.keys(t).reduce(function(i,a){var u=t[a];if(u instanceof Object&&!Array.isArray(u)){if(null!==a.match(/^(:\|\[\|>)/))r._renderStyle(e,u,n+a,o);else if("@media"===a.substr(0,6)){var s=a.slice(6).trim(),c=o.length>0?o+" and "+s:s;r._renderStyle(e,u,n,c)}}else i[a]=u;return i},{});if(Object.keys(a).length>0){r.rendered[e]=!0;var u=i(a),s="."+e+n,c=s+"{"+u+"}";o.length>0?(r.mediaRules.hasOwnProperty(o)\|\|(r.mediaRules[o]=""),r.mediaRules[o]+=c):r.rules+=c,r._emitChange({selector:s,style:a,css:u,media:o,type:"rule"})}}};return r.keyframePrefixes.push(""),r.clear(),e.enhancers&&e.enhancers.forEach(function(e){return r=e(r)}),r}function s(e){for(var r=arguments.length,t=Array(r>1?r-1:0),n=1;n<r;n++)t[n-1]=arguments[n];return t.reduce(function(e,r){for(var t in r){var n=r[t];e[t]instanceof Object&&n instanceof Object?e[t]=s({},e[t],n):e[t]=n}return e},e)}function c(){for(var e=arguments.length,r=Array(e),t=0;t<e;t++)r[t]=arguments[t];return function(e){return r.reduce(function(r,t){return s(r,t(e))},{})}}function f(){for(var e=arguments.length,r=Array(e),t=0;t<e;t++)r[t]=arguments[t];return function(e){return function(){return r.reduce(function(e,r){return r(e)},e.apply(void 0,arguments))}}}function l(e,r){var t=!1,n={updateNode:function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if("hydrate"===n.type&&(t=!n.done),!t)if("rule"!==n.type\|\|n.media)r.textContent=e.renderToString();else{var o=r.sheet;o.insertRule(n.selector+"{"+n.css+"}",o.cssRules.length)}}};return n}function d(e,r){if(!r\|\|1!==r.nodeType)throw new Error("You need to specify a valid element node (nodeType = 1) to render into.");r.setAttribute("data-fela-stylesheet","");var t=l(e,r);e.subscribe(t.updateNode);var n=e.renderToString();r.textContent!==n&&(r.textContent=n)}var y={};y.typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},y.classCallCheck=function(e,r){if(!(e instanceof r))throw new TypeError("Cannot call a class as a function")},y.createClass=function(){function e(e,r){for(var t=0;t<r.length;t++){var n=r[t];n.enumerable=n.enumerable\|\|!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(r,t,n){return t&&e(r.prototype,t),n&&e(r,n),r}}(),y.extends=Object.assign\|\|function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},y.inherits=function(e,r){if("function"!=typeof r&&null!==r)throw new TypeError("Super expression must either be null or a function, not "+typeof r);e.prototype=Object.create(r&&r.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),r&&(Object.setPrototypeOf?Object.setPrototypeOf(e,r):e.__proto__=r)},y.objectWithoutProperties=function(e,r){var t={};for(var n in e)r.indexOf(n)>=0\|\|Object.prototype.hasOwnProperty.call(e,n)&&(t[n]=e[n]);return t},y.possibleConstructorReturn=function(e,r){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!r\|\|"object"!=typeof r&&"function"!=typeof r?e:r},y.toConsumableArray=function(e){if(Array.isArray(e)){for(var r=0,t=Array(e.length);r<e.length;r++)t[r]=e[r];return t}return Array.from(e)};var p=function(e){return r(JSON.stringify(e))},h={".woff":"woff",".eot":"eot",".ttf":"truetype",".svg":"svg"},m=e(function(e){function r(e){return e in o?o[e]:o[e]=e.replace(t,"-$&").toLowerCase().replace(n,"-ms-")}var t=/[A-Z]/g,n=/^ms-/,o={};e.exports=r}),v=m&&"object"==typeof m&&"default"in m?m.default:m,b={createRenderer:u,combineRules:c,enhance:f,render:d};return b});

lib/bindings/react/connect.js

		@@ -23,4 +23,5 @@ 'use strict';

		function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
		function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /* weak */


		function connect(mapStylesToProps) {
		@@ -44,3 +45,8 @@ return function (Comp) {
		value: function render() {
		var _context = this.context,
		renderer = _context.renderer,
		theme = _context.theme;

		// invoke the component name for better CSS debugging

		if (process.env.NODE_ENV !== 'production') {
		@@ -51,3 +57,5 @@ this.context.renderer._selectorPrefix = Comp.displayName \|\| Comp.name \|\| 'ConnectedFelaComponent';
		// invoke props and renderer to render all styles
		var styles = mapStylesToProps(this.props)(this.context.renderer);
		var styles = mapStylesToProps(_extends({}, this.props, {
		theme: theme \|\| {}
		}))(renderer);

		@@ -65,3 +73,4 @@ // remove the component name after rendering
		}(_react.Component), _class.displayName = Comp.displayName \|\| Comp.name \|\| 'ConnectedFelaComponent', _class.contextTypes = _extends({}, Comp.contextTypes, {
		renderer: _react.PropTypes.object
		renderer: _react.PropTypes.object,
		theme: _react.PropTypes.object
		}), _temp;
		@@ -68,0 +77,0 @@ };

lib/bindings/react/createComponent.js

		@@ -6,5 +6,2 @@ 'use strict';
		});

		var _extends = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

		exports.default = createComponent;
		@@ -14,25 +11,26 @@

		function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
		function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }

		function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; } /* weak */


		function createComponent(rule) {
		var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'div';
		var passThroughProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
		var passThroughProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
		var defaultProps = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};

		var component = function component(_ref, _ref2) {
		var children = _ref.children;
		var className = _ref.className;
		var style = _ref.style;
		var passThrough = _ref.passThrough;
		var FelaComponent = function FelaComponent(_ref, _ref2) {
		var renderer = _ref2.renderer,
		theme = _ref2.theme;

		var felaProps = _objectWithoutProperties(_ref, ['children', 'className', 'style', 'passThrough']);
		var children = _ref.children,
		className = _ref.className,
		style = _ref.style,
		_ref$passThrough = _ref.passThrough,
		passThrough = _ref$passThrough === undefined ? [] : _ref$passThrough,
		ruleProps = _objectWithoutProperties(_ref, ['children', 'className', 'style', 'passThrough']);

		var renderer = _ref2.renderer;


		// filter props to extract props to pass through
		var componentProps = Object.keys(_extends({}, passThroughProps, passThrough)).reduce(function (output, prop) {
		output[prop] = felaProps[prop];
		if (!passThroughProps[prop]) {
		delete felaProps[prop];
		}
		var componentProps = [].concat(_toConsumableArray(passThroughProps), _toConsumableArray(passThrough)).reduce(function (output, prop) {
		output[prop] = ruleProps[prop];
		return output;
		@@ -44,14 +42,18 @@ }, {});
		var cls = className ? className + ' ' : '';
		componentProps.className = cls + renderer.renderRule(rule, felaProps);
		defaultProps.theme = theme \|\| {};

		componentProps.className = cls + renderer.renderRule(rule, ruleProps, defaultProps);

		return (0, _react.createElement)(type, componentProps, children);
		};

		component.contextTypes = { renderer: _react.PropTypes.object };
		FelaComponent.contextTypes = {
		renderer: _react.PropTypes.object,
		theme: _react.PropTypes.object
		};

		// use the rule name as display name to better debug with react inspector
		component.displayName = rule.name && rule.name \|\| 'FelaComponent';

		return component;
		FelaComponent.displayName = rule.name && rule.name \|\| 'FelaComponent';
		return FelaComponent;
		}
		module.exports = exports['default'];

lib/bindings/react/index.js

		@@ -19,9 +19,15 @@ 'use strict';

		var _ThemeProvider = require('./ThemeProvider');

		var _ThemeProvider2 = _interopRequireDefault(_ThemeProvider);

		function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

		/* weak */
		exports.default = {
		Provider: _Provider2.default,
		connect: _connect2.default,
		createComponent: _createComponent2.default
		createComponent: _createComponent2.default,
		ThemeProvider: _ThemeProvider2.default
		};
		module.exports = exports['default'];

lib/bindings/react/Provider.js

		@@ -21,4 +21,5 @@ 'use strict';

		function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
		function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /* weak */


		var Provider = function (_Component) {
		@@ -36,5 +37,5 @@ _inherits(Provider, _Component);
		value: function componentDidMount() {
		var _props = this.props;
		var mountNode = _props.mountNode;
		var renderer = _props.renderer;
		var _props = this.props,
		mountNode = _props.mountNode,
		renderer = _props.renderer;

		@@ -54,3 +55,3 @@
		value: function render() {
		return this.props.children;
		return _react.Children.only(this.props.children);
		}
		@@ -57,0 +58,0 @@ }]);

lib/combineRules.js

		@@ -24,3 +24,3 @@ 'use strict';
		};
		}
		} /* weak */
		module.exports = exports['default'];

114

lib/createRenderer.js

		@@ -6,12 +6,12 @@ 'use strict';
		});
		exports.default = createRenderer;

		var _generatePropsReference = require('./utils/generatePropsReference');
		var _extends = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; /* weak */

		var _generatePropsReference2 = _interopRequireDefault(_generatePropsReference);

		var _sortedStringify = require('./utils/sortedStringify');
		exports.default = createRenderer;

		var _sortedStringify2 = _interopRequireDefault(_sortedStringify);
		var _generateStyleHash = require('./utils/generateStyleHash');

		var _generateStyleHash2 = _interopRequireDefault(_generateStyleHash);

		var _getFontFormat = require('./utils/getFontFormat');
		@@ -37,2 +37,6 @@

		var _warning = require('./utils/warning');

		var _warning2 = _interopRequireDefault(_warning);

		function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
		@@ -74,4 +78,5 @@
		renderer.rendered = {};
		renderer.base = {};
		renderer.base = [];
		renderer.ids = [];
		renderer.baseClassName = [];
		renderer.callStack = [];
		@@ -89,2 +94,3 @@
		* @param {Object?} props - properties used to render
		* @param {Object?} defaultProps - properties used to render the static style
		* @return {string} className to reference the rendered rule
		@@ -94,6 +100,7 @@ */
		var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
		var defaultProps = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};

		// rendering a rule for the first time
		// will create an ID reference
		if (renderer.ids.indexOf(rule) < 0) {
		if (renderer.ids.indexOf(rule) === -1) {
		renderer.ids.push(rule);
		@@ -103,36 +110,32 @@
		// to diff future dynamic style with those
		if (Object.keys(props).length > 0) {
		renderer.renderRule(rule, {});
		try {
		renderer.renderRule(rule, defaultProps, defaultProps);
		} catch (error) {
		process.env.NODE_ENV !== "production" ? (0, _warning2.default)(false, 'Nested props have been used without passing \'defaultProps\'. This will disable static style splitting for \'' + (rule.name ? rule.name : 'unkown_rule') + '\'.') : void 0;
		}
		}

		// uses the reference ID and the props to generate an unique className
		var ruleId = renderer.ids.indexOf(rule);

		var classNamePrefix = 'c';
		var propsReference = (0, _generatePropsReference2.default)(props);
		var ruleProps = _extends({}, defaultProps, props);

		var style = rule(ruleProps);
		var styleId = renderer._generateStyleId(style);

		var className = 'c' + styleId;

		// extend the className with prefixes in development
		// this enables better debugging and className readability
		if (process.env.NODE_ENV !== 'production') {
		classNamePrefix = (renderer._selectorPrefix ? renderer._selectorPrefix + '__' : '') + (renderer.prettySelectors && rule.name ? rule.name + '__' : '') + 'c';
		// replace the cryptic hash reference with a concatenated and simplyfied version of the props object itself
		if (renderer.prettySelectors && Object.keys(props).length > 0) {
		propsReference += '__' + Object.keys(props).sort().map(function (prop) {
		return prop + '-' + props[prop];
		}).join('---').replace(/ /g, '_').match(/[-_a-zA-Z0-9]*/g).join('');
		}
		className = (renderer._selectorPrefix ? renderer._selectorPrefix + '__' : '') + (renderer.prettySelectors && rule.name ? rule.name + '__' : '') + className;
		}

		var className = classNamePrefix + ruleId + propsReference;

		// only if the cached rule has not already been rendered
		// only if the rule has not already been rendered
		// with a specific set of properties it actually renders
		if (!renderer.rendered.hasOwnProperty(className)) {
		// process style using each plugin
		var style = (0, _processStyle2.default)(rule(props), {
		var processedStyle = (0, _processStyle2.default)(style, {
		type: 'rule',
		className: className,
		id: ruleId,
		props: props,
		props: ruleProps,
		rule: rule
		@@ -142,4 +145,3 @@ }, renderer.plugins);
		// diff style objects with base styles
		var diffedStyle = (0, _diffStyle2.default)(style, renderer.base[ruleId]);

		var diffedStyle = (0, _diffStyle2.default)(processedStyle, renderer.base[ruleId]);
		renderer.rendered[className] = false;
		@@ -151,9 +153,14 @@

		renderer.callStack.push(renderer.renderRule.bind(renderer, rule, props, defaultProps));

		// keep static style to diff dynamic onces later on
		if (className === classNamePrefix + ruleId) {
		if (props === defaultProps) {
		renderer.base[ruleId] = diffedStyle;
		renderer.baseClassName[ruleId] = className;
		return renderer.rendered[className] ? className : '';
		}
		}

		var baseClassName = classNamePrefix + ruleId;
		var baseClassName = renderer.baseClassName[ruleId];

		// if current className is empty
		@@ -165,4 +172,2 @@ // return either the static class or empty string

		renderer.callStack.push(renderer.renderRule.bind(renderer, rule, props));

		// if the current className is a dynamic rule
		@@ -188,21 +193,21 @@ // return both classNames if static subset is not empty

		// rendering a Keyframe for the first time
		// will create cache entries and an ID reference
		if (renderer.ids.indexOf(keyframe) < 0) {
		renderer.ids.push(keyframe);
		var style = keyframe(props);
		var styleId = renderer._generateStyleId(style);

		var animationName = 'k' + styleId;

		// extend the animationName with prefixes in development
		// this enables better debugging and className readability
		if (process.env.NODE_ENV !== 'production') {
		animationName = (renderer.prettySelectors && keyframe.name ? keyframe.name + '__' : '') + animationName;
		}

		var propsReference = (0, _generatePropsReference2.default)(props);
		var prefix = renderer.prettySelectors && keyframe.name ? keyframe.name + '_' : 'k';
		var animationName = prefix + renderer.ids.indexOf(keyframe) + propsReference;

		// only if the cached keyframe has not already been rendered
		// only if the keyframe has not already been rendered
		// with a specific set of properties it actually renders
		if (!renderer.rendered.hasOwnProperty(animationName)) {
		var processedKeyframe = (0, _processStyle2.default)(keyframe(props), {
		var processedKeyframe = (0, _processStyle2.default)(style, {
		type: 'keyframe',
		keyframe: keyframe,
		props: props,
		animationName: animationName,
		id: renderer.ids.indexOf(keyframe)
		animationName: animationName
		}, renderer.plugins);
		@@ -236,3 +241,3 @@

		var key = family + (0, _generatePropsReference2.default)(properties);
		var key = family + (0, _generateStyleHash2.default)(properties);

		@@ -261,2 +266,3 @@ if (!renderer.rendered.hasOwnProperty(key)) {
		renderer.callStack.push(renderer.renderFont.bind(renderer, family, files, properties));

		renderer._emitChange({
		@@ -283,3 +289,3 @@ fontFamily: family,
		renderStatic: function renderStatic(style, selector) {
		var reference = typeof style === 'string' ? style : selector + (0, _sortedStringify2.default)(style);
		var reference = typeof style === 'string' ? style : selector + JSON.stringify(style);

		@@ -306,2 +312,3 @@ if (!renderer.rendered.hasOwnProperty(reference)) {
		renderer.callStack.push(renderer.renderStatic.bind(renderer, style, selector));

		renderer._emitChange({
		@@ -373,2 +380,19 @@ selector: selector,
		/**
		* generates a unique style id
		*
		* @param {Object} style - style object
		* @return {string} minimal string id
		*/
		_generateStyleId: function _generateStyleId(style) {
		var styleHash = (0, _generateStyleHash2.default)(style);

		if (renderer.ids.indexOf(styleHash) === -1) {
		renderer.ids.push(styleHash);
		}

		return renderer.ids.indexOf(styleHash).toString(36);
		},


		/**
		* calls each listener with a change object
		@@ -375,0 +399,0 @@ * gets only called if something actually changes

lib/enhance.js

		@@ -7,2 +7,3 @@ "use strict";
		exports.default = enhance;
		/* weak */
		function enhance() {
		@@ -9,0 +10,0 @@ for (var _len = arguments.length, enhancers = Array(_len), _key = 0; _key < _len; _key++) {

lib/enhancers/beautifier.js

		@@ -7,4 +7,5 @@ 'use strict';

		var _extends = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
		var _extends = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; /* weak */


		var _cssbeautify = require('cssbeautify');
		@@ -11,0 +12,0 @@

lib/enhancers/logger.js

		@@ -7,4 +7,5 @@ 'use strict';

		var _extends = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
		var _extends = Object.assign \|\| function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; /* weak */


		var _cssbeautify = require('cssbeautify');
		@@ -11,0 +12,0 @@

lib/enhancers/perf.js

		@@ -6,2 +6,3 @@ 'use strict';
		});
		/* weak */
		var counter = 0;
		@@ -8,0 +9,0 @@

lib/index.js

		@@ -25,2 +25,3 @@ 'use strict';

		/* weak */
		exports.default = {
		@@ -27,0 +28,0 @@ createRenderer: _createRenderer2.default,

lib/native/createRenderer.js

		@@ -54,8 +54,11 @@ 'use strict';
		var ruleId = renderer.ids.indexOf(rule);
		var ref = ruleId + (0, _generatePropsReference2.default)(props);
		var styleOutput = renderer._resolveStyle(rule, props);
		var propsReference = Object.keys(props).length > 0 ? (0, _generatePropsReference2.default)(styleOutput) : '';

		var ref = ruleId + propsReference;

		// only if the cached rule has not already been rendered
		// with a specific set of properties it actually renders
		if (!renderer.rules.hasOwnProperty(ref)) {
		var style = (0, _processStyle2.default)(renderer._resolveStyle(rule, props), {
		var style = (0, _processStyle2.default)(styleOutput, {
		type: 'rule',
		@@ -62,0 +65,0 @@ id: ruleId,

lib/plugins/customProperty.js

		@@ -6,2 +6,3 @@ "use strict";
		});
		/* weak */
		function customProperty(style, properties) {
		@@ -8,0 +9,0 @@ Object.keys(style).forEach(function (property) {

lib/plugins/debugLayout.js

		@@ -9,2 +9,3 @@ 'use strict';

		/* weak */
		function debugLayout(style, meta, options) {
		@@ -11,0 +12,0 @@ if (meta.type === 'rule') {

lib/plugins/dynamicPrefixer.js

		@@ -19,4 +19,5 @@ 'use strict';
		};
		};
		}; /* weak */


		module.exports = exports['default'];

lib/plugins/extend.js

		@@ -23,4 +23,5 @@ 'use strict';
		}
		}
		} /* weak */


		function extend(style) {
		@@ -27,0 +28,0 @@ Object.keys(style).forEach(function (property) {

lib/plugins/fallbackValue.js

		@@ -24,3 +24,3 @@ 'use strict';
		return style;
		}
		} /* weak */

		@@ -27,0 +27,0 @@ exports.default = function () {

lib/plugins/friendlyPseudoClass.js

		@@ -6,2 +6,3 @@ 'use strict';
		});
		/* weak */
		var regex = new RegExp('^on([A-Z])');
		@@ -8,0 +9,0 @@

lib/plugins/logger.js

		@@ -29,4 +29,5 @@ 'use strict';
		};
		};
		}; /* weak */


		module.exports = exports['default'];

lib/plugins/LVHA.js

		@@ -6,2 +6,3 @@ 'use strict';
		});
		/* weak */
		var precedence = {
		@@ -8,0 +9,0 @@ ':link': 4,

lib/plugins/placeholderPrefixer.js

		@@ -13,3 +13,3 @@ 'use strict';

		var placeholderPrefixes = ['::-webkit-input-placeholder', '::-moz-placeholder', ':-ms-input-placeholder', ':-moz-placeholder', '::placeholder'];
		var placeholderPrefixes = ['::-webkit-input-placeholder', '::-moz-placeholder', ':-ms-input-placeholder', ':-moz-placeholder', '::placeholder']; /* weak */

		@@ -16,0 +16,0 @@ exports.default = function () {

lib/plugins/prefixer.js

		@@ -17,4 +17,5 @@ 'use strict';
		};
		};
		}; /* weak */


		module.exports = exports['default'];

lib/plugins/removeUndefined.js

		@@ -6,2 +6,3 @@ 'use strict';
		});
		/* weak */
		function isInvalid(value) {
		@@ -8,0 +9,0 @@ return value === undefined \|\| typeof value === 'string' && value.indexOf('undefined') > -1;

lib/plugins/unit.js

		@@ -7,4 +7,5 @@ 'use strict';

		var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
		var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; /* weak */


		var _warning = require('../utils/warning');
		@@ -11,0 +12,0 @@

lib/plugins/validator.js

		@@ -9,2 +9,3 @@ 'use strict';

		/* weak */
		function validateStyleObject(style, logInvalid, deleteInvalid) {
		@@ -32,4 +33,4 @@ Object.keys(style).forEach(function (property) {
		function validator(style, meta, options) {
		var logInvalid = options.logInvalid;
		var deleteInvalid = options.deleteInvalid;
		var logInvalid = options.logInvalid,
		deleteInvalid = options.deleteInvalid;

		@@ -36,0 +37,0 @@

lib/presets/dev.js

		@@ -17,3 +17,4 @@ 'use strict';

		/* weak */
		exports.default = [(0, _logger2.default)({ logMetaData: true }), (0, _validator2.default)()];
		module.exports = exports['default'];

lib/presets/web.js

		@@ -29,3 +29,4 @@ 'use strict';

		exports.default = [(0, _extend2.default)(), (0, _prefixer2.default)(), (0, _fallbackValue2.default)(), (0, _LVHA2.default)(), (0, _unit2.default)()];
		exports.default = [(0, _extend2.default)(), (0, _prefixer2.default)(), (0, _fallbackValue2.default)(), (0, _LVHA2.default)(), (0, _unit2.default)()]; /* weak */

		module.exports = exports['default'];

lib/render.js

		@@ -18,2 +18,3 @@ 'use strict';

		/* weak */
		function render(renderer, mountNode) {
		@@ -20,0 +21,0 @@ // check if the passed node is a valid element node which allows

lib/tools/StyleSheet.js

		@@ -6,2 +6,3 @@ 'use strict';
		});
		/* weak */
		exports.default = {
		@@ -8,0 +9,0 @@ create: function create(styles) {

lib/utils/assign.js

		@@ -7,2 +7,3 @@ "use strict";
		exports.default = assign;
		/* weak */
		function assign(base) {
		@@ -9,0 +10,0 @@ for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {

lib/utils/cssifyKeyframe.js

		@@ -32,3 +32,3 @@ 'use strict';
		}, '');
		}
		} /* weak */
		module.exports = exports['default'];

lib/utils/cssifyObject.js

		@@ -12,2 +12,6 @@ 'use strict';

		var _warning = require('./warning');

		var _warning2 = _interopRequireDefault(_warning);

		function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
		@@ -21,4 +25,8 @@
		*/
		/* weak */
		function cssifyObject(style) {
		return Object.keys(style).reduce(function (css, prop) {
		// warn if invalid values are rendered
		process.env.NODE_ENV !== "production" ? (0, _warning2.default)(typeof style[prop] === 'string' \|\| typeof style[prop] === 'number', 'The invalid value `' + style[prop] + '` has been used as `' + prop + '`.') : void 0;

		// prevents the semicolon after
		@@ -29,2 +37,3 @@ // the last rule declaration
		}

		css += (0, _hyphenateStyleName2.default)(prop) + ':' + style[prop];
		@@ -31,0 +40,0 @@ return css;

lib/utils/diffStyle.js

		@@ -27,3 +27,3 @@ 'use strict';
		// diff styles with the base styles to only extract dynamic styles
		if (value !== undefined && !base.hasOwnProperty(property) \|\| base[property] !== value) {
		if (value !== undefined && base[property] !== value) {
		// remove concatenated string values including `undefined`
		@@ -30,0 +30,0 @@ if (typeof value === 'string' && value.indexOf('undefined') > -1) {

lib/utils/DOMInterface.js

		@@ -7,2 +7,3 @@ 'use strict';
		exports.default = createDOMInterface;
		/* weak */
		function createDOMInterface(renderer, node) {
		@@ -9,0 +10,0 @@ var isHydrating = false;

lib/utils/generateContentHash.js

		@@ -6,3 +6,4 @@ 'use strict';
		});
		exports.default = generateHash;
		exports.default = generateContentHash;
		/* weak */
		/**
		@@ -15,3 +16,3 @@ * generates a hashcode from a string
		*/
		function generateHash(str) {
		function generateContentHash(str) {
		var hash = 0;
		@@ -18,0 +19,0 @@ var iterator = 0;

lib/utils/generatePropsReference.js

		@@ -11,6 +11,2 @@ 'use strict';

		var _sortedStringify = require('./sortedStringify');

		var _sortedStringify2 = _interopRequireDefault(_sortedStringify);

		function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
		@@ -25,5 +21,6 @@
		exports.default = function (props) {
		return (0, _generateContentHash2.default)((0, _sortedStringify2.default)(props));
		};
		return (0, _generateContentHash2.default)(JSON.stringify(props));
		}; /* weak */


		module.exports = exports['default'];

lib/utils/getFontFormat.js

		@@ -7,5 +7,6 @@ 'use strict';
		exports.default = getFontFormat;
		/* weak */
		var formats = {
		'.woff': 'woff',
		'.eof': 'eof',
		'.eot': 'eot',
		'.ttf': 'truetype',
		@@ -12,0 +13,0 @@ '.svg': 'svg'

lib/utils/processStyle.js

		@@ -7,2 +7,3 @@ "use strict";
		exports.default = processStyle;
		/* weak */
		/**
		@@ -9,0 +10,0 @@ * pipes a style object through a list of plugins

lib/utils/sortedStringify.js

		@@ -7,2 +7,4 @@ 'use strict';
		exports.default = sortedStringify;
		exports.getFlatValue = getFlatValue;
		/* weak */
		/**
		@@ -19,5 +21,19 @@ * stringifies an object without any special character
		// without any special characters
		return str + prop + obj[prop];
		return str + prop + getFlatValue(obj[prop]);
		}, '');
		}
		module.exports = exports['default'];

		function getFlatValue(value) {
		// join arrays
		if (Array.isArray(value)) {
		return value.join('-');
		}

		// stringify objects
		if (value instanceof Object) {
		return sortedStringify(value);
		}

		// return the basic value
		return value;
		}

lib/utils/warning.js

		@@ -6,2 +6,3 @@ 'use strict';
		});
		/* weak */
		var warning = function warning() {
		@@ -17,3 +18,2 @@ return true;
		}
		throw new Error(message);
		}
		@@ -20,0 +20,0 @@ };

package.json

		{
		"name": "fela",
		"version": "3.0.8",
		"version": "4.0.0",
		"description": "Fast & Dynamic Styling in JavaScript",
		@@ -5,0 +5,0 @@ "main": "index.js",

dist/fela.js.map

Sorry, the diff of this file is not supported yet

fela - npm Package Compare versions

New alerts

Fixed alerts

Improved metrics

Worsened metrics