flashstudio 0.1.0__py3-none-any.whl

flashstudio/__init__.py

@@ -0,0 +1,5 @@
+"""FlashStudio — Interactive Training & Inference UI for FlashDet."""
+
+__version__ = "0.1.0"
+
+from flashstudio.launcher import launch  # noqa: F401

flashstudio/app.py

@@ -0,0 +1,64 @@
+"""FlashStudio — Main Streamlit Application."""
+
+import streamlit as st
+
+st.set_page_config(
+    page_title="FlashStudio",
+    page_icon="⚡",
+    layout="wide",
+    initial_sidebar_state="expanded",
+)
+
+from flashstudio.components.styles import inject_custom_css  # noqa: E402
+from flashstudio.components.sidebar import render_sidebar  # noqa: E402
+from flashstudio.components.wizard import render_step_indicator, render_navigation  # noqa: E402
+from flashstudio.pages.dashboard import render_dashboard  # noqa: E402
+from flashstudio.pages.data import render_data_page  # noqa: E402
+from flashstudio.pages.model import render_model_page  # noqa: E402
+from flashstudio.pages.training import render_training_page  # noqa: E402
+from flashstudio.pages.export import render_export_page  # noqa: E402
+from flashstudio.pages.inference import render_inference_page  # noqa: E402
+
+STEPS = [
+    {"id": "dashboard", "label": "Dashboard", "icon": "🏠"},
+    {"id": "data", "label": "Data", "icon": "📦"},
+    {"id": "model", "label": "Model", "icon": "🧠"},
+    {"id": "training", "label": "Training", "icon": "🏋️"},
+    {"id": "export", "label": "Export", "icon": "📤"},
+    {"id": "inference", "label": "Inference", "icon": "🔍"},
+]
+
+PAGE_RENDERERS = {
+    "dashboard": render_dashboard,
+    "data": render_data_page,
+    "model": render_model_page,
+    "training": render_training_page,
+    "export": render_export_page,
+    "inference": render_inference_page,
+}
+
+
+def main():
+    import traceback as _tb
+
+    inject_custom_css()
+
+    if "current_step" not in st.session_state:
+        st.session_state["current_step"] = 0
+
+    render_sidebar()
+    render_step_indicator(STEPS, st.session_state["current_step"])
+
+    current = STEPS[st.session_state["current_step"]]
+
+    try:
+        PAGE_RENDERERS[current["id"]]()
+    except Exception as _e:
+        st.error(f"Error: {_e}")
+        st.code(_tb.format_exc())
+
+    render_navigation(STEPS, st.session_state["current_step"])
+
+
+if __name__ == "__main__":
+    main()

flashstudio/cli.py

@@ -0,0 +1,18 @@
+"""FlashStudio CLI entrypoint."""
+
+import argparse
+
+
+def main():
+    parser = argparse.ArgumentParser(description="FlashStudio — Training & Inference UI for FlashDet")
+    parser.add_argument("--port", type=int, default=8501, help="Port to serve on")
+    parser.add_argument("--no-share", action="store_true", help="Disable ngrok sharing in Colab")
+    parser.add_argument("--ngrok-token", type=str, default=None, help="ngrok auth token")
+    args = parser.parse_args()
+
+    from flashstudio.launcher import launch
+    launch(port=args.port, share=not args.no_share, ngrok_token=args.ngrok_token)
+
+
+if __name__ == "__main__":
+    main()

flashstudio/components/sidebar.py

@@ -0,0 +1,45 @@
+"""FlashStudio sidebar — compact, working navigation."""
+
+import streamlit as st
+from flashstudio.utils.device import get_gpu_info, get_colab_runtime_type
+
+PAGES = ["🏠 Dashboard", "📦 Data", "🧠 Model", "🏋️ Training", "📤 Export", "🔍 Inference"]
+
+
+def render_sidebar():
+    """Render sidebar with reliable button navigation."""
+    with st.sidebar:
+        # Logo
+        st.markdown(
+            "<div style='text-align:center; padding:0.5rem 0;'>"
+            "<span style='font-size:1.6rem;'>⚡</span> "
+            "<b style='font-size:1.1rem;'>FlashStudio</b>"
+            "</div>",
+            unsafe_allow_html=True,
+        )
+
+        st.divider()
+
+        # Navigation buttons
+        current = st.session_state.get("current_step", 0)
+        for i, page in enumerate(PAGES):
+            btn_type = "primary" if i == current else "secondary"
+            if st.button(page, key=f"sb_{i}", type=btn_type, use_container_width=True):
+                st.session_state["current_step"] = i
+                st.rerun()
+
+        st.divider()
+
+        # Compact status
+        st.caption(f"Model: {st.session_state.get('model_arch', 'FlashDet-Nano')}")
+        st.caption(f"Dataset: {st.session_state.get('dataset_name', '—')}")
+        st.caption(f"Status: {st.session_state.get('training_status', 'Not started')}")
+
+        st.divider()
+
+        # Environment
+        gpu = get_gpu_info()
+        if gpu["available"]:
+            st.caption(f"🖥️ {gpu['name']}")
+        else:
+            st.caption("💻 CPU Mode")

