JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout-validation/2.0.3/knockout.validation.min.js"></script>

<input type="checkbox" id="accept" name="accept" value="true" data-bind="checked: form().accepted"/>
<label for="accept">
  input value: <span data-bind="text: JSON.stringify(form().accepted())"></span>
</label>

<p>
  Form valid:
  <span data-bind="text: JSON.stringify(form.isValid())"></span>
</p>

JavaScript

ko.validation.init({
    parseInputAttributes: true,
    writeInputAttributes: true,
    decorateInputElement: true,
    grouping : {
      deep: true,
      observable: true
    }
}, true);


ko.applyBindings(function () {
	this.form = ko.validatedObservable({
  	accepted: ko.observable(false).extend({required: true})
  });
});