@startuml
!theme plain
skinparam backgroundColor #FFFFFF
skinparam shadowing false

title SmartTools Registry Frontend Architecture

rectangle "Frontend Layer" {
  rectangle "Web UI (Flask + Jinja)" as web {
    rectangle "Responsive Design" as responsive
    rectangle "Progressive Enhancement" as progressive
    rectangle "WCAG 2.1 AA" as accessibility
    rectangle "SEO Optimized" as seo
  }

  rectangle "TUI (urwid/python-newt)" as tui {
    rectangle "Virtual Scrolling" as virtual
    rectangle "Keyboard Navigation" as keyboard
    rectangle "Search Interface" as search
    rectangle "Progress Indicators" as progress
  }

  rectangle "CLI Interface" as cli {
    rectangle "--dry-run Validation" as dryrun
    rectangle "Progress Feedback" as cli_progress
    rectangle "Error Handling" as cli_error
    rectangle "Offline Support" as offline
  }
}

rectangle "Performance Layer" {
  rectangle "Client Caching" as client_cache
  rectangle "ETag Support" as etag
  rectangle "Async Stats" as async_stats
  rectangle "Bundle Optimization" as bundle
}

rectangle "User Experience Layer" {
  rectangle "Loading States" as loading
  rectangle "Error Boundaries" as error_bounds
  rectangle "Graceful Degradation" as graceful
  rectangle "Screen Reader Support" as screen_reader
}

web --> responsive
web --> progressive
web --> accessibility
web --> seo

tui --> virtual
tui --> keyboard
tui --> search
tui --> progress

cli --> dryrun
cli --> cli_progress
cli --> cli_error
cli --> offline

responsive --> client_cache
progressive --> etag
keyboard --> loading
cli_progress --> async_stats
accessibility --> screen_reader

client_cache --> bundle
etag --> graceful
async_stats --> error_bounds
loading --> screen_reader

@enduml