No Training Data Empty State Block for React

The file stays in the tab: the page reads only its name and size, never its contents, so nothing is parsed, checked for shape or uploaded, and a reload clears it, as does Start over. The check is by extension only. To wire it for real, upload the file to your storage where the code says so, then validate its rows on your server and report problems per line in the status line.

The three formats are a real segment group: arrow keys move between them and the example in the code window changes to that format's lines. All three examples sit in one cell and only the chosen one is shown, so the window never changes size. Edit the lines and extensions in the data at the top of the file to match what your tool takes.

A file named like the format's own extension, in any letter case, is Accepted and the network's input layer fills in. Any other file is listed with what the format expects, and if you pick the format that matches it the same file is Accepted without choosing it again. Only one file is held at a time; a new pick replaces it, and dropping several at once is turned down with a line that says so.

Tab reaches the format group, the example (a focusable region, because a long line scrolls), Upload dataset and Start over. The drawing is hidden from assistive technology and the one polite status line says whether the file matched, so the result is never only a color or a shape.

The example sits above the zone, in a window that scrolls sideways inside itself if a line is long. The format group, the button and the result follow, and the page never scrolls sideways, even at 320 px wide.

No. The three examples share one cell, the result row is always there, dashed and empty until a file is picked, and the status line reserves its lines, so choosing a format or a file never moves the panel.