# Workspace

Open `index.html`. Choose a project, add a task and mark it complete. The projects and people are fictional; your edits save locally. No build step or external dependency is needed.

## Try it

- Switch between **List** and **Board**, then filter projects or tasks. **Project progress** opens a summary of the visible projects.
- Choose **Open** tasks and complete one. If its row disappears while focused, focus moves to the Open filter.
- Open **Commands** with the button or Command+K / Control+K. Search for `review`, `archive` or `theme` and run an action.
- Export your workspace, make another edit, then import the file. Preview it before replacing anything; **Undo import** restores the preceding workspace.

## Keyboard behavior

The command dialog focuses search. Arrow keys move through results; Enter in search runs the first match. Tab and Shift+Tab navigate its buttons. Escape, Close or a backdrop click dismisses it and returns focus to the opener, or the Projects heading if the opener is no longer visible.

Task rows and view controls provide larger touch targets. Preserve both those targets and visible focus when adapting the layout.

## What saves

Tasks, selected project, project filter, archive visibility and theme save together. List/Board saves separately; the task filter resets to All tasks on reload. Export includes the task data and saved project view, but excludes layout and task-filter preferences.

**Reset the workspace** selects Fern & Form, hides archives, shows all projects and sets the dark theme. It retains tasks, layout and the current task filter.

Storage belongs to this browser and origin. Keep an export as a backup. If saving fails, the current draft remains available to export. A corrupt save is not overwritten during startup. If another tab changes saved data, automatic saves pause; **Load saved** replaces this tab's draft with the stored version. This detects observed conflicts, without merging simultaneous edits.

Direct-file storage behavior varies. For reliable reload checks, run this from **Library** and open `http://127.0.0.1:4173/examples/command-room/`:

```sh
python3 -m http.server 4173 --bind 127.0.0.1
```

## Import boundaries

Import accepts the version 1 workspace schema: all three project lists, 1–100 tasks per project, names of 1–120 characters and boolean completion values. Files over 256 KB, unknown fields and malformed data are rejected before replacement. Names render as text.

Cancel or Escape preserves the current workspace. **Replace workspace** applies the preview and attempts to save; one **Undo import** remains until another import or reload.

## Reuse and verify

Adapt `app.js` for selection, tasks, dialog focus and import recovery; use `style.css` and `workspace.css` for presentation. The sample includes [keyboard paths](../../skills/accessibility/keyboard-paths/SKILL.md). The full library also provides [modal contracts](https://www.rival.tips/workshop), [status announcements](https://www.rival.tips/workshop) and [responsive composition](https://www.rival.tips/workshop).

Check the keyboard path, narrow layouts and enlarged text. Then test reload, cancelled import, undo, invalid input, blocked storage and a second tab's changes. Current work must remain visible or recoverable throughout.