[BUG] - This repo used Key from @react-types/shared but the shown Example using React.Key

[acehinnnqru]

NextUI Version

2.2.9

Describe the bug

I am trying to use the AutoComplete component. When I try to customize the selectedKey and onSelectionChanged following the instructions in doc: https://nextui.org/docs/components/autocomplete#controlled.

I copy the code in the sample but got error:

Type 'Key' is not assignable to type 'Key | null | undefined'.
     Type 'bigint' is not assignable to type 'Key | null | undefined'.

After confirming, I found that the sample code in the Controlled section of Autocomplete component uses React.Key but the repo uses Key from @react-types/shared. The React.Key is string | number | bigint whose bigint was added several months ago. The Key from @react-types/shared is string | number.

I can't determine if this should be a doc bug or a code bug.

But it's so ambiguous to the users.

Your Example Website or App

https://nextui.org/docs/components/autocomplete#controlled

Steps to Reproduce the Bug or Issue

See the desc and go to the doc for double checking

Expected behavior

The sample in the doc should work well.

Screenshots or Videos

No response

Operating System Version

macOS

Browser

Chrome

[wingkwong]

From the messages discussed in adobe/react-spectrum, they haven't added bigint to @react-types/shared since they haven't tested with those values.

[mauriciopiber]

I've come with this issue after upgrade @nextui-org/react to ^2.3.6.

When running tsc, I got the following output

error TS2345: Argument of type 'React.Key' is not assignable to parameter of type 'Key'.
return getKeyValue(item, columnKey);

I was able to temporary fix by replacing import { Key } from 'react' with import { Key } from '@react-types/shared' as described.