Add a ToolboxPath component + use it on three high-impact doc pages

Search is good at finding *what* a feature does, but the doc text
rarely tells the reader *where in Toolbox's ImGui interface to
actually find the control* — so somebody who searches for "move items
to storage with ctrl+click" still has to hunt through the in-game
Settings window. Adds a small inline annotation component that
renders the breadcrumb path through Toolbox's UI down to the exact
button, checkbox, or chat command. No border or background by
default so it reads as a quiet footnote next to the prose rather
than a callout that hijacks the page.

Three doc kinds are now covered as worked examples:

  * items.md -> items.mdx — settings-window checkboxes (the user's
    original example: Settings > Inventory Settings > Move items
    from/to storage with Control+Click, plus the salvage/identify
    Ctrl+Click toggles and the Item Filter window).
  * chatfilter.md -> chatfilter.mdx — settings with informal
    sub-sections (Drops / Announcements / Warnings / Others) and a
    representative ToolboxPath per group. Also corrects an existing
    inaccuracy: the section header is "Chat Settings", not "Chat
    Filter", since that's what SettingsName() returns.
  * camera.md -> camera.mdx — chat commands (kind="command"),
    since Camera has no settings panel; the controls are all typed.

The component is built so other docs can opt in one bullet at a
time without converting the whole file's tone:

  <ToolboxPath steps={[
    'Settings', 'Inventory Settings',
    'Move items from/to storage with Control+Click'
  ]} />
  <ToolboxPath kind="command" steps={['/cam unlock']} />
  <ToolboxPath kind="hotkey"  steps={['Hotkeys', 'Add', '...']} />

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: henderkes

site/src/components/ToolboxPath.astro

@@ -0,0 +1,91 @@
+---
+/**
+ * Inline annotation that tells a reader where in the live Toolbox UI to
+ * find the control or feature being described. Render with a list of
+ * breadcrumb steps from the top-level entry point down to the leaf
+ * control. The last step is emphasised because it's the actual button,
+ * checkbox, or hotkey label the user is looking for.
+ *
+ * Examples:
+ *   <ToolboxPath steps={['Settings', 'Inventory Settings',
+ *                        'Move items from/to storage with Control+Click']} />
+ *   <ToolboxPath kind="hotkey"
+ *                steps={['Hotkeys', 'Add', 'Pcons: Toggle active set']} />
+ *   <ToolboxPath kind="command" steps={['/dmg report']} />
+ *
+ * Styling is deliberately minimal — no border or background by default.
+ * It should read as a quiet "here's where this lives" footnote next to
+ * the prose, not a callout that hijacks the page.
+ */
+
+type Kind = 'settings' | 'window' | 'widget' | 'hotkey' | 'command';
+
+interface Props {
+  /** Ordered breadcrumb steps; the last is the actual control label. */
+  steps: string[];
+  /** What kind of UI path this is. Picks the leading glyph. */
+  kind?: Kind;
+}
+
+const { steps, kind = 'settings' } = Astro.props;
+
+const glyphs: Record<Kind, string> = {
+  settings: '⚙',
+  window:   '▢',
+  widget:   '▣',
+  hotkey:   '⌨',
+  command:  '›_',
+};
+const labels: Record<Kind, string> = {
+  settings: 'Find in Toolbox settings',
+  window:   'Find in Toolbox window',
+  widget:   'Find in Toolbox widget',
+  hotkey:   'Bind in Toolbox hotkeys',
+  command:  'Chat command',
+};
+---
+
+<span class="tb-path" data-kind={kind} role="note" aria-label={labels[kind]}>
+  <span class="tb-path-icon" aria-hidden="true">{glyphs[kind]}</span>
+  {steps.map((step, i) => (
+    <>
+      {i > 0 && <span class="tb-path-sep" aria-hidden="true">›</span>}
+      <span class={i === steps.length - 1 ? 'tb-path-leaf' : 'tb-path-step'}>{step}</span>
+    </>
+  ))}
+</span>
+
+<style>
+  .tb-path {
+    display: inline-flex;
+    align-items: baseline;
+    flex-wrap: wrap;
+    gap: 0.15rem 0.3rem;
+    font-size: 0.85em;
+    line-height: 1.4;
+    color: var(--color-fg-meta);
+  }
+  .tb-path-icon {
+    color: var(--color-accent-deep);
+    font-size: 0.85em;
+  }
+  .tb-path[data-kind='command'] .tb-path-icon {
+    font-family: var(--font-mono);
+    letter-spacing: -0.05em;
+  }
+  .tb-path-step {
+    color: var(--color-fg-sub);
+  }
+  .tb-path-sep {
+    color: var(--color-fg-faint);
+  }
+  .tb-path-leaf {
+    color: var(--color-accent);
+    font-weight: 500;
+  }
+  /* When the prose stylesheet wraps us in <li>, keep our left-edge
+     aligned with the bullet text. */
+  :global(.prose li) > .tb-path {
+    margin-top: 0.2rem;
+  }
+</style>

