streamlit_qs is an add-on library that extends the functionality existing streamlit input elements to easily read and write data to-and-from the URL query string. This makes it easy to do two things:
Generate a “permalink” for users that captures the “state” of your application and can return them to that same state at a later time, or shared with others.
Feed data directly to your streamlit app from other applications by encoding it in a JSON string or a compressed base64 string.
It’s kind of pointless to show the new components in images because they look identical to existing
ones so textboxes it is, but there’s also a demo page:
Reading data from the URL
import streamlit_qs as stqs
stqs.text_input_qs("Enter Some Text", key="input_some_text")
# Nagivating to https://your.streamlit.app/?input_some_text=Hello+World
# will populate the text box with "Hello World"
Writing data to the URL
import streamlit_qs as stqs
stqs.text_input_qs("Enter Some Text", key="input_some_text", autoupdate=True)
# Now when you type "Ok, I input some text" into the text_input box,
# the page URL updates to
It’s not just text input streamlit_qs supports most of the standard input elements, and comes with functions
to easily extend your own custom elements with query-string interaction.
I don’t know if there is a post dedicated solely to this component. I searched for it but haven’t found anything.
I’m just asking if there’s any way to make the chart responsive to the container size? Something like use_container_width=True. Depending on the window size, the chart either excludes some parts of it or displays a lot of blank space around it.
I have 2 custom components to share and a package of mini-components and functions
streamlit-code-editor : Post・PYPI・Github・Docs・Demo
Essentially a code editor component based on Ace Editor that is customized and extended with Streamlit in mind. Two custom themes (light, dark) were created to change the appearance of the editor to be closer to Streamlit’s own code block (font, line spacing, tokenization and coloring, etc) as well as to incorporate elements of streamlit app’s theme. On top of this, this code editor allows you to add optional elements like buttons, an info/status bar, and a menu bar.
streamlit-reveal-slides : Post・PYPI・Github・Demo
A component that generates reveal.js HTML presentations from markdown or markup. The generated presentation is then embedded into your Streamlit app for full-featured use. You can run the presentation right from inside your app in embedded mode or fullscreen mode. This component is bidirectional allowing your Streamlit app to control/change the presentation but also allowing your app to respond to changes in the presentation.
streamlit-float : Post・PYPI・Github・Demo
A simple python package that provides functions that allow you to target containers (like st.columns and st.container) with CSS with the main feature being the ability to fixed the position of containers with respect to the viewport (causing them to appear as if they are floating). The package provides multiple ways to achieve this with the simplest being as easy as calling the float function on a container (example: my_container.float()). Additionally, this package also provides access to mini-components like Float Box and Float Dialog.
Let me know if I am missing anything or if any of the links/apps are broken.
created a Tab Bar component in Streamlit to empower customization of styles. While st.tabs handles this functionality really well.Some use cases are there to have a Tab Bar with a little different styling apart from the theme where this component comes into the picture. It provides the functionality to change fontSize , fontWeight,textColor,HoverStateColor and background of the Tab bar.
Hi All, I recently built a streamlit-dynamic-filters component. The filters apply to a dataframe and adjust their values based on the user selection (similar to Google Sheets slicers or Only Relevant Values in Tableau).
Here’s some additional details about the component: