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.