@kolkrabbi/kol-workshop 0.3.1 → 0.3.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kolkrabbi/kol-workshop",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "private": false,
   "description": "KOL workshop/docs system — a handrolled markdown engine, search, tag system (incl. a d3 tag graph), docs viewer, and docs shell. Sits above @kolkrabbi/kol-{theme,icons,component,framework}; content is consumer-injected (the package never globs docs).",
   "license": "MIT",
@@ -14,10 +14,10 @@
   "dependencies": {
     "d3": "^7.9.0",
     "@kolkrabbi/kol-brand": "^0.1.2",
+    "@kolkrabbi/kol-component": "0.14.0",
     "@kolkrabbi/kol-icons": "0.8.10",
-    "@kolkrabbi/kol-component": "0.13.1",
-    "@kolkrabbi/kol-framework": "0.6.4",
-    "@kolkrabbi/kol-theme": "0.12.2"
+    "@kolkrabbi/kol-framework": "0.7.0",
+    "@kolkrabbi/kol-theme": "0.13.0"
   },
   "peerDependencies": {
     "react": "^18.3.0 || ^19.0.0",

package/src/docs/DocumentationReader.jsx

@@ -172,6 +172,13 @@ const DocumentationReader = ({
 
   const rawMarkdown = useMemo(() => {
     if (!doc) return null
+    /* Primary resolution (2026-07-30): through the doc's own file path — exact
+     * and collision-proof (the endsWith(docId) heuristic below grabbed the
+     * FIRST basename match, so duplicate filenames across folders rendered the
+     * wrong doc). The heuristic stays as a fallback for hand-built inventories
+     * whose `file` doesn't mirror the module keys. */
+    const byFile = doc.file && Object.keys(modules).find((p) => p.endsWith(doc.file))
+    if (byFile) return modules[byFile]
     // For index files, the docId is like "00-metadata-index" but the file is "index.md"
     // For regular files, docId matches the filename (e.g., "0.0.1-writing-guidelines")
     const path = Object.keys(modules).find((p) => {

package/src/engine/build-inventory.js

@@ -25,17 +25,27 @@ export function buildInventory(modules) {
     const parentFolder = normalisedPath.split('/').slice(-2, -1)[0] ?? ''
     const baseId = filename.replace(/\.md$/, '')
 
-    // Make index.md IDs unique by prefixing with parent folder
-    const id = baseId === 'index' ? `${parentFolder}-index` : baseId
+    // Make index.md / INDEX.md IDs unique by prefixing with parent folder
+    const id = baseId.toLowerCase() === 'index' ? `${parentFolder}-${baseId}` : baseId
 
     const rawTitle = title || metadata.title || id
     const cleanTitle = rawTitle
       .replace(/^Design System\s*[-–—:]\s*/i, '')
       .replace(/\bCheat Sheet\b/i, 'Quicklook')
 
-    return { id, file: normalisedPath, title: cleanTitle, metadata }
+    return { id, file: normalisedPath, title: cleanTitle, metadata, parentFolder }
   })
 
+  /* Collision safety (2026-07-30): filename-only ids collide across folders in
+   * any real vault (02-icons/01-inventory vs 03-components/01-inventory — the
+   * React dup-key bug from the 07-29 vault experiment). A collided id gains
+   * its parent folder, same convention the index handling already uses. */
+  const counts = inventory.reduce((m, d) => (m[d.id] = (m[d.id] ?? 0) + 1, m), {})
+  for (const d of inventory) {
+    if (counts[d.id] > 1) d.id = `${d.parentFolder}-${d.id}`
+  }
+  for (const d of inventory) delete d.parentFolder
+
   inventory.sort((a, b) => a.file.localeCompare(b.file))
   return inventory
 }

package/src/shell/ShellLayout.jsx

@@ -21,8 +21,12 @@ export const ShellFullHeightContext = createContext(null)
 // useLayoutEffect(() => { setTocCollapsed(true) ; return () => setTocCollapsed(false) }, [setTocCollapsed])
 export const ShellTocCollapsedContext = createContext(null)
 
+/* overflow-x-hidden (2026-07-30): long tree rows (component names + counters)
+ * overflowed the 256px rail into an internal horizontal scroll — with the
+ * scrollbar hidden it read as content silently walking off, and the pan
+ * gesture shoved the whole grid sideways exposing the outer padding. */
 const NavColumn = ({ children }) => (
-  <aside aria-label="Navigation" className="shell-sidebar-sticky hidden lg:block shrink-0 h-full min-h-0 overflow-y-auto overscroll-none pt-6 md:pt-6 lg:pt-8 pb-8">
+  <aside aria-label="Navigation" className="shell-sidebar-sticky hidden lg:block shrink-0 h-full min-h-0 overflow-y-auto overflow-x-hidden overscroll-none pt-6 md:pt-6 lg:pt-8 pb-8">
     {children}
   </aside>
 )
@@ -41,7 +45,7 @@ const MainColumn = ({ children, fullHeight }) => (
 )
 
 const TocColumn = ({ children }) => (
-  <aside aria-label="Table of contents" className="shell-sidebar-sticky hidden lg:block shrink-0 h-full min-h-0 overflow-y-auto overscroll-none pt-6 md:pt-6 lg:pt-8 pb-8">
+  <aside aria-label="Table of contents" className="shell-sidebar-sticky hidden lg:block shrink-0 h-full min-h-0 overflow-y-auto overflow-x-hidden overscroll-none pt-6 md:pt-6 lg:pt-8 pb-8">
     {children}
   </aside>
 )