# Implementation Plan: Bottom Bar Overhaul **Branch**: `036-bottombar-overhaul` | **Date**: 2026-03-11 | **Spec**: [spec.md](./spec.md) **Input**: Feature specification from `/specs/036-bottombar-overhaul/spec.md` ## Summary Overhaul the bottom bar action bar to support batch-adding predefined creatures (click-to-queue with count + confirm), optional stat fields for custom creatures (initiative, AC, max HP), stat block preview from the search dropdown, and improved placeholder text. All changes are in the adapter (web) layer — no domain or application changes needed. The existing `addFromBestiary` hook method is called N times in a loop for batch adds. ## Technical Context **Language/Version**: TypeScript 5.8 (strict mode, `verbatimModuleSyntax`) **Primary Dependencies**: React 19, Tailwind CSS v4, Lucide React (icons) **Storage**: N/A (no persistence changes — queue state and custom fields are ephemeral) **Testing**: Vitest (unit tests for any extracted logic) **Target Platform**: Web (desktop + mobile responsive) **Project Type**: Web application (monorepo: apps/web, packages/domain, packages/application) **Performance Goals**: Instant UI response for queue interactions **Constraints**: Local-first, single-user, offline-capable **Scale/Scope**: Single encounter screen, bottom bar component ## Constitution Check *GATE: Must pass before Phase 0 research. Re-check after Phase 1 design.* | Principle | Status | Notes | |-----------|--------|-------| | I. Deterministic Domain Core | PASS | No domain changes. Queue state is UI-only. | | II. Layered Architecture | PASS | All changes in adapter layer (apps/web). Calls existing domain/application functions. | | III. Clarification-First | PASS | No non-trivial assumptions — spec is detailed. | | IV. Escalation Gates | PASS | Implementation stays within spec scope. | | V. MVP Baseline Language | PASS | No permanent bans introduced. | | VI. No Gameplay Rules | PASS | No gameplay mechanics in plan. | ## Project Structure ### Documentation (this feature) ```text specs/036-bottombar-overhaul/ ├── plan.md # This file ├── research.md # Phase 0 output ├── data-model.md # Phase 1 output ├── quickstart.md # Phase 1 output └── tasks.md # Phase 2 output (/speckit.tasks) ``` ### Source Code (repository root) ```text apps/web/src/ ├── components/ │ ├── action-bar.tsx # MODIFY: overhaul with batch queue, custom fields, stat block button │ └── bestiary-search.tsx # MODIFY or REMOVE: functionality merges into action-bar ├── hooks/ │ └── use-encounter.ts # EXISTING: addFromBestiary called N times for batch ├── App.tsx # MODIFY: pass stat block view callback to action bar packages/domain/src/ ├── add-combatant.ts # EXISTING: no changes ├── auto-number.ts # EXISTING: handles name deduplication for batch adds └── types.ts # EXISTING: Combatant already has initiative?, ac?, maxHp? ``` **Structure Decision**: All changes are within `apps/web/src/components/` (adapter layer). The action bar component is the primary modification target. The existing `BestiarySearch` component's dropdown functionality will be integrated directly into the action bar's unified search flow. No new packages or layers needed. ## Complexity Tracking > No constitution violations. Table intentionally left empty.