flashstudio/components/styles.py

@@ -0,0 +1,273 @@
+"""FlashStudio — Custom CSS Styles matching the professional mockup (light theme)."""
+
+import streamlit as st
+
+
+def inject_custom_css():
+    """Inject custom CSS to match the professional mockup design — light theme, dark sidebar."""
+    st.markdown("""
+    <style>
+    /* ═══════ Global ═══════ */
+    @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
+
+    .stApp {
+        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+    }
+
+    /* ═══════ Sidebar ═══════ */
+    section[data-testid="stSidebar"] {
+        background: #FAFBFC !important;
+        border-right: 1px solid #E8E8EF;
+        width: 240px !important;
+    }
+
+    section[data-testid="stSidebar"] > div {
+        width: 240px !important;
+        padding: 1rem 0.8rem !important;
+    }
+
+    section[data-testid="stSidebar"] hr {
+        border-color: #E8E8EF !important;
+        margin: 0.4rem 0 !important;
+    }
+
+    section[data-testid="stSidebar"] .stButton > button {
+        font-size: 0.82rem !important;
+        padding: 0.4rem 0.7rem !important;
+        border-radius: 6px !important;
+        text-align: left !important;
+        justify-content: flex-start !important;
+        min-height: 0 !important;
+        height: auto !important;
+    }
+
+    section[data-testid="stSidebar"] .stButton > button[kind="secondary"] {
+        background: transparent !important;
+        border: none !important;
+        color: #374151 !important;
+    }
+
+    section[data-testid="stSidebar"] .stButton > button[kind="secondary"]:hover {
+        background: #F5F3FF !important;
+        color: #7C3AED !important;
+    }
+
+    section[data-testid="stSidebar"] .stButton > button[kind="primary"] {
+        background: #F5F3FF !important;
+        border: 1px solid #EDE9FE !important;
+        color: #7C3AED !important;
+        font-weight: 600 !important;
+    }
+
+    /* Hide Streamlit's auto multipage nav */
+    [data-testid="stSidebarNav"] {
+        display: none !important;
+    }
+
+    /* ═══════ Main Content ═══════ */
+    .stApp > header {
+        background: transparent;
+    }
+
+    /* ═══════ Metric Cards ═══════ */
+    div[data-testid="stMetric"] {
+        background: #FFFFFF;
+        border: 1px solid #E8E8EF;
+        border-radius: 12px;
+        padding: 1rem 1.2rem;
+        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
+        transition: transform 0.2s, box-shadow 0.2s;
+    }
+
+    div[data-testid="stMetric"]:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 4px 12px rgba(124, 58, 237, 0.08);
+    }
+
+    div[data-testid="stMetric"] label {
+        font-size: 0.75rem !important;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
+        color: #6B7280 !important;
+        font-weight: 500;
+    }
+
+    div[data-testid="stMetric"] div[data-testid="stMetricValue"] {
+        font-size: 1.6rem !important;
+        font-weight: 700;
+        color: #1A1A2E !important;
+    }
+
+    /* ═══════ Primary Buttons ═══════ */
+    .main .stButton > button[kind="primary"] {
+        background: #7C3AED !important;
+        border: none;
+        border-radius: 8px;
+        font-weight: 600;
+        color: #FFFFFF !important;
+        letter-spacing: 0.02em;
+        transition: all 0.2s;
+    }
+
+    .main .stButton > button[kind="primary"]:hover {
+        background: #6D28D9 !important;
+        box-shadow: 0 4px 15px rgba(124, 58, 237, 0.3);
+        transform: translateY(-1px);
+    }
+
+    .main .stButton > button[kind="secondary"] {
+        border-radius: 8px;
+        border: 1px solid #E8E8EF !important;
+        font-weight: 500;
+        color: #1A1A2E !important;
+    }
+
+    .main .stButton > button[kind="secondary"]:hover {
+        border-color: #7C3AED !important;
+        color: #7C3AED !important;
+    }
+
+    /* ═══════ Containers / Cards ═══════ */
+    div[data-testid="stVerticalBlockBorderWrapper"] {
+        border-radius: 12px !important;
+        border-color: #E8E8EF !important;
+        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
+    }
+
+    /* ═══════ Step Indicator ═══════ */
+    .step-indicator {
+        display: flex;
+        justify-content: center;
+        gap: 0.3rem;
+        padding: 0.5rem 0.5rem;
+        margin-bottom: 1rem;
+        background: #FAFAFA;
+        border-radius: 8px;
+        border: 1px solid #F0F0F5;
+    }
+
+    .step-item {
+        text-align: center;
+        flex: 1;
+        position: relative;
+    }
+
+    .step-icon { font-size: 1.3rem; display: block; }
+    .step-label { font-size: 0.7rem; margin-top: 0.2rem; font-weight: 500; color: #6B7280; }
+    .step-bar { height: 3px; border-radius: 2px; margin-top: 0.4rem; }
+
+    .step-active .step-label { color: #7C3AED; font-weight: 700; }
+    .step-active .step-bar { background: #7C3AED; }
+    .step-done .step-bar { background: #10B981; }
+    .step-pending .step-bar { background: #E5E7EB; }
+    .step-pending .step-label { opacity: 0.5; }
+
+    /* ═══════ Progress Bar ═══════ */
+    .stProgress > div > div {
+        background: linear-gradient(90deg, #7C3AED, #A78BFA) !important;
+        border-radius: 4px;
+    }
+
+    /* ═══════ Tabs ═══════ */
+    .stTabs [data-baseweb="tab-list"] {
+        gap: 2rem;
+        border-bottom: 2px solid #F0F0F5;
+    }
+
+    .stTabs [data-baseweb="tab"] {
+        font-weight: 500;
+        color: #6B7280;
+    }
+
+    .stTabs [aria-selected="true"] {
+        color: #7C3AED !important;
+        font-weight: 600;
+    }
+
+    /* ═══════ Info Bar (bottom) ═══════ */
+    .info-bar {
+        background: #F5F3FF;
+        border: 1px solid #EDE9FE;
+        border-radius: 8px;
+        padding: 0.6rem 1.2rem;
+        text-align: center;
+        font-size: 0.8rem;
+        margin-top: 1.5rem;
+        color: #4C1D95;
+    }
+
+    .info-bar b {
+        color: #1A1A2E;
+    }
+
+    /* ═══════ File Uploader ═══════ */
+    [data-testid="stFileUploader"] section {
+        border-radius: 12px;
+        border: 2px dashed #D4D4D8 !important;
+        transition: border-color 0.2s;
+    }
+
+    [data-testid="stFileUploader"] section:hover {
+        border-color: #7C3AED !important;
+    }
+
+    /* ═══════ Sliders ═══════ */
+    .stSlider > div > div > div > div {
+        background: #7C3AED !important;
+    }
+
+    /* ═══════ Selectbox ═══════ */
+    .main .stSelectbox > div > div {
+        border-radius: 8px;
+        border-color: #E8E8EF;
+    }
+
+    /* ═══════ Dataframe ═══════ */
+    .stDataFrame {
+        border-radius: 8px;
+        overflow: hidden;
+        border: 1px solid #E8E8EF;
+    }
+
+    /* ═══════ Expander ═══════ */
+    .streamlit-expanderHeader {
+        font-weight: 600;
+        color: #1A1A2E;
+    }
+
+    /* ═══════ Download Buttons ═══════ */
+    .stDownloadButton > button[kind="primary"] {
+        background: #7C3AED !important;
+        color: white !important;
+        border-radius: 8px;
+    }
+
+    .stDownloadButton > button {
+        border-radius: 8px;
+        border: 1px solid #E8E8EF;
+    }
+    </style>
+    """, unsafe_allow_html=True)
+
+
+def render_info_bar(items: dict):
+    """Render a professional info bar at the bottom (like mockup)."""
+    inner = "  •  ".join(f"{k}: <b>{v}</b>" for k, v in items.items())
+    st.markdown(
+        f'<div class="info-bar">ℹ️ {inner}</div>',
+        unsafe_allow_html=True,
+    )
+
+
+def render_page_header(icon: str, title: str, subtitle: str):
+    """Render a professional page header with icon and subtitle."""
+    st.markdown(
+        f"""<div style="margin-bottom: 1.5rem;">
+            <h1 style="margin:0; display:flex; align-items:center; gap:0.6rem;
+                font-size:1.8rem; font-weight:700; color:#1A1A2E;">
+                <span style="font-size:2rem;">{icon}</span> {title}
+            </h1>
+            <p style="margin:0.4rem 0 0; color:#6B7280; font-size:0.95rem;">{subtitle}</p>
+        </div>""",
+        unsafe_allow_html=True,
+    )

