2024 dec 30: Documentaion added

Signed-off-by: Milind Kamat <36366961+milindkamat0507@users.noreply.github.com>

app.py

@@ -1,29 +1,47 @@
 import streamlit as st
+from typing import List, Dict, Tuple, Optional, Any
 
 class StreamlitTutorial:
+    """
+    Main class for Streamlit Tutorial application.
+    Handles all UI rendering and tutorial logic.
+    """
+
     def __init__(self):
+        """
+        Initializes the Streamlit Tutorial application.
+        Sets up page config, session state, and styles.
+        """
         st.set_page_config(page_title="Learn Streamlit", layout="wide")
         self.init_session_state()
         self.setup_styles()
 
-    def init_session_state(self):
+    def init_session_state(self) -> None:
+        """
+        Initializes session state variables for the application.
+        Handles code input persistence and current topic tracking.
+        Returns: None
+        """
         if 'code_input' not in st.session_state:
             st.session_state.code_input = ""
             st.session_state.current_topic = "Basic Text Elements"
 
-    def setup_styles(self):
+    def setup_styles(self) -> None:
+        """
+        Sets up custom CSS styles for the application.
+        Handles margins, padding, and layout styling.
+        Returns: None
+        """
         st.markdown("""
         <style>
-        .code-example { 
-            margin-bottom: 1.5rem;
-        }
-        .live-output {
+        .code-example { margin-bottom: 1.5rem; }
+        .live-output { 
             border: 1px solid #ddd;
             border-radius: 4px;
             padding: 1rem;
             margin: 0.5rem 0 1.5rem 0;
         }
-        .section-title {
+        .section-title { 
             margin-bottom: 1rem;
             padding: 0.5rem 0;
         }
@@ -35,7 +53,12 @@ class StreamlitTutorial:
         </style>
         """, unsafe_allow_html=True)
 
-    def get_text_elements(self):
+    def get_text_elements(self) -> List[Tuple[str, str]]:
+        """
+        Provides list of text element examples with their code.
+        Used for generating code examples and snippets.
+        Returns: List of tuples containing (title, code snippet)
+        """
         return [
             ("Title", "st.title('Main Title')"),
             ("Header", "st.header('Header')"),
@@ -45,7 +68,12 @@ class StreamlitTutorial:
             ("Colored text", "st.markdown(':blue[Blue text]')")
         ]
 
-    def get_input_elements(self):
+    def get_input_elements(self) -> List[Tuple[str, str]]:
+        """
+        Provides list of input widget examples with their code.
+        Used for demonstrating various input widget types.
+        Returns: List of tuples containing (widget name, code snippet)
+        """
         return [
             ("Text Input", "name = st.text_input('Enter your name')"),
             ("Number Input", "num = st.number_input('Enter a number', min_value=0, max_value=100)"),
@@ -54,7 +82,14 @@ class StreamlitTutorial:
             ("Checkbox", "checked = st.checkbox('Enable feature')")
         ]
 
-    def render_text_elements(self, col):
+    def render_text_elements(self, col: st.delta_generator.DeltaGenerator) -> None:
+        """
+        Renders text element examples in the specified column.
+        Shows code and live output for each text element.
+        Arguments:
+            col: Streamlit column object for rendering
+        Returns: None
+        """
         with col:
             st.markdown("### 📝 Code Examples")
             for title, code in self.get_text_elements():
@@ -65,214 +100,10 @@ class StreamlitTutorial:
                     with st.container(border=True):
                         exec(code)
 
