スキル一覧に戻る
streamlit

using-streamlit-custom-components

by streamlit

A collection of agent skills for development of Streamlit apps.

6🍴 1📅 2026年1月23日
GitHubで見るManusで実行

SKILL.md


Streamlit custom components

Extend Streamlit with third-party custom components from the community.

What are custom components?

Custom components are standalone Python libraries that add features not in Streamlit's core API. They're built by the community and can be installed like any Python package.

Installation

Install using the PyPI package name (not the repo name—they can differ):

uv add <pypi-package-name>

Then import according to the component's documentation. The import name often differs from the package name too.

Use with caution

Components are not maintained by Streamlit. Before adopting:

  • Check maintenance - Is it actively maintained? Recent commits?
  • Check compatibility - Does it work with your Streamlit version?
  • Check popularity - GitHub stars, downloads, community usage
  • Consider alternatives - Can you achieve this with core Streamlit?

Custom components can break when Streamlit updates, so prefer core features when possible.

streamlit-keyup

Text input that fires on every keystroke instead of waiting for enter/blur. Useful for live search.

uv add streamlit-keyup
from st_keyup import st_keyup

query = st_keyup("Search", debounce=300)  # 300ms debounce
filtered = df[df["name"].str.contains(query, case=False)]
st.dataframe(filtered)

streamlit-bokeh

Official replacement for st.bokeh_chart (removed from Streamlit API). Maintained by Streamlit.

uv add streamlit-bokeh
from bokeh.plotting import figure
from streamlit_bokeh import streamlit_bokeh

p = figure(title="Simple Line", x_axis_label="x", y_axis_label="y")
p.line([1, 2, 3, 4, 5], [6, 7, 2, 4, 5], line_width=2)
streamlit_bokeh(p)

streamlit-aggrid

Interactive dataframes with sorting, filtering, cell editing, grouping, and pivoting. Use when you need customization beyond what st.dataframe and st.data_editor offer.

uv add streamlit-aggrid
from st_aggrid import AgGrid

AgGrid(df, editable=True, filter=True)

When to use aggrid over st.dataframe:

  • Interactive row grouping and pivoting
  • Advanced filtering and sorting UI
  • Complex cell editing workflows
  • Custom cell renderers

streamlit-folium

Interactive maps powered by Folium.

uv add streamlit-folium
import folium
from streamlit_folium import st_folium

m = folium.Map(location=[37.7749, -122.4194], zoom_start=12)
st_folium(m, width=700)

pygwalker

Tableau-like drag-and-drop data exploration.

uv add pygwalker
import pygwalker as pyg

pyg.walk(df, env="Streamlit")

streamlit-extras

A collection of community utilities. Cherry-pick what you need.

uv add streamlit-extras
from streamlit_extras.image_selector import image_selector

# Let users click on regions of an image
selection = image_selector(image, selections=["Region A", "Region B"])
from streamlit_extras.vertical_slider import vertical_slider

# A vertical slider widget
value = vertical_slider("Volume", min_value=0, max_value=100, default_value=50)

Discover more

Browse the custom component gallery: https://streamlit.io/components

Filter by category, popularity, and recency to find custom components for your use case.

References

スコア

総合スコア

55/100

リポジトリの品質指標に基づく評価

SKILL.md

SKILL.mdファイルが含まれている

+20
LICENSE

ライセンスが設定されている

+10
説明文

100文字以上の説明がある

0/10
人気

GitHub Stars 100以上

0/15
最近の活動

3ヶ月以内に更新がある

0/10
フォーク

10回以上フォークされている

0/5
Issue管理

オープンIssueが50未満

+5
言語

プログラミング言語が設定されている

0/5
タグ

1つ以上のタグが設定されている

0/5

レビュー

💬

レビュー機能は近日公開予定です