Checkbox

First Name

        {% include "@Components/forms/checkbox/checkbox.twig" with {
  props : {
    id: "checkbox-button-checked",
    value: "checkbox-checked",
    label: "First Name",
    name: "checkbox-checked"
  }
} %}

                <div class="checkbox">
  <input type="checkbox" class="checkbox__input" id="checkbox-button-checked" name="checkbox-checked" value="checkbox-checked">
  <label class="f-label" for="checkbox-button-checked">
  <span class="f-label__title">First Name</span>
</label>
</div>

Checkbox checked

First Name

        {% include "@Components/forms/checkbox/checkbox.twig" with {
  props : {
    id: "checkbox-button",
    value: "checkbox",
    label: "First Name",
    name: "checkbox",
    checked: true
  }
} %}

                  <div class="checkbox">
  <input type="checkbox" class="checkbox__input" id="checkbox-button" name="checkbox" value="checkbox" checked="checked">
  <label class="f-label" for="checkbox-button">
  <span class="f-label__title">First Name</span>
</label>
</div>

Schema

    {
  "props": {
    "id": {
      "type": "string",
      "description": "id of input"
    },
    "value": {
      "type": "string",
      "description": "value of input"
    },
    "label": {
      "type": "string",
      "description": "label of input"
    },
    "name": {
      "type": "string",
      "description": "name of input"
    },
    "checked": {
      "type": "boolean",
      "description": "true | undefined"
    },
    "required": {
      "type": "boolean",
      "description": "true | undefined"
    }
  }
}