@kolkrabbi/kol-shell 0.38.0 → 0.40.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kolkrabbi/kol-shell",
-  "version": "0.38.0",
+  "version": "0.40.0",
   "private": false,
   "description": "KOL application shell — fixed 48px NavRail + AppShell layout root, PageShell/PageHeader scaffolds, ContentFilters catalog organism, GridCard, SettingsScaffold, WalkthroughPanel, ShortcutsOverlay. App chrome (kol-framework owns site chrome). Nav items, content, shortcuts and settings are consumer-injected. Sits above @kolkrabbi/kol-{theme,component,framework}.",
   "license": "MIT",
@@ -20,10 +20,10 @@
     "react-dom": "^18.3.0 || ^19.0.0"
   },
   "devDependencies": {
-    "@kolkrabbi/kol-theme": "^0.123.0",
+    "@kolkrabbi/kol-component": "^0.162.0",
     "@kolkrabbi/kol-icons": "^0.25.0",
-    "@kolkrabbi/kol-component": "^0.156.0",
-    "@kolkrabbi/kol-framework": "^0.36.0"
+    "@kolkrabbi/kol-framework": "^0.36.0",
+    "@kolkrabbi/kol-theme": "^0.128.0"
   },
   "files": [
     "src",

package/src/AppShell.jsx

@@ -194,13 +194,23 @@ export default function AppShell({
     return () => window.removeEventListener('keydown', onKey)
   }, [settingsKey, settingsPath, toggleSettings])
 
-  /* the rail row for that path toggles too — one gesture, two ways to reach it */
+  /* the drawer's rule for a path — matched like the rail's active row */
+  const opensOn = (p) => drawerOpenOn.some((x) => (x === '/' ? p === '/' : p.startsWith(x)))
+
+  /* the rail row for that path toggles too — one gesture, two ways to reach it.
+   * THE TAP DECIDES THE DRAWER, not only the route change
+   * (ShellDrawerCloseOnSamePath, kol-monitor 2026-09-02): a rung whose path is
+   * the one already shown — Create tapped on /create, "new case" — changes no
+   * pathname, so the route effect below never fires and the drawer stayed open
+   * over the page. The tap itself now sets the drawer to that path's rule;
+   * `drawerOpenOn` rungs stay open, every other rung closes it, same path or not. */
   const navigate = useCallback(
     (path, ...rest) => {
+      if (drawer) setDrawerOpen(opensOn(path))
       if (settingsPath && path === settingsPath) return toggleSettings()
       return onNavigate?.(path, ...rest)
     },
-    [settingsPath, toggleSettings, onNavigate],
+    [settingsPath, toggleSettings, onNavigate, drawer, drawerOpenOn], // eslint-disable-line react-hooks/exhaustive-deps
   )
 
   /* THE ROUTE CHANGE MEANS THE OPPOSITE IN EACH MODE. For `railToggleKey` the
@@ -215,7 +225,7 @@ export default function AppShell({
   /* Keyed on the BOOLEAN, not the array: a consumer's inline `['/']` is a new
    * identity every render too (the showcase set passes one), and the effect
    * must fire on route entry only — never on a re-render, or it undoes the tap. */
-  const opensHere = drawerOpenOn.some((p) => (p === '/' ? currentPath === '/' : currentPath.startsWith(p)))
+  const opensHere = opensOn(currentPath)
   useEffect(() => {
     if (drawer) setDrawerOpen(opensHere)
     else setNavHidden(false)

package/src/NavRail.jsx

@@ -298,18 +298,19 @@ export default function NavRail({
       style={{ width: drawer ? 'var(--kol-shell-drawer-width, 240px)' : `var(${RAIL_W})` }}
     >
       {!drawer && (
-        /* A BUTTON, with a glyph a thumb can find (ShellRailCollapsedWithTapOpen,
-         * kol-mirror 2026-09-01 — user: "i means collapsed variant not
-         * expanded"): `touch="shell"` is the only mode that keeps the 48px rail
-         * visible, and its only opener was this 8px strip, invisible until a
-         * pointer HOVERED near it — a thumb never does, so on a phone the rail
-         * could not be opened at all. The strip already toggled on a click (a
-         * press with no travel); it just had no affordance and no hit area on
-         * touch. Under `(pointer: coarse)` the theme shows `.kol-rail-grab-tap`
-         * — a 24px disc on the line — and widens the strip to it; on a fine
-         * pointer nothing changes, the ruled grab stays. The drag hook binds
-         * pointer events, so a button works exactly as the div did, and it now
-         * says what it is. Enter/Space toggle for the keyboard. */
+        /* A BUTTON, and on touch A THICKER LINE (ShellRailCollapsedWithTapOpen,
+         * kol-mirror 2026-09-01; corrected by RailGrabTapIsALine, kol-monitor
+         * 2026-09-02 — user: "it was a thicker line" · "who decided it should be
+         * a chevron?"): `touch="shell"` keeps the 48px rail visible and its
+         * only opener was this 8px strip, whose pill wakes on pointer
+         * PROXIMITY — a thumb never hovers. The 0.38.0 answer was a disc with a
+         * chevron; that was the DS agent's shape, not the user's ruling. The
+         * opener is the strip ITSELF: under `(pointer: coarse)` the theme
+         * widens it to a thumb-sized hit and shows the pill thick at rest — the
+         * same affordance a fine pointer drags, no glyph. A press with no travel
+         * already toggled; it just had no hit area on touch. The drag hook binds
+         * pointer events, so a button works exactly as the div did, and it says
+         * what it is. Enter/Space toggle for the keyboard. */
         <button
           type="button"
           ref={grabRef}
@@ -317,11 +318,7 @@ export default function NavRail({
           aria-label={railOpen ? 'Collapse navigation' : 'Expand navigation'}
           aria-expanded={railOpen}
           onKeyDown={(e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); snapOpenRef.current?.(!railOpen) } }}
-        >
-          <span className="kol-rail-grab-tap" aria-hidden="true">
-            <IconAt name={railOpen ? 'chevron-left' : 'chevron-right'} size={12} component={iconComponent} />
-          </span>
-        </button>
+        />
       )}
       {logomark && (
         /* the mark, and the app name beside it when open — uppercase like the