[fix] Pressable disabled focus behavior

Fix #2127

packages/react-native-web/src/exports/Pressable/__tests__/index-test.js

@@ -91,6 +91,25 @@ describe('components/Pressable', () => {
     expect(container.firstChild).toMatchSnapshot();
   });
 
+  test('focus interaction (disabled)', () => {
+    const onBlur = jest.fn();
+    const onFocus = jest.fn();
+    const ref = React.createRef();
+    act(() => {
+      render(<Pressable disabled={true} onBlur={onBlur} onFocus={onFocus} ref={ref} />);
+    });
+    const target = createEventTarget(ref.current);
+    const body = createEventTarget(document.body);
+    act(() => {
+      target.focus();
+    });
+    expect(onFocus).not.toBeCalled();
+    act(() => {
+      body.focus({ relatedTarget: target.node });
+    });
+    expect(onBlur).not.toBeCalled();
+  });
+
   test('hover interaction', () => {
     let container;
     const onHoverIn = jest.fn();

packages/react-native-web/src/exports/Pressable/index.js

@@ -144,6 +144,9 @@ function Pressable(props: Props, forwardedRef): React.Node {
 
   const blurHandler = React.useCallback(
     (e) => {
+      if (disabled) {
+        return;
+      }
       if (e.nativeEvent.target === hostRef.current) {
         setFocused(false);
         if (onBlur != null) {
@@ -151,11 +154,14 @@ function Pressable(props: Props, forwardedRef): React.Node {
         }
       }
     },
-    [hostRef, setFocused, onBlur]
+    [disabled, hostRef, setFocused, onBlur]
   );
 
   const focusHandler = React.useCallback(
     (e) => {
+      if (disabled) {
+        return;
+      }
       if (e.nativeEvent.target === hostRef.current) {
         setFocused(true);
         if (onFocus != null) {
@@ -163,7 +169,7 @@ function Pressable(props: Props, forwardedRef): React.Node {
         }
       }
     },
-    [hostRef, setFocused, onFocus]
+    [disabled, hostRef, setFocused, onFocus]
   );
 
   const contextMenuHandler = React.useCallback(