chore: bump v0.1.52, fix sidebar collapse toggle position

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

.gitignore

@@ -1,5 +1,6 @@
 node_modules/
 dist/
+.claude/
 .superpowers/
 .worktrees/
 test-results/

AGENTS.md

@@ -0,0 +1,101 @@
+<!-- gitnexus:start -->
+# GitNexus — Code Intelligence
+
+This project is indexed by GitNexus as **design-system** (1479 symbols, 2371 relationships, 24 execution flows). Use the GitNexus MCP tools to understand code, assess impact, and navigate safely.
+
+> If any GitNexus tool warns the index is stale, run `npx gitnexus analyze` in terminal first.
+
+## Always Do
+
+- **MUST run impact analysis before editing any symbol.** Before modifying a function, class, or method, run `gitnexus_impact({target: "symbolName", direction: "upstream"})` and report the blast radius (direct callers, affected processes, risk level) to the user.
+- **MUST run `gitnexus_detect_changes()` before committing** to verify your changes only affect expected symbols and execution flows.
+- **MUST warn the user** if impact analysis returns HIGH or CRITICAL risk before proceeding with edits.
+- When exploring unfamiliar code, use `gitnexus_query({query: "concept"})` to find execution flows instead of grepping. It returns process-grouped results ranked by relevance.
+- When you need full context on a specific symbol — callers, callees, which execution flows it participates in — use `gitnexus_context({name: "symbolName"})`.
+
+## When Debugging
+
+1. `gitnexus_query({query: "<error or symptom>"})` — find execution flows related to the issue
+2. `gitnexus_context({name: "<suspect function>"})` — see all callers, callees, and process participation
+3. `READ gitnexus://repo/design-system/process/{processName}` — trace the full execution flow step by step
+4. For regressions: `gitnexus_detect_changes({scope: "compare", base_ref: "main"})` — see what your branch changed
+
+## When Refactoring
+
+- **Renaming**: MUST use `gitnexus_rename({symbol_name: "old", new_name: "new", dry_run: true})` first. Review the preview — graph edits are safe, text_search edits need manual review. Then run with `dry_run: false`.
+- **Extracting/Splitting**: MUST run `gitnexus_context({name: "target"})` to see all incoming/outgoing refs, then `gitnexus_impact({target: "target", direction: "upstream"})` to find all external callers before moving code.
+- After any refactor: run `gitnexus_detect_changes({scope: "all"})` to verify only expected files changed.
+
+## Never Do
+
+- NEVER edit a function, class, or method without first running `gitnexus_impact` on it.
+- NEVER ignore HIGH or CRITICAL risk warnings from impact analysis.
+- NEVER rename symbols with find-and-replace — use `gitnexus_rename` which understands the call graph.
+- NEVER commit changes without running `gitnexus_detect_changes()` to check affected scope.
+
+## Tools Quick Reference
+
+| Tool | When to use | Command |
+|------|-------------|---------|
+| `query` | Find code by concept | `gitnexus_query({query: "auth validation"})` |
+| `context` | 360-degree view of one symbol | `gitnexus_context({name: "validateUser"})` |
+| `impact` | Blast radius before editing | `gitnexus_impact({target: "X", direction: "upstream"})` |
+| `detect_changes` | Pre-commit scope check | `gitnexus_detect_changes({scope: "staged"})` |
+| `rename` | Safe multi-file rename | `gitnexus_rename({symbol_name: "old", new_name: "new", dry_run: true})` |
+| `cypher` | Custom graph queries | `gitnexus_cypher({query: "MATCH ..."})` |
+
+## Impact Risk Levels
+
+| Depth | Meaning | Action |
+|-------|---------|--------|
+| d=1 | WILL BREAK — direct callers/importers | MUST update these |
+| d=2 | LIKELY AFFECTED — indirect deps | Should test |
+| d=3 | MAY NEED TESTING — transitive | Test if critical path |
+
+## Resources
+
+| Resource | Use for |
+|----------|---------|
+| `gitnexus://repo/design-system/context` | Codebase overview, check index freshness |
+| `gitnexus://repo/design-system/clusters` | All functional areas |
+| `gitnexus://repo/design-system/processes` | All execution flows |
+| `gitnexus://repo/design-system/process/{name}` | Step-by-step execution trace |
+
+## Self-Check Before Finishing
+
+Before completing any code modification task, verify:
+1. `gitnexus_impact` was run for all modified symbols
+2. No HIGH/CRITICAL risk warnings were ignored
+3. `gitnexus_detect_changes()` confirms changes match expected scope
+4. All d=1 (WILL BREAK) dependents were updated
+
+## Keeping the Index Fresh
+
+After committing code changes, the GitNexus index becomes stale. Re-run analyze to update it:
+
+```bash
+npx gitnexus analyze
+```
+
+If the index previously included embeddings, preserve them by adding `--embeddings`:
+
+```bash
+npx gitnexus analyze --embeddings
+```
+
+To check whether embeddings exist, inspect `.gitnexus/meta.json` — the `stats.embeddings` field shows the count (0 means no embeddings). **Running analyze without `--embeddings` will delete any previously generated embeddings.**
+
+> Claude Code users: A PostToolUse hook handles this automatically after `git commit` and `git merge`.
+
+## CLI
+
+| Task | Read this skill file |
+|------|---------------------|
+| Understand architecture / "How does X work?" | `.claude/skills/gitnexus/gitnexus-exploring/SKILL.md` |
+| Blast radius / "What breaks if I change X?" | `.claude/skills/gitnexus/gitnexus-impact-analysis/SKILL.md` |
+| Trace bugs / "Why is X failing?" | `.claude/skills/gitnexus/gitnexus-debugging/SKILL.md` |
+| Rename / extract / split / refactor | `.claude/skills/gitnexus/gitnexus-refactoring/SKILL.md` |
+| Tools, resources, schema reference | `.claude/skills/gitnexus/gitnexus-guide/SKILL.md` |
+| Index, status, clean, wiki CLI commands | `.claude/skills/gitnexus/gitnexus-cli/SKILL.md` |
+
+<!-- gitnexus:end -->

