From 6e77f1d5144d7d87b0c76b43ecf3d731166c808b Mon Sep 17 00:00:00 2001
From: Romain Hamel <rom.hml@gmail.com>
Date: Mon, 26 Feb 2024 12:55:30 +0100
Subject: [PATCH] fix(Checkbox): label interaction without `FormGroup` (#1427)

---
 src/runtime/components/forms/Checkbox.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/runtime/components/forms/Checkbox.vue b/src/runtime/components/forms/Checkbox.vue
index 78a50009..252afa4b 100644
--- a/src/runtime/components/forms/Checkbox.vue
+++ b/src/runtime/components/forms/Checkbox.vue
@@ -39,6 +39,7 @@ import type { Strategy } from '../../types'
 import appConfig from '#build/app.config'
 import { checkbox } from '#ui/ui.config'
 import colors from '#ui-colors'
+import { useId } from '#app'
 
 const config = mergeConfig<typeof checkbox>(appConfig.ui.strategy, appConfig.ui.checkbox, checkbox)
 
@@ -105,7 +106,8 @@ export default defineComponent({
   setup (props, { emit }) {
     const { ui, attrs } = useUI('checkbox', toRef(props, 'ui'), config, toRef(props, 'class'))
 
-    const { emitFormChange, color, name, inputId } = useFormGroup(props)
+    const { emitFormChange, color, name, inputId: _inputId } = useFormGroup(props)
+    const inputId = _inputId.value ?? useId()
 
     const toggle = computed({
       get () {