flashstudio/components/wizard.py

@@ -0,0 +1,46 @@
+"""Step indicator and navigation wizard component."""
+
+import streamlit as st
+
+
+def render_step_indicator(steps: list, current_step: int):
+    """Render horizontal step progress indicator."""
+    items_html = ""
+    for i, step in enumerate(steps):
+        if i < current_step:
+            state_class = "step-done"
+            icon = "✅"
+        elif i == current_step:
+            state_class = "step-active"
+            icon = step["icon"]
+        else:
+            state_class = "step-pending"
+            icon = step["icon"]
+
+        items_html += f"""
+        <div class="step-item {state_class}">
+            <span class="step-icon">{icon}</span>
+            <div class="step-label">{step['label']}</div>
+            <div class="step-bar"></div>
+        </div>"""
+
+    st.markdown(f'<div class="step-indicator">{items_html}</div>', unsafe_allow_html=True)
+
+
+def render_navigation(steps: list, current_step: int):
+    """Render back/next navigation buttons."""
+    col_back, col_spacer, col_next = st.columns([1, 3, 1])
+
+    with col_back:
+        if current_step > 0:
+            prev_label = f"← {steps[current_step - 1]['label']}"
+            if st.button(prev_label, key="wizard_back", use_container_width=True):
+                st.session_state["current_step"] = current_step - 1
+                st.rerun()
+
+    with col_next:
+        if current_step < len(steps) - 1:
+            next_label = f"{steps[current_step + 1]['label']} →"
+            if st.button(next_label, key="wizard_next", use_container_width=True, type="primary"):
+                st.session_state["current_step"] = current_step + 1
+                st.rerun()

