examples/dist/common.js
function generateCSS(selector, styleTypes, stringHandlers, useImportant) {
    var merged = styleTypes.reduce(_util.recursiveMerge);

    var declarations = {};
    var mediaQueries = {};
    var pseudoStyles = {};

    Object.keys(merged).forEach(function (key) {
        if (key[0] === ':') {
            pseudoStyles[key] = merged[key];
        } else if (key[0] === '@') {
            mediaQueries[key] = merged[key];
        } else {
            declarations[key] = merged[key];
        }
    });

    return generateCSSRuleset(selector, declarations, stringHandlers, useImportant) + Object.keys(pseudoStyles).map(function (pseudoSelector) {
        return generateCSSRuleset(selector + pseudoSelector, pseudoStyles[pseudoSelector], stringHandlers, useImportant);
    }).join("") + Object.keys(mediaQueries).map(function (mediaQuery) {
        var ruleset = generateCSS(selector, [mediaQueries[mediaQuery]], stringHandlers, useImportant);
        return mediaQuery + '{' + ruleset + '}';
    }).join("");
}
function generateCSS(selector, styleTypes, stringHandlers, useImportant) {
    var merged = styleTypes.reduce(_util.recursiveMerge);

    var declarations = {};
    var mediaQueries = {};
    var pseudoStyles = {};

    Object.keys(merged).forEach(function (key) {
        if (key[0] === ':') {
            pseudoStyles[key] = merged[key];
        } else if (key[0] === '@') {
            mediaQueries[key] = merged[key];
        } else {
            declarations[key] = merged[key];
        }
    });

    return generateCSSRuleset(selector, declarations, stringHandlers, useImportant) + Object.keys(pseudoStyles).map(function (pseudoSelector) {
        return generateCSSRuleset(selector + pseudoSelector, pseudoStyles[pseudoSelector], stringHandlers, useImportant);
    }).join("") + Object.keys(mediaQueries).map(function (mediaQuery) {
        var ruleset = generateCSS(selector, [mediaQueries[mediaQuery]], stringHandlers, useImportant);
        return mediaQuery + '{' + ruleset + '}';
    }).join("");
}
function generateCSS ( selector , styleTypes , stringHandlers , useImportant ) { var merged = styleTypes . reduce ( _util . recursiveMerge ) ; var declarations = { } ; var mediaQueries = { } ; var pseudoStyles = { } ; Object . keys ( merged ) . forEach ( function ( key ) { if ( key [ 0 ] === ':' ) { pseudoStyles [ key ] = merged [ key ] ; } else if ( key [ 0 ] === '@' ) { mediaQueries [ key ] = merged [ key ] ; } else { declarations [ key ] = merged [ key ] ; } } ) ; return generateCSSRuleset ( selector , declarations , stringHandlers , useImportant ) + Object . keys ( pseudoStyles ) . map ( function ( pseudoSelector ) { return generateCSSRuleset ( selector + pseudoSelector , pseudoStyles [ pseudoSelector ] , stringHandlers , useImportant ) ; } ) . join ( "" ) + Object . keys ( mediaQueries ) . map ( function ( mediaQuery ) { var ruleset = generateCSS ( selector , [ mediaQueries [ mediaQuery ] ] , stringHandlers , useImportant ) ; return mediaQuery + '{' + ruleset + '}' ; } ) . join ( "" ) ; }
Generate CSS for a selector and some styles.

This function handles the media queries, pseudo selectors, and descendant
styles that can be used in aphrodite styles.

@param {string} selector: A base CSS selector for the styles to be generated
with.
@param {Object} styleTypes: A list of properties of the return type of
StyleSheet.create, e.g. [styles.red, styles.blue].
@param stringHandlers: See `generateCSSRuleset`
@param useImportant: See `generateCSSRuleset`

To actually generate the CSS special-construct-less styles are passed to
`generateCSSRuleset`.

For instance, a call to

generateCSSInner(".foo", {
color: "red",
"@media screen": {
height: 20,
":hover": {
backgroundColor: "black"
}
},
":active": {
fontWeight: "bold",
">>bar": {
_names: { "foo_bar": true },
height: 10,
}
}
});

will make 5 calls to `generateCSSRuleset`:

generateCSSRuleset(".foo", { color: "red" }, ...)
generateCSSRuleset(".foo:active", { fontWeight: "bold" }, ...)
generateCSSRuleset(".foo:active .foo_bar", { height: 10 }, ...)
// These 2 will be wrapped in @media screen {}
generateCSSRuleset(".foo", { height: 20 }, ...)
generateCSSRuleset(".foo:hover", { backgroundColor: "black" }, ...)
Generate CSS for a selector and some styles .