Facet

<ul class="u-remove-bullets">
        <li class="c-facet">
        <button class="c-facet__toggle" aria-expanded="false" aria-controls="products">
        Products<svg role="img" aria-hidden="true" focusable="false" class="mp c-icon c-icon--chevron-down">
        <use xlink:href="/static/svg/sprite.svg#chevron-down"></use>
      </svg>
    </button>
    <ul id="products" class="c-facet__list">
      <li>
        <input type="checkbox" class="c-checkbox" name="products" id="mastersizer-3000-lab" value="Mastersizer 3000+ Lab"     />
        <label for="mastersizer-3000-lab">Mastersizer 3000+ Lab (20)</label>
      </li>
      <li>
        <input type="checkbox" class="c-checkbox" name="products" id="mastersizer-3000-pro" value="Mastersizer 3000+ Pro"     />
        <label for="mastersizer-3000-pro">Mastersizer 3000+ Pro (5)</label>
      </li>
      <li>
        <input type="checkbox" class="c-checkbox" name="products" id="mastersizer-3000-ultra" value="Mastersizer 3000+ Ultra"     />
        <label for="mastersizer-3000-ultra">Mastersizer 3000+ Ultra (1)</label>
      </li>
    </ul>
  </li>
</ul>

{
  "facets": [
    {
      "id": "products",
      "heading": "Products",
      "options": [
        {
          "id": "mastersizer-3000-lab",
          "value": "Mastersizer 3000+ Lab",
          "label": "Mastersizer 3000+ Lab (20)"
        },
        {
          "id": "mastersizer-3000-pro",
          "value": "Mastersizer 3000+ Pro",
          "label": "Mastersizer 3000+ Pro (5)"
        },
        {
          "id": "mastersizer-3000-ultra",
          "value": "Mastersizer 3000+ Ultra",
          "label": "Mastersizer 3000+ Ultra (1)"
        }
      ]
    }
  ]
}