Focus Mode
An atmospheric focus-mode interaction that isolates selected cards or sections by smoothly dimming surrounding distractions with zero layout shift, tactile spring scaling, and Escape key dismissal.
Financials
Monthly Recurring Revenue
$148,290
+18.4% vs last month
Gross expansion revenue driven by 42 net-new enterprise team conversions this cycle.
Infrastructure
Edge API Throughput
42.8M req/s
99.998% uptime
Global Anycast network serving p99 latencies under 14ms across all regions.
Cache Hit96.4%
P99 TTFB12.1ms
Adoption
Active Developers
18,450
+2,100 this week
Weekly active engineers utilizing CLI component scaffolding across 140+ countries.
892 live deployment pipelines
Installation
Add the component directly to your repository using shadcn CLI:
npx shadcn@latest add Surajmaurya1/easyui/focus-mode
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| items | FocusModeItem[] | [...] | List of dashboard cards or sections |
| focusedId | string | null | null | Controlled focused card ID |
| onFocusChange | (id: string | null) => void | undefined | Callback fired when focused element changes |
| dimOpacity | number | 0.2 | Opacity applied to unfocused background cards |