flashstudio/launcher.py

@@ -0,0 +1,73 @@
+"""Launch FlashStudio UI — works locally and inside Google Colab."""
+
+import subprocess
+import sys
+import os
+from pathlib import Path
+
+
+def _is_colab() -> bool:
+    try:
+        import google.colab  # noqa: F401
+        return True
+    except ImportError:
+        return False
+
+
+def _get_app_path() -> str:
+    return str(Path(__file__).parent / "app.py")
+
+
+def launch(port: int = 8501, share: bool = True, ngrok_token: str | None = None):
+    """Launch FlashStudio Streamlit app.
+
+    Args:
+        port: Port to run the Streamlit server on.
+        share: If True and running in Colab, creates a public ngrok tunnel.
+        ngrok_token: Optional ngrok auth token. If not provided, uses NGROK_TOKEN env var.
+    """
+    app_path = _get_app_path()
+
+    if _is_colab():
+        _launch_colab(app_path, port, share, ngrok_token)
+    else:
+        _launch_local(app_path, port)
+
+
+def _launch_colab(app_path: str, port: int, share: bool, ngrok_token: str | None):
+    """Launch in Google Colab with ngrok tunnel."""
+    from pyngrok import ngrok, conf
+
+    token = ngrok_token or os.environ.get("NGROK_TOKEN", "")
+    if token:
+        conf.get_default().auth_token = token
+
+    proc = subprocess.Popen(
+        [sys.executable, "-m", "streamlit", "run", app_path,
+         "--server.port", str(port),
+         "--server.headless", "true",
+         "--server.enableCORS", "false",
+         "--server.enableXsrfProtection", "false"],
+        stdout=subprocess.PIPE,
+        stderr=subprocess.PIPE,
+    )
+
+    if share:
+        public_url = ngrok.connect(port, "http")
+        print(f"\n{'=' * 60}")
+        print("  FlashStudio is running!")
+        print(f"  Local:  http://localhost:{port}")
+        print(f"  Public: {public_url}")
+        print(f"{'=' * 60}\n")
+    else:
+        print(f"\n  FlashStudio running at http://localhost:{port}\n")
+
+    return proc
+
+
+def _launch_local(app_path: str, port: int):
+    """Launch locally with streamlit."""
+    subprocess.run(
+        [sys.executable, "-m", "streamlit", "run", app_path,
+         "--server.port", str(port)],
+    )