New Component: A customizable file uploader component for Streamlit

st_file_uploader

image
Open in Streamlit

This is a custom component that allows you to split files and send them from your browser to Streamlit.

Installation instructions

pip install st_file_uploader

Usage instructions

import streamlit as st
import st_file_uploader as stf

# Set page title and description
st.title("Custom File Uploader Demo")
st.write("This demo shows different ways to customize the file uploader component.")

# Using fully custom version
st.subheader("Fully Custom Version")
custom = stf.create_custom_uploader(
    uploader_msg="Drop your amazing file here!",
    limit_msg="Maximum size is 200MB",
    button_msg="Select File",
    icon="MdFileUpload"
)
file_custom = custom.file_uploader(
    "Upload with custom text",
    type=["xlsx", "csv"],
    accept_multiple_files=True,
)

# Basic usage (English default)
st.subheader("Basic Usage (Default English)")
file = stf.file_uploader(
    "Upload a CSV file",
    type="csv",
)

# Using Spanish version
st.subheader("Spanish Version")
file_es = stf.es.file_uploader(
    "Sube un archivo CSV",
    type="csv",
)

# Mix of language with custom overrides
st.subheader("French with overrides")
file_fr = stf.file_uploader(
    "Télécharger un fichier",
    type=["jpg", "png", "gif"],
    accept_multiple_files=True,
    button_msg="Sélectionner une image",
)
   
# Show multiple types
st.subheader("Multiple file types demo")
file_types = stf.file_uploader(
    "Upload documents",
    type="csv",
    accept_multiple_files=True,
)

Supported Languages

The component supports the following languages out of the box:

Language Code Language Usage Example
en English stf.file_uploader(...)
es Spanish stf.es.file_uploader(...)
fr French stf.fr.file_uploader(...)
de German stf.de.file_uploader(...)
it Italian stf.it.file_uploader(...)
pt Portuguese stf.pt.file_uploader(...)
zh Chinese stf.zh.file_uploader(...)
ja Japanese stf.ja.file_uploader(...)
ko Korean stf.ko.file_uploader(...)
ru Russian stf.ru.file_uploader(...)
ar Arabic stf.ar.file_uploader(...)
hi Hindi stf.hi.file_uploader(...)
nl Dutch stf.nl.file_uploader(...)
sv Swedish stf.sv.file_uploader(...)
pl Polish stf.pl.file_uploader(...)
tr Turkish stf.tr.file_uploader(...)
he Hebrew stf.he.file_uploader(...)
th Thai stf.th.file_uploader(...)
id Indonesian stf.id.file_uploader(...)
vi Vietnamese stf.vi.file_uploader(...)

Custom Language Pack

You can create your own custom language pack or override specific text:

custom = stf.create_custom_uploader(
    uploader_msg="Your custom drag and drop message",
    limit_msg="Your custom file size limit message",
    button_msg="Your custom button text",
    icon="MdFileUpload"  # Optional icon override
)

Parameters

The file_uploader function accepts the following parameters:

  • label: Text label to show above the uploader
  • type: Allowed file type(s) as string or list of strings
  • accept_multiple_files: Boolean to allow multiple file uploads
  • uploader_msg: Custom message for the uploader area (overrides language pack)
  • limit_msg: Custom message for file size limits (overrides language pack)
  • button_msg: Custom message for the browse button (overrides language pack)
  • icon: Icon to display (using React Icons naming)

Example Demo

Check out the live demo: https://st-fileuploader.streamlit.app/

2 Likes