fix(VCheckboxBtn): reset checked state when readonly is true (#19861)

fixes #19137

packages/vuetify/src/components/VCheckbox/__tests__/VCheckboxBtn.spec.cy.tsx

@@ -47,4 +47,17 @@ describe('VCheckboxBtn', () => {
 
     cy.get('input').should('have.attr', 'aria-checked', 'mixed')
   })
+
+  it('should not update input checked state when it is readonly', () => {
+    const model = ref(false)
+    cy.mount(() => (
+      <VCheckboxBtn v-model={ model.value } readonly />
+    ))
+
+    cy.get('.v-checkbox-btn').click(20, 20)
+
+    cy.get('input').should('not.be.checked').then(() => {
+      expect(model.value).to.be.false
+    })
+  })
 })

packages/vuetify/src/components/VSelectionControl/VSelectionControl.tsx

@@ -204,7 +204,16 @@ export const VSelectionControl = genericComponent<new <T>(
     }
 
     function onInput (e: Event) {
-      if (!isInteractive.value) return
+      if (!isInteractive.value) {
+        if (input.value) {
+          // model value is not updated when input is not interactive
+          // but the internal checked state of the input is still updated,
+          // so here it's value is restored
+          input.value.checked = model.value
+        }
+
+        return
+      }
 
       if (props.readonly && group) {
         nextTick(() => group.forceUpdate())