Globbing import and data-structure loop example?

I’m testing postCSS at present (via Gulp) and much of what I see, I like. 👍

My JS/node abilities are ‘novice’ so my apologies if some of my questions seem infantile!

However, there are a couple of things I am wondering about. Could anyone shed some light?

Globbing

Firstly, globbing. Is there currently a facility to ‘glob’ import files with postCSS:

[in styles.css] @import components/**/*.css

I tend to have lots of partial files (using Sass currently); it’s one of the best things Sass brings to the table for me. I’d like the ability to process/combine lots of individual ‘partial’ CSS files into one without listing out each one in an @import statement (which https://github.com/postcss/postcss-import already allows). Only Ruby Sass has this at present and it’s very convenient.

Data structures and looping

Is there any inherent capability to define and loop through a data structure? I’m talking about this kind of thing: http://benfrain.com/looping-data-map-libsass-3-02/. If there is nothing specific plugin wise, could anyone explain how this could be achieved using a JS object and JS loop in the ‘source’ CSS? (@MoOx has detailed this partially already here: https://github.com/cssnext/cssnext/issues/60) Or perhaps philosophically how this might be approached with postCSS?

Thanks very much for any insight you can offer.

[ai]

I think about something like

@loop $i 1 12 {
    &:nth-child($i) {
        transition-delay: calc($i * 100ms)
    }
}

to make animations like this. But it will not be like Sass loops, because it is only shortcut, not a real programm loop.

[benfrain]

@ai - yep that example is very useful and would certainly solve the problem for me. 👍

I don’t actually need to at this point but I am curious, would there be a way of defining which point in the CSS those rules would be appended?