@kolkrabbi/kol-framework 0.40.0 → 0.41.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/src/PageLayout.jsx +18 -9
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kolkrabbi/kol-framework",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.41.0",
|
|
4
4
|
"description": "KOL app shell — sidenav, layout, theme toggle, footer, heroes + brand color layer. SideNav takes nav data as props so the tree stays app-local.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
package/src/PageLayout.jsx
CHANGED
|
@@ -15,9 +15,11 @@ export const ShellTocContext = createContext(null)
|
|
|
15
15
|
* useLayoutEffect(() => { setTocCollapsed(true); return () => setTocCollapsed(false) }, [setTocCollapsed]) */
|
|
16
16
|
export const ShellTocCollapsedContext = createContext(null)
|
|
17
17
|
|
|
18
|
-
/* `getActivePage` —
|
|
19
|
-
*
|
|
20
|
-
*
|
|
18
|
+
/* `getActivePage` — inert since the 2026-08-09 SideNav port (the two-level
|
|
19
|
+
* elder model derives the active category from the route). No longer
|
|
20
|
+
* destructured: a prop nobody reads is not part of the signature (props gate
|
|
21
|
+
* P2), and an unknown prop on a component is simply ignored, so no call site
|
|
22
|
+
* breaks. */
|
|
21
23
|
/* `sideNav` — every SideNav prop AppShell does not own, spread onto the rail
|
|
22
24
|
* (sidenav-rail-hairline, 2026-08-26): `background`, `hairline`, `isActive`,
|
|
23
25
|
* `onNavigate` … the next rail option needs no AppShell release. */
|
|
@@ -49,7 +51,6 @@ export const ShellTocCollapsedContext = createContext(null)
|
|
|
49
51
|
* one component takes one model, and kol-studio passes its wash.
|
|
50
52
|
*
|
|
51
53
|
* @param {Array} navTree the sidenav's tree (see SideNav)
|
|
52
|
-
* @param {Function} getActivePage accepted, inert since 2026-08-09
|
|
53
54
|
* @param {ReactNode} header above the outlet on the plane
|
|
54
55
|
* @param {ReactNode} footer below the outlet on the plane
|
|
55
56
|
* @param {ReactNode} defaultTocContent the TOC rail's content when no page registers one
|
|
@@ -57,7 +58,7 @@ export const ShellTocCollapsedContext = createContext(null)
|
|
|
57
58
|
* @param {string} pageWash the plane's wash, a CSS colour (e.g. `'var(--kol-fg-02)'`)
|
|
58
59
|
* @param {boolean} bare plane + outlet only (default false)
|
|
59
60
|
*/
|
|
60
|
-
export default function PageLayout({ navTree = [],
|
|
61
|
+
export default function PageLayout({ navTree = [], header, footer, defaultTocContent, sideNav, pageWash, bare = false }) {
|
|
61
62
|
const [drawerOpen, setDrawerOpen] = useState(false)
|
|
62
63
|
const [tocContent, setTocContent] = useState(null)
|
|
63
64
|
const [tocCollapsed, setTocCollapsed] = useState(false)
|
|
@@ -75,11 +76,19 @@ export default function PageLayout({ navTree = [], getActivePage: _getActivePage
|
|
|
75
76
|
const effectiveTocContent = tocContent ?? defaultTocContent
|
|
76
77
|
const showToc = Boolean(effectiveTocContent) && !tocCollapsed
|
|
77
78
|
|
|
78
|
-
/*
|
|
79
|
-
|
|
79
|
+
/* ONE OWNER PER PIXEL (two-page-scaffolds-one-job, kol-client-olina
|
|
80
|
+
* 2026-09-03). The plane paints the wash and hands `--kol-shell-page-wash:
|
|
81
|
+
* transparent` down: the variable means WHAT IS LEFT TO PAINT, so a
|
|
82
|
+
* PageShell — or any page root that reads it — inside this frame paints
|
|
83
|
+
* nothing over the plane. BrandLayout's line set the wash on the plane AND
|
|
84
|
+
* painted it, so a nested PageShell painted it again: `fg-02` rendered as two
|
|
85
|
+
* 0.02 layers, measured on olina's /slide-deck, the one page beside twenty
|
|
86
|
+
* `.kol-page` siblings that came out darker. kol-shell's AppShell keeps its
|
|
87
|
+
* own model (the wrapper paints the back, PageShell paints the wash — one
|
|
88
|
+
* paint there too). */
|
|
80
89
|
const plane = {
|
|
81
|
-
'--kol-
|
|
82
|
-
|
|
90
|
+
background: pageWash ?? 'var(--kol-surface-primary)',
|
|
91
|
+
'--kol-shell-page-wash': 'transparent',
|
|
83
92
|
}
|
|
84
93
|
|
|
85
94
|
if (bare) {
|