site/src/content/docs/camera.md

@@ -0,0 +1,39 @@
+---
+title: "Camera"
+section: features
+---
+
+import ToolboxPath from '../../components/ToolboxPath.astro';
+
+Toolbox includes several features that interact with the game's camera, letting you view the world from perspectives the vanilla client doesn't allow. All camera functions are driven by [chat commands](/docs/commands/) — there's no setting panel, so the annotations below show the exact command to type.
+
+## Camera Unlock
+
+Free the camera from your character so you can fly it around the map.
+
+<ToolboxPath kind="command" steps={['/cam unlock']} /> &nbsp; or &nbsp; <ToolboxPath kind="command" steps={['/camera unlock']} />
+
+To re-attach the camera to your character:
+
+<ToolboxPath kind="command" steps={['/cam lock']} /> &nbsp; or &nbsp; <ToolboxPath kind="command" steps={['/camera lock']} />
+
+## Movement
+
+While the camera is unlocked:
+
+- **Horizontal axis** — `W` (forward), `E` / `D` (strafe right), `S` (backward), `Q` / `A` (strafe left).
+- **Vertical axis** — `Z` (up), `X` (down).
+- Hold the **right mouse button** to pan and tilt with the mouse.
+- Press `R` for auto-forward; press `W` or `S` to cancel.
+
+## Other features
+
+Toggle fog rendering:
+
+<ToolboxPath kind="command" steps={['/cam fog on']} /> &nbsp; / &nbsp; <ToolboxPath kind="command" steps={['/cam fog off']} />
+
+Adjust how fast the unlocked camera moves (default 100):
+
+<ToolboxPath kind="command" steps={['/cam speed 200']} />
+
+[back](./)

site/src/content/docs/camera.mdx

@@ -0,0 +1,79 @@
+---
+title: "Chat Filter"
+section: features
+---
+
+import ToolboxPath from '../../components/ToolboxPath.astro';
+
+The Chat Filter module in GWToolbox++ controls which messages appear in your chat window. You can suppress different message categories to reduce clutter and focus on what matters.
+
+All filters live under <ToolboxPath steps={['Settings', 'Chat Settings']} />, grouped into the sub-sections below. Each bullet is the literal checkbox label you'll find in the panel.
+
+## Features
+
+### Drops
+
+- A rare item drops for you / an ally
+- A common item drops for you / an ally
+- An ally picks up a rare / common item
+- You pick up a rare / common item
+
+<ToolboxPath steps={['Settings', 'Chat Settings', 'Drops', 'A rare item drops for you']} />
+
+> "Rare" stands for a gold-name item, Ecto, Obsidian Shard, or Lockpick. "Common" is everything else.
+
+### Announcements
+
+- Guild Announcement
+- Hall of Heroes winners
+- Favor of the Gods announcements
+- 'You have been playing for…'
+- 'Player x has achieved title…'
+- 'You gain x faction'
+
+<ToolboxPath steps={['Settings', 'Chat Settings', 'Announcements', 'Hall of Heroes winners']} />
+
+### Warnings
+
+Suppress the most common spam messages: "Unable to use item", "Invalid target", "Inventory is full", "Item already identified", "Not enough Adrenaline/Energy", "Opening chests".
+
+<ToolboxPath steps={['Settings', 'Chat Settings', 'Warnings', "'Inventory is full'"]} />
+
+### Others
+
+Skill points, PvP balance messages, 9 Rings, Lunar fortunes, challenge mission scores, "No one hears you", away replies, salvaging spam, ashes-dropped, targetting messages.
+
+### Custom filters
+
+Hide any message that contains specific words or phrases.
+
+- Enter words or phrases, one per line.
+- Matching is case-insensitive substring by default, or full regex if "Use regular expressions" is enabled.
+- Optionally scope the filter to specific chat channels (Local, Guild, Team, Trade, Alliance, Emotes).
+
+<ToolboxPath steps={['Settings', 'Chat Settings', 'Hide any messages containing:']} />
+
+### Hide messages by author
+
+Block specific players' messages outright.
+
+<ToolboxPath steps={['Settings', 'Chat Settings', 'Hide any messages from:']} />
+
+### Channel logging
+
+Stop the game from logging messages from chat channels you've turned off (chat history isn't unlimited).
+
+<ToolboxPath steps={['Settings', 'Chat Settings', 'Block messages from inactive chat channels']} />
+
+## Advanced filtering
+
+For more complex needs, tick **Use regular expressions** and treat each line of the custom-filter list as a regex pattern.
+
+Examples:
+
+- `^Player.*joined the game\.` — every "Player has joined the game" message.
+- `\b(rare|unique|gold)\b` — any message containing the words *rare*, *unique*, or *gold*.
+
+Test your patterns first — a too-broad regex will quietly eat messages you wanted to see.
+
+[back](./)

