To help Streamlit prioritize this feature, react with a 👍 (thumbs up emoji) to the initial post.

Your vote helps us identify which enhancements matter most to our users.

It's a reasonable request when many modals will support image input 🤔

Yup we definitely want to support this! What do y'all think would be the best return format for an image? Maybe a PIL image or a numpy array?

https://platform.openai.com/docs/guides/vision
According to gpt4v api, it need an array of image and text. maybe we need a rich text input (only accept normal text and image) to chat_input?

for the format, in the scenario of gpt4v, base64 maybe a better format. lol 🤣

I would say PIL is the most Pythonic format for the return value. Input should of course be anything from filename string to bytes array 😁

Yup we definitely want to support this! What do y'all think would be the best return format for an image? Maybe a PIL image or a numpy array?

numpy

Update

Hey all!

We just started working on this. Here's a very early prototype (note that the design is very scrappy for now, we'll obviously improve that!): https://file-uploader-in-chat-input.streamlit.app/

API

This works by adding two new parameters to chat input:

st.chat_input(..., accept_file=False|True|"multiple", file_type=None|str|List[str])

So for example to accept a single image file, you would do:

st.chat_input(accept_file=True, file_type=["png", "jpg"])

If accept_file is set to True or "multiple", the return value of the chat input will be a dictionary of the following form:

{
    "text": "the user input", 
    "files": [UploadedFile(...), UploadedFile(...)]
}

The type of the files (UploadedFile) is the same one that we return for st.file_uploader. Also in general, we're trying to align everything with our normal file uploader as much as possible.

Try it out!

You can download the wheel file from here. Feel free to play around and post feedback below! We're finishing up a few things and need to add tests before we launch.

Can't wait for the wheel :) ! Wish I could use it today for my code challenge haha.

Hi @jrieke, Thanks for the info.
Is this feature already in nightly release?

To answer: No this is not available in nightly releases yet.
Still looking forward to test.

Any update on this? Also we should have a similar audio recorder button along with file attachment

Hey all, I just added a link to the wheel file (and updated the demo link) to my post above (or go directly here for the wheel file 😉 ). Let me know if you try it out and if there's any feedback!

That's wonderful!

Since you asked for feedback, I'm not sure about the design for multiple file uploads: it seems unconventional. Before uploading my second file, I expected it to appear under the first one, on its own line as a list. When it didn't, I thought, "It did not upload, and I can only upload one file"... until I saw the arrows, which are not very visible in the dark theme. It also requires a lot of clicks if you need to remove the last attachment you added. It also seems strange to refer to them as "pages".

I think more traditional designs could look like either a list of files with one line each, small cards with a preview (like Slack/Discord), or without a preview (which could be a single row with horizontal scrolling if needed).

Otherwise, the rest of the design is great! I like the progress bar and the user interface with a single file. Thank you for your great work, I'll use it straight away!

@ddorn that's a great point -- we are working on a new design for multiple file uploads for the release version. And it would be closer to the traditional designs you brought up here.
Appreciate you trying it out and sharing your thoughts!

Very excited for this feature! Also, allowing image paste from clipboard would be super useful. Ideally through Ctrl-V when the chat input has focus, but a button would work too (similar functionality is present in streamlit-paste-button and st-img-pastebutton)

EDIT:
If anyone else stumbles across this and needs a working solution now,
I found this component: https://github.com/het-25/st-multimodal-chatinput
which allows image(s) paste & file upload.

Hi all, super excited to see the release of this feature, it looks great!

@sfc-gh-pchiu just wondering what release you are targeting this to land in?

Probably in January or February!