Skip to content

Checkbox ​

State belongs to the parent. Compose this component with the props and slots below.

Preview ​

Open in the playground

Usage ​

CheckboxExample.vueVue / TS
<script setup lang="ts">
import { ref } from 'vue'
import { FzCheckbox } from '@chrisdalbano/forza-ui'
const shared = ref<boolean>(false)
</script>

<template>
  <FzCheckbox v-model="shared" label="Share with the team" />
</template>
TypeScript exampleSource you can use.

Import the shared stylesheet once and wrap your app in .fz-theme. See installation.

Props ​

NameTypeRequiredDefault
labelstringYesNone
descriptionstring | undefinedNoNone
disabledboolean | undefinedNoNone
namestring | undefinedNoNone
modelValueboolean | "indeterminate"YesNone

Events and state ​

v-model: boolean or indeterminate

  • update:modelValue: [value: boolean | "indeterminate"]

Slots ​

none

Add from source ​

sh
forza add checkbox

Set up the CLI first. Generated API tables come from the Vue source, using Vue Language Tools.

Released under the MIT License. Independent work.