site/src/content/docs/chatfilter.md

@@ -0,0 +1,40 @@
+---
+title: "Item Management Features"
+section: widgets
+---
+
+import ToolboxPath from '../../components/ToolboxPath.astro';
+
+GWToolbox++ provides several advanced item management features to enhance your gameplay experience. These features are designed to streamline inventory management, improve item filtering, and provide convenient shortcuts for common item-related tasks.
+
+## Inventory Manager
+
+The Inventory Manager module offers the following functionality:
+
+- **Ctrl+Click to move between inventory and storage**: hold Ctrl and click an item to send it to storage (or back to your inventory if the storage pane is open).
+  <ToolboxPath steps={['Settings', 'Inventory Settings', 'Move items from/to storage with Control+Click']} />
+- **Move to the currently open storage pane**: when the option above is on, Toolbox can prefer the pane you have open instead of any free slot.
+  <ToolboxPath steps={['Settings', 'Inventory Settings', 'Move items to current open storage pane on click']} />
+- **Materials to the open storage pane**: same idea, scoped specifically to materials so you can still consolidate ectos / shards into the materials pane.
+  <ToolboxPath steps={['Settings', 'Inventory Settings', 'Move materials to current open storage pane on click']} />
+- **Auto-Salvage**: Ctrl+Click a salvage kit to open the Salvage All window for every salvageable item of a chosen rarity.
+  <ToolboxPath steps={['Settings', 'Inventory Settings', 'Salvage All with Control+Click']} />
+- **Auto-Identify**: Ctrl+Click an identification kit to identify everything in the selected bags.
+  <ToolboxPath steps={['Settings', 'Inventory Settings', 'Identify All with Control+Click']} />
+- **Pick which bags to salvage from**: tick only the bags you want the bulk operations to consider.
+  <ToolboxPath steps={['Settings', 'Inventory Settings', 'Salvage from: Backpack / Belt Pouch / Bag 1 / Bag 2']} />
+- **Right-click context menu**: extra options on items in inventory or storage (move stack, identify, salvage, send to merchant).
+- **Trade improvements**: when offering an item in a trade window, Toolbox can automatically offer the full stack instead of one unit.
+
+## Item Filter
+
+The Item Filter module controls which item drops appear in the game world. Configure it in <ToolboxPath kind="window" steps={['Settings', 'Item Filter']} />.
+
+- **Rarity-based filtering** — hide or show drops by rarity (white, blue, purple, gold, green) independently for items you can pick up and items reserved for party members.
+- **Custom exceptions** — name items that should always be shown regardless of rarity, so a rare drop you're farming for never gets hidden by a broad rule.
+
+## Merchant window
+
+You can also hide specific items from the merchant's *Sell* window so you don't accidentally vendor them. <ToolboxPath steps={['Settings', 'Inventory Settings', 'Merchant hidden items…']} />
+
+These features combine to provide a powerful suite of tools for managing your items more efficiently in Guild Wars.