Streamlit App Builder Skill

Description

Expert skill for building production-ready Streamlit applications with focus on regulatory designation analysis systems. Specializes in creating intake forms, results displays, data export functionality, and comprehensive UI/UX patterns aligned with PRD requirements.

Core Capabilities

• F1: Intake Form Development - Build validated forms with required field checking, dropdown menus, multi-select options, and MedDRA code lookup
• F10: Output Display & Export - Create professional results displays with confidence scoring, collapsible sections, clickable citations, and Word/PDF export
• Session State Management - Handle complex user flows with persistent state across reruns
• Data Validation - Implement client-side validation with user-friendly error messages
• Export Functionality - Generate formatted Word documents with python-docx preserving tables, headings, and citations
• Progress Indicators - Display loading states and progress tracking for long-running operations
• Professional UI/UX - Apply best practices for layout, color coding, responsive design, and accessibility

When to Use This Skill

• Building regulatory designation analysis interfaces
• Creating multi-step data collection forms with validation
• Displaying complex analysis results with confidence scores
• Implementing export functionality for reports
• Developing scientific/medical data entry applications
• Building dashboards with collapsible sections and interactive elements

Technical Stack

• Streamlit 1.28+
• python-docx for Word export
• pandas for data manipulation
• reportlab for PDF generation
• st-aggrid for advanced table features
• Session state for flow management

PRD Feature Alignment

F1: Intake Form (Priority: P0)

Acceptance Criteria Met:

• Form displays in Streamlit interface with st.form
• All required input fields implemented:
  • Product name (st.text_input)
  • Product type (st.selectbox with 3 options)
  • Active substance (st.text_input)
  • Indication (st.text_input with MedDRA autocomplete)
  • Route of administration (st.selectbox)
  • Development stage (st.selectbox)
  • Target phase (st.selectbox)
  • Target regions (st.multiselect for US FDA, EU EMA)
  • Known designations (st.text_area, optional)
• Validation prevents submission with missing required data
• Submit button triggers analysis generation with st.form_submit_button

F10: Output Display & Export (Priority: P0)

Acceptance Criteria Met:

• All 6 sections display correctly using st.expander:
  • Executive Summary
  • Designations Table (st.dataframe with sorting)
  • Eligibility Analysis
  • Dynamic Insights
  • Confidence Scores (color-coded badges)
  • References (clickable st.markdown links)
• Confidence scores color-coded:
  • Green badge (≥0.9)
  • Yellow badge (0.8-0.89)
  • Red badge (<0.8)
• Citations clickable with URL validation
• Word export with python-docx preserves all formatting
• Export optimized for <10 second completion

Key Scripts

• build_streamlit_ui.py - Main UI orchestration and page layout builder
• export_to_word.py - Word document generation with formatting preservation
• export_to_pdf.py - PDF export with professional styling

Templates Provided

• streamlit_app_template.py - Full application template with session state
• intake_form.py - Validated intake form for F1 requirements
• results_display.py - Results display with confidence scoring for F10
• word_export_template.py - Word export functionality
• streamlit_tests.py - Integration test suite

Best Practices

• Use st.form for all data collection to batch inputs
• Implement st.session_state for persistence across reruns
• Add st.spinner for long operations (>2 seconds)
• Use st.expander for collapsible sections
• Validate all inputs before processing
• Provide clear error messages with st.error
• Use st.cache_data for expensive computations
• Implement proper exception handling
• Add progress indicators for operations >30 seconds
• Follow accessibility guidelines (ARIA labels, keyboard navigation)

Common Patterns

1. Required Field Validation: Check all required fields before form submission
2. Confidence Badge Rendering: HTML badges with color coding based on score thresholds
3. Session State Flow: Initialize → Collect → Validate → Process → Display → Export
4. Export Formatting: Preserve headings, tables, citations, and metadata in Word docs
5. Error Recovery: Graceful degradation with user-friendly messages

Example Usage

Quick Start: Simple Data Collection Form

import streamlit as st

st.title("Data Collection App")

with st.form("data_form"):
    name = st.text_input("Name", key="name")
    email = st.text_input("Email", key="email")
    category = st.selectbox("Category", ["Option A", "Option B", "Option C"])
    description = st.text_area("Description")

    submitted = st.form_submit_button("Submit")

    if submitted:
        if not name or not email:
            st.error("Name and email are required")
        else:
            st.success(f"Data submitted for {name}")
            # Process data here

Example: Results Display with Export

# Display results with collapsible sections
with st.expander("Analysis Results", expanded=True):
    st.metric("Confidence Score", "85%", delta="High")
    st.dataframe(results_df)

# Export to Word
if st.button("Export to Word"):
    from docx import Document
    doc = Document()
    doc.add_heading("Analysis Report", 0)
    doc.add_paragraph(f"Generated: {datetime.now()}")
    # Add more content
    doc.save("report.docx")
    st.download_button("Download Report", data=open("report.docx", "rb"), file_name="report.docx")

References

• patterns.md - Reusable Streamlit design patterns
• best_practices.md - Performance optimization and UX guidelines
• advanced_topics.md - Complex state management and custom components
• troubleshooting.md - Common issues and solutions

Version

1.0.0 - Initial release for Streamlit application development

Author

Claude Code - Specialized for regulatory designation analysis systems