1d57a0d1e5
* fix(web/tools): make section headings collapsible
Agent Tools and CLI Tools section headings were static divs with no
way to collapse sections the user is not interested in, making the
page unwieldy with a large tool set.
- Convert both section heading divs to button elements toggling
agentSectionOpen / cliSectionOpen state (both default open)
- Section content renders conditionally on those booleans
- ChevronsUpDown icon added (already in lucide-react bundle) that
fades in on hover and indicates collapsed/expanded state
- No change to individual tool card parameter schema expand/collapse
Risk: Low — UI state only, no API or logic change.
Does not change: search/filter behaviour, tool card expand/collapse,
CLI tools table structure.
* fix(web/tools): improve a11y and fix invalid HTML in collapsible sections
- Replace <h2> inside <button> with <span role="heading" aria-level={2}>
to fix invalid HTML (heading elements not permitted in interactive content)
- Add aria-expanded attribute to section toggle buttons for screen readers
- Add aria-controls + id linking buttons to their controlled sections
- Replace ChevronsUpDown with ChevronDown icon — ChevronsUpDown is
visually symmetric so rotating 180deg has no visible effect; ChevronDown
rotating to -90deg gives a clear directional cue
- Remove unused ChevronsUpDown import
---------
Co-authored-by: WareWolf-MoonWall <chris.hengge@gmail.com>
|
||
|---|---|---|
| .. | ||
| dist | ||
| public | ||
| src | ||
| .gitignore | ||
| index.html | ||
| package-lock.json | ||
| package.json | ||
| tsconfig.app.json | ||
| tsconfig.json | ||
| tsconfig.node.json | ||
| vite.config.ts | ||