s0lrayandPaperclip 0e7fdcfdbf Add tool details panel UI and D3 wiring (THE-104, THE-105) ...

THE-104: Build panel UI component
- New public/css/panel.css using existing design tokens
- Fixed-position slide-in panel (340px desktop, 100vw bottom-sheet on mobile)
- 250ms GPU-accelerated translateX() slide animation with will-change
- All section placeholders: header, breadcrumb, badges, description, usage,
  OPSEC, rating, report link, CTA button
- Dark mode via body.light-mode CSS variable overrides
- Graceful empty states (sections hidden via .empty class)

THE-105: Wire panel to D3 tree interactions
- Leaf-node clicks (nodes with url, no children) open panel instead of navigating
- parseName() for clean title + badge rendering
- Breadcrumb built by walking parent chain to root
- Selected-node ring via _panelSelected flag + stroke style in nodeUpdate
- Close triggers: ✕ button, Escape key, overlay click, canvas click, same-node re-click
- Clicking another leaf swaps panel content in-place
- Session hash via crypto.randomUUID() stored in sessionStorage

Co-Authored-By: Paperclip <noreply@paperclip.ing>

2026-03-25 23:00:21 -04:00

..

arf.css

Merge pull request #571 from lockfale/feature/THE-87-search-reveal

2026-03-25 15:39:00 -04:00

panel.css

Add tool details panel UI and D3 wiring (THE-104, THE-105)

2026-03-25 23:00:21 -04:00