File size: 3,342 Bytes
3b08097
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
import itertools

import streamlit as st
import pandas as pd
import numpy as np

st.set_page_config(page_title="Streamlit Theme for Charts", page_icon="πŸ—ƒ")


def icon(emoji: str):
    """Shows an emoji as a Notion-style page icon."""
    st.write(
        f'<span style="font-size: 78px; line-height: 1">{emoji}</span>',
        unsafe_allow_html=True,
    )

HEADER_COLOR_CYCLE = itertools.cycle(
    [
        "#00c0f2",  # light-blue-70",
        "#ffbd45",  # "orange-70",
        "#00d4b1",  # "blue-green-70",
        "#1c83e1",  # "blue-70",
        "#803df5",  # "violet-70",
        "#ff4b4b",  # "red-70",
        "#21c354",  # "green-70",
        "#faca2b",  # "yellow-80",
    ]
)


def space(num_lines=1):
    """Adds empty lines to the Streamlit app."""
    for _ in range(num_lines):
        st.write("")


def colored_header(label, description=None, color=None):
    """Shows a header with a colored underline and an optional description."""
    space(num_lines=2)
    if color is None:
        color = next(HEADER_COLOR_CYCLE)
    st.subheader(label)
    st.write(
        f'<hr style="background-color: {color}; margin-top: 0; margin-bottom: 0; height: 3px; border: none; border-radius: 3px;">',
        unsafe_allow_html=True,
    )
    if description:
        st.caption(description)


icon("πŸ—ƒ")

st.title("Tab Container Prototype")

def space(num_lines=1):
    """Adds empty lines to the Streamlit app."""
    for _ in range(num_lines):
        st.write("")

@st.experimental_memo
def get_data():
    return pd.DataFrame(np.random.randn(20, 5), columns=["a", "b", "c", "d", "e"])

if "tabs" not in st.session_state:
    st.session_state["tabs"] = ["Filter Data", "Raw Data", "πŸ“ˆ Chart"]

if "tabs_sidebar" not in st.session_state:
    st.session_state["tabs_sidebar"] = False

with st.expander("Show code"):
    st.code("""
import streamlit as st
import pandas as pd
import numpy as np
@st.experimental_memo
def get_data():
    return pd.DataFrame(np.random.randn(20, 3), columns=["a", "b", "c"])
tab1, tab2, tab3 = st.tabs(["Filter Data", "Raw Data", "πŸ“ˆ Chart"])
with tab1:
    col = st.selectbox("Select column", options=["a", "b", "c"])
    filter = st.slider("Filter range", -2.5, 2.5, (-2.0, 2.0), step=0.01)
    filter_query = f"{filter[0]} < {col} < {filter[1]}"
with tab2:
    st.dataframe(get_data().query(filter_query))
with tab3:
    st.line_chart(get_data().query(filter_query))
    """)

tabs = st.tabs(st.session_state["tabs"])

with tabs[0]:
    col = st.selectbox("Select column", options=["a", "b", "c"])
    filter = st.slider("Filter range", -2.5, 2.5, (-2.0, 2.0), step=0.01)
    filter_query = f"{filter[0]} < {col} < {filter[1]}"

with tabs[1]:
    st.dataframe(get_data().query(filter_query), height=300)

with tabs[2]:
    st.line_chart(get_data().query(filter_query))

if  st.session_state["tabs_sidebar"]:
    tab1, tab2 = st.sidebar.tabs(["Tab 1", "Tab 2"])
    data = np.random.randn(10, 1)

    tab1.write("this is tab 1")

    tab2.write("this is tab 2")

space(num_lines=2)

colored_header("Tabs Configruations")

new_tab = st.text_input("Tab label", "New Tab")
if st.button("Add tab"):
    st.session_state["tabs"].append(new_tab)
    st.experimental_rerun()

if st.button("Add tabs container to sidebar"):
    st.session_state["tabs_sidebar"] = True
    st.experimental_rerun()