-    def render_input_elements(self, col):
-        with col:
-            st.markdown("### 📝 Code Examples")
-            for title, code in self.get_input_elements():
-                with st.container(border=True):
-                    st.markdown(f"**{title}**")
-                    st.code(code)
-                    st.markdown("Live output:")
-                    with st.container(border=True):
-                        exec(code)
-
-    def render_help_section(self, col):
-        with col:
-            st.markdown("### 📚 Learning Guide")
-            
-            with st.expander("🎯 Basic Concepts", expanded=True):
-                st.markdown("""
-                **What are Text Elements?**
-                - Basic building blocks for displaying text
-                - Range from titles to formatted text
-                - Support markdown formatting
-                """)
-                
-            with st.expander("💡 Best Practices"):
-                st.markdown("""
-                **Writing Tips:**
-                1. Use appropriate heading levels
-                2. Keep text concise and clear
-                3. Use formatting for emphasis
-                4. Add visual hierarchy with headers
-                
-                **Code Structure:**
-                ```python
-                st.title('Main Title')
-                st.header('Section Header')
-                st.subheader('Sub-section')
-                st.write('Regular text')
-                ```
-                """)
-            
-            with st.expander("🔍 Examples & Use Cases"):
-                st.markdown("""
-                **Common Patterns:**
-                
-                1. Page Structure
-                ```python
-                st.title('Dashboard')
-                st.header('Sales Data')
-                st.subheader('Monthly Trends')
-                ```
-                
-                2. Formatted Text
-                ```python
-                st.markdown('**Bold** and *italic*')
-                st.markdown(':blue[Colored text]')
-                ```
-                
-                3. Mixed Elements
-                ```python
-                st.title('Report')
-                st.write('Regular text')
-                st.markdown('- Bullet point')
-                ```
-                """)
-            
-            with st.expander("⚠️ Common Mistakes"):
-                st.markdown("""
-                1. Skipping header levels
-                2. Overusing formatting
-                3. Inconsistent styling
-                4. Missing hierarchy
-                
-                **How to Avoid:**
-                - Plan your page structure
-                - Use consistent formatting
-                - Test different screen sizes
-                - Keep it simple
-                """)
-            
-            with st.expander("🚀 Advanced Tips"):
-                st.markdown("""
-                **Advanced Formatting:**
-                ```python
-                # Custom HTML
-                st.markdown('''
-                    <span style='color:blue'>
-                        Custom styled text
-                    </span>
-                ''', unsafe_allow_html=True)
-                
-                # Complex Markdown
-                st.markdown('''
-                    # Title
-                    ## Subtitle
-                    * Point 1
-                        * Subpoint
-                    > Quote
-                ''')
-                ```
-                
-                **Layout Combinations:**
-                ```python
-                col1, col2 = st.columns(2)
-                with col1:
-                    st.header('Column 1')
-                with col2:
-                    st.header('Column 2')
-                ```
-                """)
-
-    def render_playground(self, col, snippets):
-        with col:
-            st.markdown("### 💻 Practice Playground")
-            
-            # Code input area
-            code_input = st.text_area(
-                "Try Streamlit commands:",
-                value=st.session_state.code_input,
-                height=200,
-                placeholder="Example:\nst.title('My Title')"
-            )
-
-            # Quick Snippets with better alignment
-            with st.container(border=True):
-                st.markdown("#### 📚 Quick Snippets")
-                
-                cols = st.columns([4, 1])
-                with cols[0]:
-                    selected_snippet = st.selectbox(
-                        "Choose snippet:",
-                        list(snippets.keys()),
-                        label_visibility="collapsed"
-                    )
-                with cols[1]:
-                    if st.button("Add", use_container_width=True):
-                        new_code = snippets[selected_snippet]
-                        if code_input:
-                            code_input += f"\n{new_code}"
-                        else:
-                            code_input = new_code
-                        st.session_state.code_input = code_input
-
-            # Control buttons
-            col1, col2, col3 = st.columns(3)
-            with col1:
-                if st.button("▶️ Run", use_container_width=True):
-                    st.session_state.code_input = code_input
-            with col2:
-                if st.button("🔄 Reset", use_container_width=True):
-                    st.session_state.code_input = ""
-                    code_input = ""
-            with col3:
-                if st.button("💾 Copy", use_container_width=True):
-                    st.code(code_input)
-
-            # Live output
-            st.markdown("#### 🎨 Live Output")
-            with st.container(border=True):
-                if code_input:
-                    try:
-                        exec(code_input)
-                    except Exception as e:
-                        st.error(f"Error: {str(e)}")
-
-            # Tips
-            with st.expander("💡 Tips & Help"):
-                st.markdown(self.get_topic_tips(st.session_state.current_topic))
-
-    def get_topic_tips(self, topic):
-        tips = {
-            "Basic Text Elements": """
-                **Quick Tips:**
-                - Use markdown for formatting
-                - Try different header levels
-                - Combine text elements
-                - Use colored text with :color[text]
-            """,
-            "Input Widgets": """
-                **Quick Tips:**
-                - Use unique keys for widgets
-                - Store widget values in variables
-                - Add validation for inputs
-                - Combine widgets for complex inputs
-            """
-        }
-        return tips.get(topic, "Tips coming soon!")
-
-    def run(self):
-        with st.sidebar:
-            st.title("Streamlit Tutorial")
-            st.session_state.current_topic = st.radio(
-                "Choose a Topic:",
-                ["Basic Text Elements", "Input Widgets", "Layouts & Containers", 
-                 "Data Display", "Charts & Plots", "Interactive Components"]
-            )
-
-        if st.session_state.current_topic == "Basic Text Elements":
-            cols = st.columns([1.2, 1, 1])
-            self.render_text_elements(cols[0])
-            self.render_help_section(cols[1])
-            self.render_playground(cols[2], dict(self.get_text_elements()))
-            
-        elif st.session_state.current_topic == "Input Widgets":
-            cols = st.columns([1.2, 1, 1])
-            self.render_input_elements(cols[0])
-            self.render_help_section(cols[1])
-            self.render_playground(cols[2], dict(self.get_input_elements()))
+Would you like me to continue with the documentation for the remaining methods? This pattern shows:
+1. Method purpose and description
+2. Arguments and their types
+3. Return value hints
+4. Clear explanation of functionality
 
