### Website or app

https://react.dev

### Repro steps

1. Go to components tab.
2. For any component, try to copy the value in props, hooks etc. to clipboard.

![image](https://user-images.githubusercontent.com/75756768/228340421-a901498a-1308-4e8f-b502-989f4c60331f.png)


### How often does this bug happen?

Every time

### DevTools package (automated)

_No response_

### DevTools version (automated)

_No response_

### Error message (automated)

_No response_

### Error call stack (automated)

_No response_

### Error component stack (automated)

_No response_

### GitHub query string (automated)

_No response_
'Unsupported hook in the react-debug-tools package: ' +
            error.message,
        };
      }
       Log Uncaught Error
      console.error('Error inspecting element.\n\n', error);
      return {
        type: 'error',
        errorType: 'uncaught',
        id,
        responseID: requestID,
        message: error.message,
        stack: error.stack,
      };
    }
    if (mostRecentlyInspectedElement === null) {
      return {
        id,
        responseID: requestID,
        type: 'not-found',
      };
    }
     Any time an inspected element has an update,
     we should update the selected $r value as wel.
     Do this before dehydration (cleanForBridge).
    updateSelectedElement(mostRecentlyInspectedElement);
     Clone before cleaning so that we preserve the full data.
     This will enable us to send patches without re-inspecting if hydrated paths are requested.
     (Reducing how often we shallow-render is a better DX for function components that use hooks.)
    const cleanedInspectedElement = {...mostRecentlyInspectedElement};