Flatten Pollen builder module config?

[madeleineostoja]

Currently each module in the config from #46 is nested under an umbrella module (following the docs), might be better to flatten it out and treat every group of variables as a top-level module.

Taking a real world config example from Bokeh

Before

module.exports = (pollen, merge) => ({
  output: 'styles/pollen.css',
  modules: {
    typography: merge(pollen.typography, {
      font: { sans: `"Inter", sans-serif` },
      letter: { sm: '-0.02em' }
    }),
    ui: merge(pollen.ui, {
      radius: { xs: '4px ' }
    }),
    grids: merge(pollen.grid, {
      grid: {
        pageGutter: 'var(--grid-gap)'
      }
    }),
    colors: {
      color: {
        grey100: '#f2f4f7',
        ...
      }
    }
  }
});

After

module.exports = (pollen) => ({
  output: 'styles/pollen.css',
  modules: {
    font: { sans: `"Inter", sans-serif` },
    letter: { ...pollen.letter, sm: '-0.02em' },
    radius:  { ...pollen.radius, xs: '4px ' },
    grid: { ...pollen.grid, pageGutter: 'var(--grid-gap)' },
    color: {
      grey100: '#f2f4f7',
      ...
    }
  }
});

Pros

• Cleans up config a lot
• Makes parsing logic simpler
• Removes need for deepmerge utility
• More fine grained control over output, esp selective merge vs. replace

Cons

• Makes enabling addons a bit more cumbersome if there's more than one group in them
• Makes overall config file more verbose if just toggling modules on/off
• Interdependency issues? Have to double check nothing in core relies on other parts of core

I think it's probably worth doing.