Description

Using React useState to control the value of Editable, calling setState does not seem to change the internal value of Editable.

Link to Reproduction

https://codesandbox.io/s/naughty-glade-ufqr78?file=/pages/index.tsx

Steps to reproduce

1. The name state is set to "John" in useEffect once initially
2. Click on the Editable text: "John"
3. You can change, or not to change the Editable text.
4. Press Escape key to abort.
5. Editable shows placeholder text and the name state becomes the default empty string specified in useState("")

Chakra UI Version

1.8.6

Browser

Google Chrome 99

Operating System

• macOS
• Windows
• Linux

Additional Information

No response