RetroWindow
A window container with Mac OS 9 chrome, title bar with stripes, control boxes, window shade, resizable size box, footer slot and title-bar dragging.
Installation
npx shadcn@latest add "https://nostalgia-ui.com/r/retro-window.json"
Setup: installing any component also installs nostalgia-theme (the --os9-* tokens and os9-* utilities) via registryDependencies. To add the theme on its own: npx shadcn@latest add https://nostalgia-ui.com/r/nostalgia-theme.json
Import
import { RetroWindow } from "@/components/ui/retro-window"Active Window
22 items, 4.5 GB available
Inactive / Background Window
14 items, 2.1 GB available
Active vs Inactive
This window is in the foreground and has full chrome with striped title bar regions.
This window is in the background. The title bar has no stripes and control boxes are hidden.
Window Shade
Click the collapse box (far right) or double-click the title bar to roll the window up to just its title bar. Controlled via collapsed / onCollapsedChange, or uncontrolled with defaultCollapsed.
31 items, 4.5 GB available
State: expanded
Resizable with Footer
Drag the size box in the bottom-right corner. The footer slot holds placards or a horizontal scrollbar and sits beside the size box.
Draggable
Drag the title bar to move the window. Position is applied as a translate transform.
Offset: 24, 24
Click close, collapse, or zoom boxes on the active windows to test handlers.