11 lines
786 B
Vue
11 lines
786 B
Vue
<script setup lang="ts">
|
|
import { computed, useId } from 'vue'
|
|
import Checkbox from 'primevue/checkbox'
|
|
const props = defineProps<{ modelValue: boolean; label: string; inputId?: string; disabled?: boolean }>()
|
|
const emit = defineEmits<{ 'update:modelValue': [value: boolean] }>()
|
|
const generatedId = useId()
|
|
const resolvedId = computed(() => props.inputId ?? `ks-check-${generatedId}`)
|
|
</script>
|
|
<template><label class="ks-check" :for="resolvedId"><Checkbox class="ks-checkbox" :input-id="resolvedId" :model-value="modelValue" binary :disabled="disabled" @update:model-value="emit('update:modelValue', Boolean($event))" /><span>{{ label }}</span></label></template>
|
|
<style scoped>.ks-check { display: inline-flex; align-items: center; gap: var(--ks-space-2); cursor: pointer; }</style>
|