## The current behavior

The full value of the `key` is very difficult / impossible to find and use in the interface of the React Devtools.

![Kapture 2020-04-22 at 11 47 47](https://user-images.githubusercontent.com/1935696/79997715-25222680-84ba-11ea-97ba-51f1679a8c91.gif)

Only managed to find it by accident :(

## The expected behavior

The `key` is visible in the props list to the right.

### Detailed Proposal

As mentioned below in https://github.com/facebook/react/issues/18702#issuecomment-617924196

Add a light divider and new section in the props panel to the right.

Potentially also add a question mark that shows an explanation about the fact that things in this section are not really props.

Ref (Original implementation): https://github.com/facebook/react-devtools/pull/328
</InspectedElementContext.Provider>
  );
}
function hydrateHelper(
  dehydratedData: DehydratedData | null,
  path?: Array<string | number>,
): Object | null {
  if (dehydratedData !== null) {
    const {cleaned, data, unserializable} = dehydratedData;
    if (path) {
      const {length} = path;
      if (length > 0) {
        
        
        return hydrate(
          data,
          cleaned.map(cleanedPath => cleanedPath.slice(length)),
          unserializable.map(unserializablePath =>
            unserializablePath.slice(length),
          ),
        );
      }
    }
    return hydrate(data, cleaned, unserializable);
  } else {
    return null;
  }
}
export {InspectedElementContext, InspectedElementContextController};