NextUI is a fantastic library for building beautiful and functional user interfaces, but even the best tools can have hiccups. One such issue currently affects its Input component when used with the type="file" attribute. This post will delve into the problem, explain why it occurs, and offer a safe workaround until the issue is officially resolved. The Bug: Double Clicks and Undefined Files The issue manifests as follows: Clicking to Choose a File: When you first click the file input, the selected file appears to be "undefined" in the console. Second Attempt: Only after clicking the file selection dialog again does the selected file actually register and become available. This behavior is inconsistent and frustrating, especially when you expect the input to behave like a standard HTML <input type="file"> element. Root Cause: Empty String as Default Value The bug stems from how NextUI's Input component handles its default value. It assum...
Covering React frameworks like Next.js and Gatsby.js through brief articles with code snippets. Making learning easy for readers and myself.