Untitled

# FocusFlow Dashboard Configuration (YAML Representation)
# Based on Screen: {{DATA:SCREEN:SCREEN_4}}
# Design System: {{DATA:DESIGN_SYSTEM:DESIGN_SYSTEM_1}}

app_metadata:
  name: FocusFlow
  platform: Mobile
  theme_mode: LIGHT
  design_pattern: Shadcn UI / Zinc Monolith

layout_tokens:
  container:
    padding_x: 24px
    padding_y: 16px
    background_color: "#f9f9f9"
  typography:
    primary_font: "Inter"
    base_color: "#09090b"
  spacing:
    section_gap: 32px
    card_gap: 12px

components:
  - id: top_app_bar
    type: navigation
    properties:
      leading: avatar
      title: "FocusFlow"
      trailing: icon (settings)
      background: "blur(20px) rgba(249, 249, 249, 0.8)"

  - id: greeting_section
    type: header
    properties:
      headline: "Good Morning"
      subheadline: "Tuesday, October 24"
      margin_bottom: 24px

  - id: focus_card
    type: summary_widget
    properties:
      title: "Today's Focus"
      metric: "85% Complete"
      subtext: "12 of 14 tasks finished"
      visualization: progress_ring
      colors:
        primary: "#2d3435"
        track: "#e4e1e6"

  - id: stats_grid
    type: columns
    count: 2
    items:
      - title: "STREAK"
        value: "14 Days"
        icon: fire
      - title: "VELOCITY"
        value: "+12%"
        icon: chart_line

  - id: priorities_list
    type: list
    label: "NEXT PRIORITIES"
    items:
      - title: "Quarterly Review Presentation"
        priority: HIGH
        due: "2:00 PM"
        status: incomplete
      - title: "Update Design System Tokens"
        priority: MEDIUM
        due: "4:30 PM"
        status: incomplete

  - id: bottom_nav_bar
    type: navigation
    properties:
      items: ["Home", "Tasks", "Analytics", "Profile"]
      active_index: 0
      background: "#ffffff"
      shape: rounded_top_3xl