jrieke / streamlit-pills

πŸ’Š A Streamlit component to show clickable pills/badges

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Pills in a tab reset when a selection is made

sfc-gh-agaiduk opened this issue Β· comments

I observed a very peculiar bug that is happening when combining pills with tabs. When a pill is selected, it immediately resets, even though the selector value is assigned correctly. Here is a minimal reproducible example with the screen recording:

import streamlit as st
from streamlit_pills import pills

st.title("Pills tabs app")

if "setup_complete" not in st.session_state:
    st.write("Hello world!")
    st.session_state["setup_complete"] = True

c1, c2 = st.tabs(["Tab 1", "Tab 2"])
with c1:
    pill_selector = pills(
        "Pill selector", ["Option 1", "Option 2", "Option 3"], ["πŸ€", "🎈", "🌈"]
    )
    st.write("Pill selector option: ", pill_selector)

pills

To observe this behavior, 2 conditions must be met:

  • Pills are used within tabs - if pills are outside tabs, they render correctly;
  • We do some pre-processing during a first-time setup - i.e., if st.write("Hello world!") is moved outside of if "setup_complete" not in st.session_state block (or commented out), the pills are rendered correctly.

In a similar setup, st.radio selector does not reset:

import streamlit as st

st.title("Pills tabs app")

if "setup_complete" not in st.session_state:
    st.write("Hello world!")
    st.session_state["setup_complete"] = True

c1, c2 = st.tabs(["Tab 1", "Tab 2"])
with c1:
    radio_selector = st.radio(
        "Radio selector", ["Option 1", "Option 2", "Option 3"], horizontal=True
    )
    st.write("Radio selector option: ", radio_selector)

radio

As a workaround in my actual use case, I followed a suggestion in streamlit/streamlit#6257 based on this Streamlit question - if the tabs are rendered before the if "setup_complete" not in st.session_state block, the pills selector works correctly:

import streamlit as st
from streamlit_pills import pills

st.title("Pills tabs app")

c1, c2 = st.tabs(["Tab 1", "Tab 2"])
with c1:
    pill_selector = pills(
        "Pill selector", ["Option 1", "Option 2", "Option 3"], ["πŸ€", "🎈", "🌈"]
    )
    st.write("Pill selector option: ", pill_selector)

if "setup_complete" not in st.session_state:
    st.write("Hello world!")
    st.session_state["setup_complete"] = True