Multi-level dropdowns

[aparlato]

Based on request from downstream client:

When you have too many style preset options, organization becomes difficult. We should allow for some way to clean this up.

While not my favorite UI pattern, my inclination is to go with a multi-level dropdown.

I'll have to dig in a bit to decide on the best syntax, but I'd like it to be backwards compatible.

Initial thoughts would be to update stylePresets and branchPatterns to accept a sublist type, but we'll see if this makes sense. In an ideal world we'd just allow an array inside the stylePresets array, but it will require a name.

const stylePresets = [
{
    id: 'mapbox-streets',
    name: 'Mapbox Streets',
    type: 'mapbox-gl',
    url: 'mapbox://styles/mapbox/streets-v11',
  },
  {
    name: 'Data viz styles',
    type: 'sublist',
    styles: [
      {
        id: 'mapbox-light',
        name: 'Mapbox Light',
        type: 'mapbox-gl',
        url: 'mapbox://styles/mapbox/light-v10',
      },
      {
          id: 'mapbox-dark',
          name: 'Mapbox Dark',
          type: 'mapbox-gl',
          url: 'mapbox://styles/mapbox/dark-v10',
        }
    ]
  },

]