@govbr-ds/core/dist/util/checkgroup/examples/checkgroup-behavior-chain.html

Padrão Digital de Governo

<div class="mb-1">
  <div class="checkgroup-example">
    <input id="p2" name="p2" type="checkbox" aria-label="Selecionar tudo" checked="checked" indeterminate="indeterminate" data-parent="check-02" data-checked-label="Selecionar tudo" data-unchecked-label="Desselecionar tudo"/>
    <label for="p2">Selecionar tudo</label>
  </div>
</div>
<div class="mb-1 ml-2">
  <div class="checkgroup-example">
    <input id="p2-f1" name="p2-f1" type="checkbox" aria-label="opção 1" checked="checked" data-child="check-02"/>
    <label for="p2-f1">Opção 1</label>
  </div>
</div>
<div class="mb-1 ml-2">
  <div class="checkgroup-example">
    <input id="p2-f2" name="p2-f2" type="checkbox" aria-label="opção 2" data-child="check-02"/>
    <label for="p2-f2">Opção 2</label>
  </div>
</div>
<div class="mb-1 ml-2">
  <div class="checkgroup-example">
    <input id="p2-f3" name="p2-f3" type="checkbox" aria-label="Selecionar grupo" data-parent="check-03" data-child="check-02" data-checked-label="Selecionar grupo" data-unchecked-label="Desselecionar grupo"/>
    <label for="p2-f3">Selecionar grupo</label>
  </div>
</div>
<div class="mb-1 ml-4">
  <div class="checkgroup-example">
    <input id="p2-f3-1" name="p2-f3-1" type="checkbox" aria-label="opção 3" data-child="check-03"/>
    <label for="p2-f3-1">Opção 3</label>
  </div>
</div>
<div class="mb-1 ml-4">
  <div class="checkgroup-example">
    <input id="p2-f3-2" name="p2-f3-2" type="checkbox" aria-label="opção 3" data-child="check-03"/>
    <label for="p2-f3-2">Opção 3</label>
  </div>
</div>