CLAUDE.md

@@ -132,7 +132,7 @@ import camelSvg from '@cameleer/design-system/assets/camel-logo.svg'     // simp
 <!-- gitnexus:start -->
 # GitNexus — Code Intelligence
 
-This project is indexed by GitNexus as **design-system** (1461 symbols, 2336 relationships, 23 execution flows). Use the GitNexus MCP tools to understand code, assess impact, and navigate safely.
+This project is indexed by GitNexus as **design-system** (1479 symbols, 2371 relationships, 24 execution flows). Use the GitNexus MCP tools to understand code, assess impact, and navigate safely.
 
 > If any GitNexus tool warns the index is stale, run `npx gitnexus analyze` in terminal first.
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cameleer/design-system",
-  "version": "0.1.49",
+  "version": "0.1.52",
   "type": "module",
   "main": "./dist/index.es.js",
   "module": "./dist/index.es.js",

src/design-system/composites/Breadcrumb/Breadcrumb.tsx

@@ -8,9 +8,10 @@ interface BreadcrumbItem {
 interface BreadcrumbProps {
   items: BreadcrumbItem[]
   className?: string
+  onNavigate?: (href: string) => void
 }
 
-export function Breadcrumb({ items, className }: BreadcrumbProps) {
+export function Breadcrumb({ items, className, onNavigate }: BreadcrumbProps) {
   return (
     <nav aria-label="Breadcrumb" className={className}>
       <ol className={styles.list}>
@@ -22,7 +23,11 @@ export function Breadcrumb({ items, className }: BreadcrumbProps) {
               {isLast ? (
                 <span className={styles.active}>{item.label}</span>
               ) : item.href ? (
-                <a href={item.href} className={styles.link}>
+                <a
+                  href={item.href}
+                  className={styles.link}
+                  onClick={onNavigate ? (e) => { e.preventDefault(); onNavigate(item.href!) } : undefined}
+                >
                   {item.label}
                 </a>
               ) : (

src/design-system/layout/Sidebar/Sidebar.module.css

@@ -53,6 +53,12 @@
   justify-content: center;
 }
 
+.sidebarCollapsed .collapseToggle {
+  top: 52px;
+  right: 50%;
+  transform: translateX(50%);
+}
+
 .logoImg {
   width: 28px;
   height: 24px;

src/design-system/layout/TopBar/TopBar.tsx

@@ -14,6 +14,7 @@ interface TopBarProps {
   user?: { name: string }
   userMenuItems?: import('../../composites/Dropdown/Dropdown').DropdownItem[]
   onLogout?: () => void
+  onNavigate?: (href: string) => void
   className?: string
   children?: ReactNode
 }
@@ -24,6 +25,7 @@ export function TopBar({
   user,
   userMenuItems,
   onLogout,
+  onNavigate,
   className,
   children,
 }: TopBarProps) {
@@ -33,7 +35,7 @@ export function TopBar({
   return (
     <header className={`${styles.topbar} ${className ?? ''}`}>
       {/* Left: Breadcrumb */}
-      <Breadcrumb items={breadcrumbOverride ?? breadcrumb} className={styles.breadcrumb} />
+      <Breadcrumb items={breadcrumbOverride ?? breadcrumb} className={styles.breadcrumb} onNavigate={onNavigate} />
 
       {/* Center: consumer-provided controls */}
       {children}

src/pages/Inventory/sections/BrandAssetsSection.tsx

@@ -1,7 +1,7 @@
 import styles from './BrandAssetsSection.module.css'
 import camelLogoSvg from '../../../assets/camel-logo.svg'
-import cameleer3Logo from '../../../assets/cameleer3-logo.png'
-import cameleer3LogoSvg from '../../../assets/cameleer3-logo.svg'
+import cameleerLogo from '../../../assets/cameleer-logo.png'
+import cameleerLogoSvg from '../../../assets/cameleer-logo.svg'
 
 const LOGO_SIZES = [16, 32, 48, 180, 192, 512] as const
 
@@ -11,7 +11,7 @@ export function BrandAssetsSection() {
       <h2 className={styles.sectionTitle}>Brand Assets</h2>
 
       <div className={styles.componentCard}>
-        <h3 className={styles.componentTitle}>Cameleer3 Logo (PNG)</h3>
+        <h3 className={styles.componentTitle}>Cameleer Logo (PNG)</h3>
         <p className={styles.componentDesc}>
           Full-resolution logo and pre-generated size variants for favicons, PWA icons, and social images.
           Shipped as static assets via <code>@cameleer/design-system/assets/*</code> export.
@@ -22,27 +22,27 @@ export function BrandAssetsSection() {
               <div key={size} className={styles.logoItem}>
                 <div className={styles.logoPreview}>
                   <img
-                    src={cameleer3Logo}
+                    src={cameleerLogo}
                     alt={`Logo ${size}×${size}`}
                     width={Math.min(size, 96)}
                     height={Math.min(size, 96)}
                   />
                 </div>
                 <span className={styles.logoLabel}>{size}×{size}</span>
-                <code className={styles.logoExport}>assets/cameleer3-{size}.png</code>
+                <code className={styles.logoExport}>assets/cameleer-{size}.png</code>
               </div>
             ))}
             <div className={styles.logoItem}>
               <div className={styles.logoPreview}>
                 <img
-                  src={cameleer3Logo}
+                  src={cameleerLogo}
                   alt="Full resolution logo"
                   width={96}
                   height={96}
                 />
               </div>
               <span className={styles.logoLabel}>Original</span>
-              <code className={styles.logoExport}>assets/cameleer3-logo.png</code>
+              <code className={styles.logoExport}>assets/cameleer-logo.png</code>
             </div>
           </div>
         </div>
@@ -57,10 +57,10 @@ export function BrandAssetsSection() {
           <div className={styles.logoGrid}>
             <div className={styles.logoItem}>
               <div className={styles.logoPreview}>
-                <img src={cameleer3LogoSvg} alt="Cameleer3 SVG logo" width={96} height={96} />
+                <img src={cameleerLogoSvg} alt="Cameleer SVG logo" width={96} height={96} />
               </div>
-              <span className={styles.logoLabel}>Cameleer3 SVG</span>
-              <code className={styles.logoExport}>assets/cameleer3-logo.svg</code>
+              <span className={styles.logoLabel}>Cameleer SVG</span>
+              <code className={styles.logoExport}>assets/cameleer-logo.svg</code>
             </div>
             <div className={styles.logoItem}>
               <div className={styles.logoPreview}>