JSFiddle - React, Tailwind, and code Playground

HTML

<div class="ms-item multi">
  <input type="checkbox" name="type[]" class="un-ch-all" id="all1">
  <label for="all1">Все цифры</label>

  <p>
    <input type="checkbox" name="type[]" id="aa">
    <label for="aa">1</label>
  </p>
  <p>
    <input type="checkbox" name="type[]" id="ab">
    <label for="ab">2</label>
  </p>
  <p>
    <input type="checkbox" name="type[]" id="ac">
    <label for="ac">3</label>
  </p>
  <p>
    <input type="checkbox" name="type[]" id="ad">
    <label for="ad">4</label>
  </p>
</div>
<div class="ms-item multi">
  <input type="checkbox" name="type2[]" class="un-ch-all" id="ba">
  <label for="ba">Любые буквы</label>

  <p>
    <input type="checkbox" name="type2[]" id="bb">
    <label for="bb">а</label>
  </p>
  <p>
    <input type="checkbox" name="type2[]" id="bc">
    <label for="bc">б</label>
  </p>
  <p>
    <input type="checkbox" name="type2[]" id="bd">
    <label for="bd">в</label>
  </p>
  <p>
    <input type="checkbox" name="type2[]" id="be">
    <label for="be">г</label>
  </p>
  <p>
    <input type="checkbox" name="type2[]" id="bf">
    <label for="bf">д</label>
  </p>
  <p>
    <input type="checkbox" name="type2[]" id="bg">
    <label for="bg">е</label>
  </p>

</div>

JavaScript

$('.un-ch-all').on('click', function () {
        var check=$(this).prop('checked');
        var inpt = $(this).closest('.multi').find('p > input');
        inpt.each(function() {
        	if( (check && !$(this).prop('checked'))||
          		(!check &&$(this).prop('checked'))
          )
                	$(this).click();
             });
       
       
    });
   $('.multi').on('click','input:not(.un-ch-all)', function () {
   	var all = $(this).closest('.multi').find('.un-ch-all');
   	var inpt = $(this).closest('.multi').find('p');
    all.prop('checked',inpt.find('input').length == inpt.find('input:checked').length);
   });