38 lines
2.5 KiB
Markdown
38 lines
2.5 KiB
Markdown
# Research: Inline HP Delta Input
|
|
|
|
## R-001: Can the existing domain function support the new UI?
|
|
|
|
**Decision**: Yes -- the existing `adjustHp(encounter, combatantId, delta)` function already accepts any integer delta. Negative deltas deal damage, positive deltas heal. No domain changes required.
|
|
|
|
**Rationale**: The domain function is already delta-based and mode-agnostic. The current QuickHpInput component translates its damage/heal mode into a signed delta before calling `onAdjustHp`. The new UI simply changes how the sign is determined (Enter = negative, heal button = positive, damage button = negative).
|
|
|
|
**Alternatives considered**: None -- the domain API is already ideal for this use case.
|
|
|
|
## R-002: UI pattern for inline delta with explicit action buttons
|
|
|
|
**Decision**: Replace the mode toggle button + input with a single numeric input flanked by two small icon buttons (damage on left, heal on right). Enter key applies damage by default.
|
|
|
|
**Rationale**: This eliminates the mode toggle state entirely. Users always see both options. The most common action (damage) is the keyboard default. Less common action (heal) requires a button click -- still only 2-3 interactions.
|
|
|
|
**Alternatives considered**:
|
|
- Separate damage and heal inputs per combatant: rejected as too much UI clutter for the compact row layout.
|
|
- Negative number = damage, positive = heal (user types sign): rejected as slower (extra keystroke) and error-prone.
|
|
|
|
## R-003: What happens to the Tab key behavior?
|
|
|
|
**Decision**: Remove the Tab key override. Tab returns to its default browser behavior (move focus to next element).
|
|
|
|
**Rationale**: The Tab key was previously overridden to toggle between damage/heal modes. Since modes no longer exist, Tab should not be intercepted. This improves accessibility and standard keyboard navigation.
|
|
|
|
**Alternatives considered**: None -- restoring default Tab behavior is the obvious choice.
|
|
|
|
## R-004: Button icons and visual distinction
|
|
|
|
**Decision**: Use Sword icon (red) for damage button and Heart icon (green) for heal button, consistent with the existing color scheme from the mode toggle.
|
|
|
|
**Rationale**: These icons are already imported (Lucide React) and used in the current mode toggle. Users familiar with the current UI will recognize them. Red = damage, green = heal is a universal convention.
|
|
|
|
**Alternatives considered**:
|
|
- Minus/Plus icons: too generic, less evocative of the D&D context.
|
|
- Text labels ("Dmg"/"Heal"): take more space than icons in the compact row.
|