[checkbox] Ignore data-focused Field attribute when disabled (#4998)

Author: atomiks

packages/react/src/checkbox/root/CheckboxRoot.test.tsx

@@ -1174,6 +1174,20 @@ describe('<Checkbox.Root />', () => {
       expect(button).not.toHaveAttribute('data-focused');
     });
 
+    it('does not set [data-focused] when disabled', async () => {
+      await render(
+        <Field.Root>
+          <Checkbox.Root disabled data-testid="button" />
+        </Field.Root>,
+      );
+
+      const button = screen.getByTestId('button');
+
+      fireEvent.focus(button);
+
+      expect(button).not.toHaveAttribute('data-focused');
+    });
+
     it('[data-invalid]', async () => {
       await render(
         <Field.Root invalid>

packages/react/src/checkbox/root/CheckboxRoot.tsx

@@ -317,7 +317,9 @@ export const CheckboxRoot = React.forwardRef(function CheckboxRoot(
         'aria-labelledby': ariaLabelledBy,
         [PARENT_CHECKBOX as string]: parent ? '' : undefined,
         onFocus() {
-          setFocused(true);
+          if (!disabled) {
+            setFocused(true);
+          }
         },
         onBlur() {
           const inputEl = inputRef.current;