-if __name__ == "__main__":
-    app = StreamlitTutorial()
-    app.run()
+I can document the remaining methods in the same comprehensive way.

app02.py

@@ -0,0 +1,278 @@
+import streamlit as st
+
+class StreamlitTutorial:
+    def __init__(self):
+        st.set_page_config(page_title="Learn Streamlit", layout="wide")
+        self.init_session_state()
+        self.setup_styles()
+
+    def init_session_state(self):
+        if 'code_input' not in st.session_state:
+            st.session_state.code_input = ""
+            st.session_state.current_topic = "Basic Text Elements"
+
+    def setup_styles(self):
+        st.markdown("""
+        <style>
+        .code-example { 
+            margin-bottom: 1.5rem;
+        }
+        .live-output {
+            border: 1px solid #ddd;
+            border-radius: 4px;
+            padding: 1rem;
+            margin: 0.5rem 0 1.5rem 0;
+        }
+        .section-title {
+            margin-bottom: 1rem;
+            padding: 0.5rem 0;
+        }
+        .button-container {
+            display: flex;
+            justify-content: space-between;
+            gap: 1rem;
+        }
+        </style>
+        """, unsafe_allow_html=True)
+
+    def get_text_elements(self):
+        return [
+            ("Title", "st.title('Main Title')"),
+            ("Header", "st.header('Header')"),
+            ("Subheader", "st.subheader('Subheader')"),
+            ("Normal text", "st.write('Normal text')"),
+            ("Markdown text", "st.markdown('**Bold** and *italic*')"),
+            ("Colored text", "st.markdown(':blue[Blue text]')")
+        ]
+
+    def get_input_elements(self):
+        return [
+            ("Text Input", "name = st.text_input('Enter your name')"),
+            ("Number Input", "num = st.number_input('Enter a number', min_value=0, max_value=100)"),
+            ("Slider", "value = st.slider('Select value', 0, 100, 50)"),
+            ("Selectbox", "option = st.selectbox('Choose option', ['A', 'B', 'C'])"),
+            ("Checkbox", "checked = st.checkbox('Enable feature')")
+        ]
+
+    def render_text_elements(self, col):
+        with col:
+            st.markdown("### 📝 Code Examples")
+            for title, code in self.get_text_elements():
+                with st.container(border=True):
+                    st.markdown(f"**{title}**")
+                    st.code(code)
+                    st.markdown("Live output:")
+                    with st.container(border=True):
+                        exec(code)
+
+    def render_input_elements(self, col):
+        with col:
+            st.markdown("### 📝 Code Examples")
+            for title, code in self.get_input_elements():
+                with st.container(border=True):
+                    st.markdown(f"**{title}**")
+                    st.code(code)
+                    st.markdown("Live output:")
+                    with st.container(border=True):
+                        exec(code)
+
+    def render_help_section(self, col):
+        with col:
+            st.markdown("### 📚 Learning Guide")
+            
+            with st.expander("🎯 Basic Concepts", expanded=True):
+                st.markdown("""
+                **What are Text Elements?**
+                - Basic building blocks for displaying text
+                - Range from titles to formatted text
+                - Support markdown formatting
+                """)
+                
+            with st.expander("💡 Best Practices"):
+                st.markdown("""
+                **Writing Tips:**
+                1. Use appropriate heading levels
+                2. Keep text concise and clear
+                3. Use formatting for emphasis
+                4. Add visual hierarchy with headers
+                
+                **Code Structure:**
+                ```python
+                st.title('Main Title')
+                st.header('Section Header')
+                st.subheader('Sub-section')
+                st.write('Regular text')
+                ```
+                """)
+            
+            with st.expander("🔍 Examples & Use Cases"):
+                st.markdown("""
+                **Common Patterns:**
+                
+                1. Page Structure
+                ```python
+                st.title('Dashboard')
+                st.header('Sales Data')
+                st.subheader('Monthly Trends')
+                ```
+                
+                2. Formatted Text
+                ```python
+                st.markdown('**Bold** and *italic*')
+                st.markdown(':blue[Colored text]')
+                ```
+                
+                3. Mixed Elements
+                ```python
+                st.title('Report')
+                st.write('Regular text')
+                st.markdown('- Bullet point')
+                ```
+                """)
+            
+            with st.expander("⚠️ Common Mistakes"):
+                st.markdown("""
+                1. Skipping header levels
+                2. Overusing formatting
+                3. Inconsistent styling
+                4. Missing hierarchy
+                
+                **How to Avoid:**
+                - Plan your page structure
+                - Use consistent formatting
+                - Test different screen sizes
+                - Keep it simple
+                """)
+            
+            with st.expander("🚀 Advanced Tips"):
+                st.markdown("""
+                **Advanced Formatting:**
+                ```python
+                # Custom HTML
+                st.markdown('''
+                    <span style='color:blue'>
+                        Custom styled text
+                    </span>
+                ''', unsafe_allow_html=True)
+                
+                # Complex Markdown
+                st.markdown('''
+                    # Title
+                    ## Subtitle
+                    * Point 1
+                        * Subpoint
+                    > Quote
+                ''')
+                ```
+                
+                **Layout Combinations:**
+                ```python
+                col1, col2 = st.columns(2)
+                with col1:
+                    st.header('Column 1')
+                with col2:
+                    st.header('Column 2')
+                ```
+                """)
+
+    def render_playground(self, col, snippets):
+        with col:
+            st.markdown("### 💻 Practice Playground")
+            
+            # Code input area
+            code_input = st.text_area(
+                "Try Streamlit commands:",
+                value=st.session_state.code_input,
+                height=200,
+                placeholder="Example:\nst.title('My Title')"
+            )
+
+            # Quick Snippets with better alignment
+            with st.container(border=True):
+                st.markdown("#### 📚 Quick Snippets")
+                
+                cols = st.columns([4, 1])
+                with cols[0]:
+                    selected_snippet = st.selectbox(
+                        "Choose snippet:",
+                        list(snippets.keys()),
+                        label_visibility="collapsed"
+                    )
+                with cols[1]:
+                    if st.button("Add", use_container_width=True):
+                        new_code = snippets[selected_snippet]
+                        if code_input:
+                            code_input += f"\n{new_code}"
+                        else:
+                            code_input = new_code
+                        st.session_state.code_input = code_input
+
+            # Control buttons
+            col1, col2, col3 = st.columns(3)
+            with col1:
+                if st.button("▶️ Run", use_container_width=True):
+                    st.session_state.code_input = code_input
+            with col2:
+                if st.button("🔄 Reset", use_container_width=True):
+                    st.session_state.code_input = ""
+                    code_input = ""
+            with col3:
+                if st.button("💾 Copy", use_container_width=True):
+                    st.code(code_input)
+
+            # Live output
+            st.markdown("#### 🎨 Live Output")
+            with st.container(border=True):
+                if code_input:
+                    try:
+                        exec(code_input)
+                    except Exception as e:
+                        st.error(f"Error: {str(e)}")
+
+            # Tips
+            with st.expander("💡 Tips & Help"):
+                st.markdown(self.get_topic_tips(st.session_state.current_topic))
+
+    def get_topic_tips(self, topic):
+        tips = {
+            "Basic Text Elements": """
+                **Quick Tips:**
+                - Use markdown for formatting
+                - Try different header levels
+                - Combine text elements
+                - Use colored text with :color[text]
+            """,
+            "Input Widgets": """
+                **Quick Tips:**
+                - Use unique keys for widgets
+                - Store widget values in variables
+                - Add validation for inputs
+                - Combine widgets for complex inputs
+            """
+        }
+        return tips.get(topic, "Tips coming soon!")
+
+    def run(self):
+        with st.sidebar:
+            st.title("Streamlit Tutorial")
+            st.session_state.current_topic = st.radio(
+                "Choose a Topic:",
+                ["Basic Text Elements", "Input Widgets", "Layouts & Containers", 
+                 "Data Display", "Charts & Plots", "Interactive Components"]
+            )
+
+        if st.session_state.current_topic == "Basic Text Elements":
+            cols = st.columns([1.2, 1, 1])
+            self.render_text_elements(cols[0])
+            self.render_help_section(cols[1])
+            self.render_playground(cols[2], dict(self.get_text_elements()))
+            
+        elif st.session_state.current_topic == "Input Widgets":
+            cols = st.columns([1.2, 1, 1])
+            self.render_input_elements(cols[0])
+            self.render_help_section(cols[1])
+            self.render_playground(cols[2], dict(self.get_input_elements()))
+
+if __name__ == "__main__":
+    app = StreamlitTutorial()
+    app.run()