diff --git a/packages/radix-vue/src/Checkbox/CheckboxRoot.vue b/packages/radix-vue/src/Checkbox/CheckboxRoot.vue index 65eaa4168..bf5894cc6 100644 --- a/packages/radix-vue/src/Checkbox/CheckboxRoot.vue +++ b/packages/radix-vue/src/Checkbox/CheckboxRoot.vue @@ -51,7 +51,7 @@ const checked = useVModel(props, 'checked', emits, { const { primitiveElement, currentElement } = usePrimitiveElement() // We set this to true by default so that events bubble to forms without JS (SSR) const isFormControl = computed(() => currentElement.value ? Boolean(currentElement.value.closest('form')) : true) -const ariaLabel = computed(() => props.id && currentElement.value ? (document.querySelector(`[for=${props.id}]`) as HTMLLabelElement)?.innerText : undefined) +const ariaLabel = computed(() => props.id && currentElement.value ? (document.querySelector(`[for="${props.id}"]`) as HTMLLabelElement)?.innerText : undefined) provide(CHECKBOX_INJECTION_KEY, { disabled, diff --git a/packages/radix-vue/src/RadioGroup/Radio.vue b/packages/radix-vue/src/RadioGroup/Radio.vue index 3299a9346..909c12d7d 100644 --- a/packages/radix-vue/src/RadioGroup/Radio.vue +++ b/packages/radix-vue/src/RadioGroup/Radio.vue @@ -35,7 +35,7 @@ const context = inject(RADIO_GROUP_INJECTION_KEY) const isFormControl = computed(() => triggerElement.value ? Boolean(triggerElement.value.closest('form')) : true, ) -const ariaLabel = computed(() => props.id && triggerElement.value ? (document.querySelector(`[for=${props.id}]`) as HTMLLabelElement)?.innerText : undefined) +const ariaLabel = computed(() => props.id && triggerElement.value ? (document.querySelector(`[for="${props.id}"]`) as HTMLLabelElement)?.innerText : undefined) const hasConsumerStoppedPropagationRef = ref(false) diff --git a/packages/radix-vue/src/Switch/SwitchRoot.vue b/packages/radix-vue/src/Switch/SwitchRoot.vue index 4ffd117cb..f9ec0284f 100644 --- a/packages/radix-vue/src/Switch/SwitchRoot.vue +++ b/packages/radix-vue/src/Switch/SwitchRoot.vue @@ -55,7 +55,7 @@ function toggleCheck() { const { primitiveElement, currentElement } = usePrimitiveElement() // We set this to true by default so that events bubble to forms without JS (SSR) const isFormControl = computed(() => currentElement.value ? Boolean(currentElement.value.closest('form')) : true) -const ariaLabel = computed(() => props.id && currentElement.value ? (document.querySelector(`[for=${props.id}]`) as HTMLLabelElement)?.innerText : undefined) +const ariaLabel = computed(() => props.id && currentElement.value ? (document.querySelector(`[for="${props.id}"]`) as HTMLLabelElement)?.innerText : undefined) provide(SWITCH_INJECTION_KEY, { checked,