rahman-resources 1.9.2 → 1.10.0

package/lib/manifest.json

@@ -1,6 +1,5 @@
 {
   "version": 2,
-  "generatedAt": "2026-05-31T10:45:23.016Z",
   "repo": "rahmanef63/resource-site",
   "branch": "main",
   "layouts": [
@@ -421,20 +420,20 @@
       "title": "Notion Page Clone OS — localStorage demo (pointer to open-silong for production)",
       "category": "website-template",
       "status": "stable",
-      "description": "localStorage-only DEMO of a Notion-clone surface — tree-structured sidebar + page editor + embedded databases. Built from rr's notion-shell wrappers (NotionSidebar / NotionPage / NotionBlock / NotionDatabase) + notion-blocks primitives (equation / code / notify / drag-fill grid) + createTemplateStore (localStorage + BroadcastChannel). No Convex, no auth, no multi-user — drop-in starter for evaluating the UI or embedding a Notion-style editor in your own project. **For the production-grade Convex-backed product (multi-workspace + auth + sharing + comments + snapshots + MCP), use the open-source open-silong repo: https://github.com/rahmanef63/open-silong (silong.rahmanef.com).** This rr template is the DEMO; the github repo is the PRODUCT.",
-      "source": "synthesized + notion-shell wrappers + notion-blocks bundle; production stack at github.com/rahmanef63/open-silong",
+      "description": "localStorage-only DEMO of a Notion-clone surface — tree-structured sidebar + page editor + embedded databases. It is the COMBINATION of independently-reusable rr slices: notion-sidebar (tree nav + page CRUD — double-click rename, drag-reorder/reparent, icon picker), notion-shell (NotionPage / NotionBlock page editor — code + equation blocks built-in), notion-database (11 views + drag-fill grid + relation/rollup), image-picker (one-button image/wallpaper chooser — gallery / upload / link / Unsplash + reposition, wired to the files slice + an /api/unsplash proxy; here it's the page cover), icon-picker, and files — glued by createTemplateStore (localStorage + BroadcastChannel). No Convex, no auth, no multi-user — drop-in starter for evaluating the UI or embedding a Notion-style editor in your own project. **For the production-grade Convex-backed product (multi-workspace + auth + sharing + comments + snapshots + MCP), use the open-source open-silong repo: https://github.com/rahmanef63/open-silong (silong.rahmanef.com).** This rr template is the DEMO; the github repo is the PRODUCT.",
+      "source": "synthesized + notion-shell wrappers (built-in code/equation); production stack at github.com/rahmanef63/open-silong",
       "repoPath": "app/preview/notion-page-clone-os",
       "pullPaths": [
         "app/preview/notion-page-clone-os",
         "components/templates/_shared",
         "components/templates/notion-page-clone",
-        "frontend/slices/notion-blocks",
+        "frontend/slices/notion-sidebar",
         "frontend/slices/notion-shell",
+        "frontend/slices/notion-database",
+        "frontend/slices/image-picker",
+        "frontend/slices/files",
         "frontend/slices/icon-picker",
-        "frontend/slices/equation",
-        "frontend/slices/code-block",
-        "frontend/slices/notifications",
-        "frontend/slices/database-cell-selection"
+        "app/api/unsplash"
       ],
       "files": [
         "app/preview/notion-page-clone-os/public/layout.tsx",
@@ -453,6 +452,7 @@
         "components/templates/notion-page-clone/slices/admin/snippets/SnippetsView.tsx",
         "components/templates/notion-page-clone/slices/notion-app/Dashboard.tsx",
         "components/templates/notion-page-clone/slices/notion-app/DocView.tsx",
+        "components/templates/notion-page-clone/slices/notion-app/DocCover.tsx",
         "components/templates/notion-page-clone/slices/notion-app/DatabaseView.tsx",
         "components/templates/notion-page-clone/slices/notion-app/hooks.ts",
         "components/templates/notion-page-clone/slices/notion-app/block-renderers.tsx",
@@ -481,7 +481,7 @@
         "select",
         "dialog"
       ],
-      "agentRecipe": "Run `npx rr init <app> --template notion-page-clone-os`. Cascades notion-shell (wrappers) + notion-blocks (4 editor primitives) + icon-picker. Edit components/templates/notion-page-clone/shared/site-config.ts to set brand; seed.ts to bootstrap docs + databases. Sidebar CRUD already wired — hover a row → +/✎/🗑.",
+      "agentRecipe": "Run `npx rr init <app> --template notion-page-clone-os`. Cascades notion-shell (wrappers, built-in code/equation blocks) + notion-database + icon-picker. Edit components/templates/notion-page-clone/shared/site-config.ts to set brand; seed.ts to bootstrap docs + databases. Sidebar CRUD already wired — hover a row → +/✎/🗑.",
       "tags": [
         "template",
         "notion",
@@ -500,7 +500,7 @@
       "category": "website-template",
       "status": "stable",
       "description": "Marketing site for a SaaS product — landing, pricing, features, blog, changelog, about, contact — backed by a full admin panel (Pages, Posts, Pricing, Features, Customers, Subscriptions, Leads, Changelog, Settings). Same grouped Pages + Features sidebar pattern as every other template.",
-      "source": "synthesized + mdx-blog feature",
+      "source": "synthesized",
       "repoPath": "app/preview/saas-marketing-os",
       "pullPaths": [
         "app/preview/saas-marketing-os",
@@ -575,7 +575,7 @@
         "sheet",
         "textarea"
       ],
-      "agentRecipe": "Run `npx rr init <app> --template saas-marketing-os`. SaaS Marketing OS = public-only marketing template. Blog + changelog use MDX (add the mdx-blog feature). Edit components/templates/saas-marketing/shared/site-config.ts to set product name, tagline, pricing tiers, contact email.",
+      "agentRecipe": "Run `npx rr init <app> --template saas-marketing-os`. SaaS Marketing OS = public-only marketing template. Edit components/templates/saas-marketing/shared/site-config.ts to set product name, tagline, pricing tiers, contact email.",
       "tags": [
         "template",
         "saas",
@@ -1357,11 +1357,75 @@
   ],
   "recipes": [],
   "features": [
+    {
+      "slug": "image-editor",
+      "title": "Image Editor — Photoshop-style canvas (Konva)",
+      "category": "ui",
+      "description": "A Photoshop-style raster image editor built on Konva. Layers panel (reorder, opacity, visibility, lock, 16 blend modes), free transform (move/scale/rotate/flip via a Transformer), image + text + shape + paint layers, brush & eraser with size/opacity/hardness, non-destructive adjustments + filters (brightness/contrast/hue/saturation/blur/grayscale/invert/sepia, applied via Konva.Filters), canvas resize/aspect presets, and Photoshop-style LAYER STYLES: stroke, drop shadow (angle/distance/size/opacity), outer glow, clipping mask (clip to layer below), per-layer blend mode. One-click BACKGROUND REMOVAL runs fully in-browser via @imgly/background-removal (free, MIT, no API key, no server — downloads a small ONNX model to the browser cache on first use) and drops the cutout back as a transparent layer. Undo/redo, zoom/pan, keyboard shortcuts, and PNG/JPG/WebP export at 1×/2×/3×. Self-contained: image I/O is via props (initialImage / onSave) so it drops into any app with zero backend.",
+      "source": "rahmanef63/os-vps",
+      "install": "npx rahman-resources add image-editor",
+      "npmPackages": [],
+      "exampleCode": "\"use client\";\nimport { ImageEditor } from \"@/features/image-editor\";\n\nexport default function ImageEditorDemo() {\n  // No props → opens a blank 1080×1080 canvas with one paint layer. Brush/erase,\n  // add text/shapes, open an image + remove its background (free, in-browser),\n  // apply layer styles + filters, then export PNG/JPG/WebP. Konva stage is\n  // client-only (loaded via next/dynamic) so SSR never touches canvas/window.\n  return (\n    <div className=\"h-dvh w-full\">\n      <ImageEditor onSave={(dataUrl) => console.log(\"save\", dataUrl.slice(0, 32))} />\n    </div>\n  );\n}",
+      "agentRecipe": "Stack: Next 16 + React 19 + Tailwind 4 + shadcn/ui + Konva. A layered raster image editor. Image I/O is via props; background removal runs in-browser (no backend).\n\nSTEP 1 — Install. `npx rr add image-editor`. Ensure `@/features/image-editor` resolves in tsconfig paths and Tailwind scans the slice folder.\n\nSTEP 2 — Deps. npm: `konva react-konva @imgly/background-removal lucide-react`. shadcn: `npx shadcn@latest add button input slider select tabs scroll-area separator tooltip label switch popover`.\n\nSTEP 3 — Mount. It is fully self-contained; the Konva stage is loaded client-only (next/dynamic ssr:false) inside the slice, so just render it in a height-bearing box:\n```tsx\n\"use client\";\nimport { ImageEditor } from \"@/features/image-editor\";\nexport default function Page() {\n  return (\n    <div className=\"h-dvh\">\n      <ImageEditor onSave={(dataUrl) => console.log(dataUrl)} />\n    </div>\n  );\n}\n```\nProps: `initialImage?` (data/object/remote URL opened on mount), `width?`/`height?` (blank canvas size, default 1080²), `onSave?(dataUrl)` (fires from the Save button with a PNG data URL; omit to hide Save), `className?`.\n\nSTEP 4 — Background removal. The \"Remove BG\" button calls removeImageBackground() from @imgly/background-removal — free, in-browser, no key. First run downloads a small model to the browser cache, then runs locally via WASM. You can also import `removeImageBackground(src) => Promise<pngDataUrl>` directly.\n\nSTEP 5 — Export. PNG/JPG/WebP at 1×/2×/3× via the Export tab, or call `exportStage(stage, {...})` / `stageToDataURL(stage, {...})`. The container owns the box — render inside h-dvh / h-full.",
+      "tags": [
+        "image-editor",
+        "photoshop",
+        "canvas",
+        "konva",
+        "layers",
+        "filters",
+        "background-removal",
+        "paint",
+        "crop",
+        "ui"
+      ]
+    },
+    {
+      "slug": "file-explorer",
+      "title": "File Explorer — Tree + CRUD + Breadcrumb",
+      "category": "ui",
+      "description": "A complete, portable file-directory explorer: a collapsible folder TREE sidebar (lazy-loaded per dir), a responsive BREADCRUMB that auto-collapses to a dropdown, grid + list views with sort, multi-select, a right-click context menu, drag-and-drop (internal move + external file/folder upload), inline rename, and full CRUD (new folder, rename, cut/copy/paste, move, delete/trash, empty trash). The filesystem backend is INJECTED via a small FileExplorerAdapter (list/mkdir/remove/move/copy/upload/usage/rawUrl) — point it at a real API or use the bundled createMockAdapter() (a writable in-memory tree) so it works with zero backend. Opening a file fires an onOpenFile(path, entry) callback you wire to your own viewer/editor. Self-contained: imports only @/components/ui/* + @/lib/utils. Ported from os-vps (Topside) files manager. Pairs with appshell as the file-dir counterpart to a notion-style sidebar.",
+      "source": "rahmanef63/os-vps",
+      "install": "npx rahman-resources add file-explorer",
+      "npmPackages": [],
+      "exampleCode": "\"use client\";\nimport { FileExplorer } from \"@/features/file-explorer\";\n\nexport default function FileExplorerDemo() {\n  // No adapter prop → uses the backend from lib/backend.ts (mock by default):\n  // a writable in-memory tree, so create/rename/delete/move/upload all work with\n  // no backend. Flip FILE_EXPLORER_BACKEND to \"live\"/\"convex\" in that one file to\n  // go real — nothing here changes. Pass adapter={…} to override per-instance.\n  return (\n    <div className=\"h-dvh w-full\">\n      <FileExplorer\n        rootLabel=\"Files\"\n        onOpenFile={(path, entry) => console.log(\"open file\", entry.name, path)}\n      />\n    </div>\n  );\n}",
+      "agentRecipe": "Stack: Next 16 + React 19 + Tailwind 4 + shadcn/ui. The slice is self-contained — imports only @/components/ui/* + @/lib/utils (cn). The filesystem backend is injected; nothing is hardcoded.\n\nSTEP 1 — Install. `npx rr add file-explorer`. Ensure `@/features/file-explorer` resolves in tsconfig paths and Tailwind's content globs scan the slice folder.\n\nSTEP 2 — shadcn + npm. `npx shadcn@latest add button input scroll-area separator dropdown-menu sheet`. npm: lucide-react.\n\nSTEP 3 — Mount it. Drop it in with NO adapter prop — it falls back to the backend configured in lib/backend.ts (the writable in-memory mock by default), so it works out of the box with realistic seed data and full CRUD:\n```tsx\n\"use client\";\nimport { FileExplorer } from \"@/features/file-explorer\";\nexport default function Page() {\n  return (\n    <div className=\"h-dvh\">\n      <FileExplorer rootLabel=\"Files\" onOpenFile={(path) => console.log(\"open\", path)} />\n    </div>\n  );\n}\n```\n\nSTEP 4 — The backend switch (ONE file). Go to a real filesystem without touching any component: edit `slices/file-explorer/lib/backend.ts` and set `FILE_EXPLORER_BACKEND = \"mock\" | \"live\" | \"convex\"` (or set env `NEXT_PUBLIC_FILE_EXPLORER_BACKEND`). \"live\" = REST host fs (os-vps /api/v1/fs shape, base via NEXT_PUBLIC_FILES_API_URL — see adapter/live.ts). \"convex\" = self-hosted Convex fs functions, PREPARED but inert until you wire your generated client + api in the switch (see adapter/convex.ts; the slice imports nothing from @convex so the build stays green even without Convex). You can still pass `adapter={…}` to override per-instance.\n\nSTEP 5 — Custom adapter. Implement FileExplorerAdapter: { mode: \"live\"|\"mock\"|\"readonly\", list(path), mkdir(path), remove(path), move(from,to), copy(from,to), upload(dest,files), usage(), rawUrl(path), write?(path,content) }. `list` returns { path, entries:[{name,kind,size,ext?}], roots?, parent? }. Set mode:\"readonly\" to show an inline notice instead of mutating. `rawUrl(path)` returns a bytes URL for image thumbnails (return \"\" to fall back to icons).\n\nThe container owns the box — render <FileExplorer> inside something with a height (h-dvh / h-full). It self-provides its adapter context; no extra provider needed.",
+      "tags": [
+        "files",
+        "file-manager",
+        "explorer",
+        "tree",
+        "breadcrumb",
+        "crud",
+        "sidebar",
+        "ui"
+      ]
+    },
+    {
+      "slug": "appshell",
+      "title": "AppShell — Desktop + Mobile OS Shell",
+      "category": "ui",
+      "description": "Generic, brand-free OS-style shell framework. One <AppShell manifest> wrapper provider gives a project a macOS-style window manager (drag/snap/maximize, dock, menu bar, Spotlight) AND an iOS-style mobile surface (home pager, app library, control center, widgets), driven entirely by a manifest: brand, apps, features, surface regions, capabilities, persistence, keymap. Five shell features (search, inspector, notifications, control-center, widgets) are bundled as defineFeature() contributions inside the slice and mount via named <Slot>s. Responsiveness is a single ResponsiveProvider + 4 DRY primitives (AppFrame, MasterDetail, ResponsiveToolbar, TouchList). Imports nothing project-specific — the consumer injects data/auth/AI through manifest.capabilities. Lifted from os-vps (Topside).",
+      "source": "rahmanef63/os-vps",
+      "install": "npx rahman-resources add appshell",
+      "npmPackages": [],
+      "exampleCode": "// ════════ VARIANT A — simplest: no URL sync (app/page.tsx) ════════\n// Mount AppShell full-bleed. Verified-working shape.\n\"use client\";\n\nimport { FileText } from \"lucide-react\";\nimport {\n  AppShell,\n  searchFeature,\n  inspectorFeature,\n  notificationsFeature,\n  controlCenterFeature,\n  widgetsFeature,\n  type ShellManifest,\n} from \"@/features/appshell\";\nimport \"@/features/appshell/appshell.css\"; // REQUIRED — the shell's theme tokens\n\n// Your app. It receives { payload } (whatever opened the window).\nfunction NotesApp({ payload }: { payload?: unknown }) {\n  return (\n    <div className=\"h-full bg-background p-4 text-sm\">\n      Your app UI here. payload: {String(payload ?? \"—\")}\n    </div>\n  );\n}\n\n// ⚠ Capability hooks MUST return STABLE references (module-level / useMemo),\n// or Spotlight's search effect loops forever. Define once, return the same ref.\nconst NOOP = () => {};\nconst APPEARANCE = {\n  theme: \"light\" as const,\n  setTheme: NOOP, // wire to your theme store; also toggle `.dark` on <html>\n  device: \"auto\" as const,\n  wallpaper: \"aurora\",\n};\n\nconst manifest: ShellManifest = {\n  brand: { name: \"My OS\", logo: \"▲\", idleAppName: \"Finder\" },\n  apps: [\n    {\n      id: \"notes\",\n      title: \"Notes\",\n      icon: FileText,\n      gradient: \"linear-gradient(160deg,#ffd34d,#ff9a3d)\",\n      defaultSize: { w: 560, h: 380 },\n      multi: true, // several Notes windows at once\n      load: async () => ({ default: NotesApp }),\n    },\n    // add more apps = add more entries (each lazy-loads its own bundle)\n  ],\n  features: [\n    searchFeature,\n    inspectorFeature,\n    notificationsFeature,\n    controlCenterFeature,\n    widgetsFeature,\n  ],\n  routing: false, // set true ONLY if you add app/[[...slug]]/page.tsx (notFound _next)\n  capabilities: {\n    useAppearance: () => APPEARANCE,\n    useCpuPercent: () => null,\n    // optional, all must be stable refs:\n    // useSearch: () => myStableSearchFn,   // (q) => Promise<SearchHit[]>\n    // useSystemStats: () => myStatsOrNull,\n    // useChat: () => myStableChatFn,\n    // useServerToggle: () => myToggleOrNull,\n  },\n};\n\nexport default function Page() {\n  return <AppShell manifest={manifest} />;\n}\n\n// ════════ VARIANT B — addressable URLs (deep-link /notes, back/forward) ════════\n// Same manifest as A, but: DROP `routing: false` (default is ON) and give each\n// app a `slug`. Mount from a CATCH-ALL route instead of app/page.tsx. The dock\n// uses History-API URL sync (window.history, NOT router.push) — handled inside\n// the slice; you only provide the catch-all route below.\n\n// 1) components/shell.tsx — the client mount (apps carry slugs, routing left ON)\n\"use client\";\nimport { FileText } from \"lucide-react\";\nimport {\n  AppShell, searchFeature, inspectorFeature, notificationsFeature,\n  controlCenterFeature, widgetsFeature, type ShellManifest,\n} from \"@/features/appshell\";\nimport \"@/features/appshell/appshell.css\";\n\nfunction NotesApp({ payload }: { payload?: unknown }) {\n  return <div className=\"h-full bg-background p-4 text-sm\">Notes · {String(payload ?? \"—\")}</div>;\n}\nconst NOOP = () => {};\nconst APPEARANCE = { theme: \"light\" as const, setTheme: NOOP, device: \"auto\" as const, wallpaper: \"aurora\" };\n\nconst manifest: ShellManifest = {\n  brand: { name: \"My OS\", logo: \"▲\", idleAppName: \"Finder\" },\n  apps: [\n    {\n      id: \"notes\",\n      slug: \"notes\", // deep-link: /notes focuses (or opens) this app\n      title: \"Notes\",\n      icon: FileText,\n      gradient: \"linear-gradient(160deg,#ffd34d,#ff9a3d)\",\n      defaultSize: { w: 560, h: 380 },\n      multi: true,\n      load: async () => ({ default: NotesApp }),\n    },\n  ],\n  features: [searchFeature, inspectorFeature, notificationsFeature, controlCenterFeature, widgetsFeature],\n  // routing omitted => defaults TRUE => focused app + launch path mirror to the URL\n  capabilities: { useAppearance: () => APPEARANCE, useCpuPercent: () => null },\n};\n\nexport function Shell() {\n  return <AppShell manifest={manifest} />;\n}\n\n// 2) app/[[...slug]]/page.tsx — ONE optional catch-all (server). No per-app pages;\n//    the window manager stays client-side, only the URL is mirrored.\nimport { notFound } from \"next/navigation\";\nimport { Shell } from \"@/components/shell\";\n\nexport async function generateMetadata({ params }: { params: Promise<{ slug?: string[] }> }) {\n  const { slug } = await params;\n  return { title: slug?.[0] ? `${slug[0]} — My OS` : \"My OS\" };\n}\n\nexport default async function Page({ params }: { params: Promise<{ slug?: string[] }> }) {\n  const { slug } = await params;\n  // ⚠ MUST notFound() reserved paths: a missing /_next/* chunk has to 404 — else\n  // this catch-all returns the app HTML with 200 (wrong MIME, no client recovery).\n  if (slug?.[0] === \"_next\") notFound();\n  return <Shell />;\n}",
+      "agentRecipe": "Stack required: Next 16 (App Router) + React 19 + Tailwind 4 + shadcn/ui. The slice is self-contained — it imports only @/components/ui/* + @/lib/utils (cn); everything project-specific arrives via the manifest. Follow ALL steps; the ⚠ ones are where installs break.\n\nSTEP 1 — Install. `npx rr add appshell` (alias `npx rahman-resources add appshell`). It copies to your slices dir. Ensure `@/features/appshell` resolves in tsconfig paths (point it at that dir), and that Tailwind's content globs SCAN the slice folder (else the shell renders unstyled).\n\nSTEP 2 — shadcn + npm deps. Add any missing shadcn primitives: `npx shadcn@latest add button tooltip scroll-area sheet drawer dialog alert-dialog dropdown-menu`. npm: lucide-react class-variance-authority clsx tailwind-merge vaul.\n\nSTEP 3 — ⚠ Theme. Import the slice's tokens ONCE in the root layout: `import \"@/features/appshell/appshell.css\"`. These are the glass/dock/window/wallpaper CSS variables the shell needs — they are NOT shadcn defaults, so skipping this = an unstyled, broken-looking shell. It pairs with your shadcn tokens (--background etc.). Dark mode = toggle the `.dark` class on <html> (appshell.css ships light + dark).\n\nSTEP 4 — Mount full-bleed. Render <AppShell manifest={manifest} /> from a CLIENT component that owns one full viewport (the page is h-dvh w-screen / the root). AppShell auto-picks the macOS desktop on wide viewports and the iOS surface on narrow — you write nothing extra for mobile.\n\nSTEP 5 — Build the ShellManifest:\n• brand: { name, logo (string or ReactNode), idleAppName?, wallpaper?: \"aurora\"|\"dusk\"|\"mist\"|\"noir\" }.\n• apps: AppDescriptor[] — { id, title, icon (a lucide-react icon component), gradient (a CSS gradient string for the glossy icon), load: async () => ({ default: YourAppComponent }), slug?, defaultSize?: {w,h}, multi?: true (spawn a new window per open, e.g. a file manager), noDock?: true }. Your app component receives props { payload }.\n• features: the fastest path is `features: DEFAULT_FEATURES` — the bundled default system-feature set (all five, generic + brand-free) exported from \"@/features/appshell\". Or import individually and list only what you want: searchFeature (⌘K Spotlight), inspectorFeature (⌘I AI/context panel), notificationsFeature (toasts + iOS dynamic island), controlCenterFeature (iOS control center), widgetsFeature (iOS Today widgets). The surfaces are slot-driven, so spreading/trimming DEFAULT_FEATURES just mounts/omits a feature — `features: [...DEFAULT_FEATURES.filter(f => f.id !== \"widgets\")]`.\n• capabilities: ShellCapabilities — your data/auth/AI injection seam. useAppearance() and useCpuPercent() are REQUIRED; useSearch/useSystemStats/useChat/useServerToggle are optional (defaults degrade gracefully). ⚠ CRITICAL: every capability hook MUST return a REFERENTIALLY STABLE value — a module-level const, or useMemo/useCallback. Returning a fresh object/closure each render makes Spotlight's search effect re-fire forever (\"Maximum update depth exceeded\"). e.g. define APPEARANCE once at module scope and `useAppearance: () => APPEARANCE`.\n• persistKey?: localStorage namespace for the saved window layout (default \"appshell:layout\").\n• routing?: defaults TRUE — it mirrors the focused app to the URL via the History API (window.history, NOT router.push). ⚠ If true you MUST add a catch-all route `app/[[...slug]]/page.tsx` that renders the mount AND calls notFound() for reserved paths (slug[0] === \"_next\"), or missing chunks return wrong-MIME 200s. SIMPLEST first install: set `routing: false` to skip the catch-all entirely.\n\nExtending: add an app = one manifest entry; add a shell feature = a new defineFeature({id, slots}) listed in features[]. No surface edits ever (open/closed). exampleCode ships BOTH variants: Variant A = routing:false mount in app/page.tsx (simplest); Variant B = catch-all app/[[...slug]]/page.tsx with routing on + app slugs for addressable, deep-linkable URLs (the catch-all MUST notFound() \"_next\").",
+      "tags": [
+        "shell",
+        "window-manager",
+        "desktop",
+        "mobile",
+        "responsive",
+        "framework",
+        "ui"
+      ]
+    },
     {
       "slug": "convex-auth",
       "title": "Convex Auth — Multi-Provider Sign-in",
       "category": "auth",
-      "description": "@convex-dev/auth with Password (PBKDF2-SHA256 100k, self-hosted-friendly), Anonymous (guest), Google OAuth, and Resend magic-link. Ships a production SignInPage with i18n, prop-driven provider list, and split Login/Register tabs. No Clerk.",
+      "description": "@convex-dev/auth with Password (PBKDF2-SHA256 100k, self-hosted-friendly), Anonymous (guest), Google OAuth, and Resend magic-link. Ships a production SignInPage plus a presentational, props-driven AuthCard (v0.3) — choose `methods` (google, github, magic-link, password signin/signup tabs, phone OTP, anonymous) and render the card anywhere with different props; handlers default to a mock so it's interactive with zero wiring. i18n via labels. No Clerk.",
       "source": "rahmanef63/resource-site",
       "docsUrl": "https://labs.convex.dev/auth",
       "install": "npm i @convex-dev/auth @auth/core resend",
@@ -1429,7 +1493,7 @@
       "slug": "resend-newsletter",
       "title": "Resend — Transactional & Newsletter",
       "category": "email",
-      "description": "Transactional email + newsletter blast via Resend. Double opt-in flow + audience segmentation. Magic-link delivery for Convex Auth.",
+      "description": "Transactional email + newsletter blast via Resend. Double opt-in flow + audience segmentation. Magic-link delivery for Convex Auth. Bundles the subscribers list backend (subscribe / confirm / unsubscribe / count) — formerly the standalone `subscribers` slice, merged here in v0.1.3.",
       "source": "rahmanef63/resource-site",
       "docsUrl": "https://resend.com/docs",
       "install": "npm i resend react-email @react-email/components",
@@ -1579,29 +1643,6 @@
         "rag"
       ]
     },
-    {
-      "slug": "mdx-blog",
-      "title": "MDX Blog",
-      "category": "content",
-      "description": "Markdown-with-JSX untuk blog post. File-based MDX content collection. Portable defineMdxBlog(opts) factory dengan 4 config props (basePath, contentDir, labels.list, nav) — defaults preserve legacy /blog + content/blog. Auto-generate ToC, reading-time, syntax highlight, plus embed React components inline.",
-      "source": "rahmanef63/resource-site",
-      "docsUrl": "https://github.com/hashicorp/next-mdx-remote",
-      "install": "npm i next-mdx-remote rehype-pretty-code remark-gfm reading-time",
-      "npmPackages": [
-        "next-mdx-remote",
-        "rehype-pretty-code",
-        "remark-gfm",
-        "reading-time"
-      ],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add mdx-blog`. Store post body sebagai markdown di content/blog/*.mdx. Render dengan MDXRemote di [slug]/page.tsx. Auto-extract headings ke ToC via remark plugin custom.",
-      "tags": [
-        "content",
-        "blog",
-        "mdx",
-        "static"
-      ]
-    },
     {
       "slug": "cal-com-booking",
       "title": "Cal.com Booking",
@@ -1622,25 +1663,6 @@
         "bookings"
       ]
     },
-    {
-      "slug": "full-width-toggle",
-      "title": "Full Width Toggle",
-      "category": "ui",
-      "description": "Page-container width toggle (contained / wide / full). Per-device localStorage + cross-tab sync. Ships useFullWidth hook + FullWidthToggle button (icon/button/segment variants) + WidthContainer wrapper. Zero backend, zero env.",
-      "source": "rahmanef63/resource-site",
-      "docsUrl": "",
-      "install": "",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add full-width-toggle`. Drop <WidthContainer> around page content, <FullWidthToggle variant='icon' /> in topbar. Variant 'segment' best for settings page. Hook useFullWidth() returns [mode, setMode, cycle]. SSR-safe — defaults to 'contained' until hydrate.",
-      "tags": [
-        "ui",
-        "layout",
-        "preference",
-        "localstorage",
-        "dashboard"
-      ]
-    },
     {
       "slug": "command-menu",
       "title": "Command Menu",
@@ -1767,20 +1789,43 @@
     },
     {
       "slug": "rbac-roles",
-      "title": "RBAC — Tiered System Roles",
+      "title": "RBAC — Roles & Permissions",
       "category": "auth",
-      "description": "Workspace-scoped RBAC with 6 system roles (owner/admin/manager/staff/client/guest) and three tier presets — solo, influencer, organization. Env-based platform admin bypass via PLATFORM_ADMIN_EMAILS. checkPermission / requirePermission helpers, role seeding mutation, @convex-dev/auth aware (no Clerk).",
+      "description": "RBAC engine ported from superspace. 6 system role presets (owner/admin/manager/staff/client/guest with levels), dot-namespaced permissions with `*` / `feature.*` wildcard matching, and pure check helpers (resolvePermissions / hasPermission / roleHasPermission). Props-driven UI primitives: <PermissionGate>, usePermissions, <RoleBadge>, <PermissionMatrix>. Convex template ships a tenant-scoped rbac_roles table + checkPermission / requirePermission helpers + idempotent seedSystemRoles, with a PLATFORM_ADMIN_EMAILS superadmin bypass. Pair with `user-management` for the members / invites / roles-admin UI. @convex-dev/auth aware — no Clerk.",
       "source": "superspace",
       "install": "npx rahman-resources add rbac-roles",
       "npmPackages": [],
       "exampleCode": "",
-      "agentRecipe": "Run `npx rr add rbac-roles`. Three tier presets pick which system roles to seed: solo (owner+admin), influencer (+manager), organization (6 roles). Platform admin via env PLATFORM_ADMIN_EMAILS bypasses all checks. Resolution: platform admin → workspace owner → membership.additionalPermissions → role.permissions.",
+      "agentRecipe": "Run `npx rr add rbac-roles`. Frontend: import { PermissionGate, usePermissions, RoleBadge, PermissionMatrix, resolvePermissions, ROLE_PRESETS } from \"@/features/rbac-roles\". Feed usePermissions/PermissionGate the actor's resolved permission list (from your membership query or resolvePermissions(roleSlug)). Convex: spread rbacRolesTables into your schema, call seedSystemRoles({tenantId}) once, gate privileged fns with requirePermission(ctx, tenantId, \"members.manage\"). Set PLATFORM_ADMIN_EMAILS for superadmins. Add the user-management slice for the members/invites UI (provides um_members).",
       "tags": [
         "rbac",
         "auth",
         "permissions",
         "roles",
-        "workspaces"
+        "authorization",
+        "no-clerk",
+        "convex"
+      ]
+    },
+    {
+      "slug": "user-management",
+      "title": "User Management",
+      "category": "auth",
+      "description": "Full superspace-parity user management, props-driven + RBAC-agnostic. <UserManagementPanel> tabs Members + Roles + Teams + Access: member table (search / filter / sort, inline role dropdown, soft-remove), InviteDialog (with an optional 'propagate to sub-workspaces' toggle — same / step-down role strategy) + PendingInvites, a RolesPanel (custom roles via permission matrix; system roles read-only), a TeamsPanel (named user groups), and an AccessMatrix (users × tenants grid with inline role assignment). All permission-gated. You pass `roles` + `currentPerms` + the permission catalog (resolved from rbac-roles) + callbacks; the slice imports no other slice's frontend. Convex ships um_members + um_invites + um_teams + um_team_members + um_tenant_links + member / invite / team / hierarchy endpoints + getAccessMatrix (gated via rbac-roles' requirePermission); roles CRUD reuses rbac-roles'. The hierarchy is a generic edge tree — rr never owns the tenant entities. P0–P4c: the complete user-management epic.",
+      "source": "superspace",
+      "install": "npx rahman-resources add user-management",
+      "npmPackages": [],
+      "exampleCode": "",
+      "agentRecipe": "Run `npx rr add user-management` (pulls rbac-roles + convex-auth). Frontend: <MembersPanel members={useQuery(api[\"features/user-management/query\"].listMembers,{tenantId})} roles={ROLE_PRESETS.map(r=>({slug:r.slug,name:r.name,color:r.color}))} currentPerms={actorPerms} onUpdateRole={useMutation(...updateMemberRole)} onRemove={useMutation(...removeMember)} onInvite={openInvite} />. Wire roles + currentPerms from rbac-roles at the app level — the slice itself imports no other slice. Convex: spread userManagementTables; listMembers/mutations gate via rbac-roles requirePermission.",
+      "tags": [
+        "user-management",
+        "members",
+        "rbac",
+        "auth",
+        "team",
+        "admin",
+        "convex",
+        "no-clerk"
       ]
     },
     {
@@ -1864,64 +1909,6 @@
         "personal-brand"
       ]
     },
-    {
-      "slug": "i18n-translate",
-      "title": "i18n — Google Translate widget",
-      "category": "ui",
-      "description": "Drop-in Google Translate widget. Replaces hand-maintained locale dictionaries with on-the-fly translation to a curated locale list (16 default, prop-override). No API key, no Google Cloud billing. Auto-detect browser language on first visit, persist user choice via localStorage, click-to-reload language switching with router-refresh + in-place fallback strategies. Lifted 2026-05-27 from rahmanef.com; 510-LOC monolith split into 8 sub-files for the 200-LOC cap; project-specific Tailwind utilities stripped from defaults.",
-      "source": "rahmanef.com",
-      "install": "npx rahman-resources add i18n-translate",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add i18n-translate`. Mount `<GoogleTranslate />` anywhere (e.g. header). Add the CSP allowlist from README.md to your middleware/proxy — without it Google's script fails silently. Override `languages`, `storageKey`, and the four `*ClassName` props for per-project styling. Default `fallbackRefresh=\"reload\"` is the only path that works reliably across Next Cache Components — only opt into `\"router\"` or `\"none\"` if you've tested it on your tree.",
-      "tags": [
-        "i18n",
-        "translate",
-        "google-translate",
-        "ui",
-        "language-switcher",
-        "locale",
-        "widget"
-      ]
-    },
-    {
-      "slug": "cta",
-      "title": "Call to Action",
-      "category": "ui",
-      "description": "Brutalist call-to-action section — eyebrow label, serif headline, body, arrow CTA. Pair with CtaButton standalone for inline placements. Lifted 2026-05-16 from rahmanef.com; assumes Tailwind tracking-brutal / tracking-brutal-sm utilities OR drop them for the default tracking scale.",
-      "source": "rahmanef.com",
-      "install": "npx rahman-resources add cta",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add cta`. <CtaView eyebrow title body href ctaLabel /> renders the full section; <CtaButton href label /> drops a standalone arrow button anywhere. Override tracking-brutal utilities in tailwind.config or swap for tracking-wide if your design system has no brutal preset.",
-      "tags": [
-        "ui",
-        "marketing",
-        "cta",
-        "section",
-        "brutalist"
-      ]
-    },
-    {
-      "slug": "hero",
-      "title": "Hero",
-      "category": "ui",
-      "description": "Editorial split-grid landing hero — eyebrow pill + large serif H1 + italic pull-quote + 1-2 button CTA row + right-column portrait card with optional caption. Fully props-driven (title/quote/ctas/image). Sanitized from rahmanef.com on 2026-05-16: SITE_CONFIG hardcode dropped, custom Heading/Section primitives replaced with raw semantic elements + stock Tailwind tracking-widest so the slice ships without consumer preset utilities.",
-      "source": "rahmanef.com",
-      "install": "npx rahman-resources add hero",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add hero`. <HeroView title eyebrow quote ctas image imageCaption /> — all props optional except title. Pass `image={undefined}` for text-only hero (auto-collapses to single 12-column row). Pairs visually with cta slice (same brutalist border + serif scale).",
-      "tags": [
-        "ui",
-        "hero",
-        "marketing",
-        "landing",
-        "section",
-        "editorial",
-        "brutalist"
-      ]
-    },
     {
       "slug": "rate-limit",
       "title": "Rate Limit",
@@ -1940,24 +1927,6 @@
         "throttle"
       ]
     },
-    {
-      "slug": "subscribers",
-      "title": "Subscribers",
-      "category": "email",
-      "description": "Newsletter list with honeypot + per-email rate-limit + token-based unsubscribe + admin remove. Public `subscribe` returns status strings (`created` / `already` / `resubscribed` / `honeypot`); admin `listAll` / `count` queries gated by `requireAdmin` (rr `_shared/auth`). Lifted 2026-05-16 from rahmanef.com; sanitized: token args dropped, sibling `analyticsEvents` insert removed — wrap subscribe in a consumer action if you want funnel telemetry.",
-      "source": "rahmanef.com",
-      "install": "npx rahman-resources add subscribers",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add subscribers`. Compose `subscribersTables` into root convex/schema.ts. Public form posts `api.features.subscribers.mutations.subscribe({ email, source, website })` — `website` is the honeypot, leave it `\"\"` from the form. Render unsubscribe link `/unsubscribe?t=<token>` and call `unsubscribe({ token })`.",
-      "tags": [
-        "email",
-        "newsletter",
-        "subscribers",
-        "convex",
-        "backend"
-      ]
-    },
     {
       "slug": "testimonials",
       "title": "Testimonials",
@@ -1995,25 +1964,6 @@
         "agency"
       ]
     },
-    {
-      "slug": "socials",
-      "title": "Socials",
-      "category": "content",
-      "description": "Single source of truth for profile/social links. Powers JSON-LD `Person.sameAs` (Google entity graph), IndieWeb `<link rel=\"me\">` tags, and footer/contact/about UI surfaces. URL-deduped, ordered, `visible` / `featured` / `relMe` / `sameAs` flags. Lifted 2026-05-16 from rahmanef.com; token-based admin gate swapped, baked-in 14-platform rahmanef seed dropped — `seed` now takes items via args so each adopter ships their own list.",
-      "source": "rahmanef.com",
-      "install": "npx rahman-resources add socials",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add socials`. Compose `socialsTables` into root schema. Bootstrap with `npx convex run internal.features.socials.mutations.seed '{\"items\":[{\"platform\":\"github\",\"url\":\"https://github.com/<you>\",\"order\":1,\"visible\":true,\"featured\":true,\"sameAs\":true,\"relMe\":true}]}'`. Wire `useQuery(api.features.socials.queries.listVisible)` into footer for entity-graph SEO.",
-      "tags": [
-        "content",
-        "socials",
-        "seo",
-        "indieweb",
-        "convex",
-        "backend"
-      ]
-    },
     {
       "slug": "create-your-mcp",
       "title": "Create Your MCP",
@@ -2110,7 +2060,7 @@
       "slug": "comments",
       "title": "Comments — Threaded",
       "category": "content",
-      "description": "Polymorphic-target threaded comments. Consumer picks `TargetRef = { kind, id, subId? }` (e.g. page+block, blog+slug, task+id). Renderless <CommentsThread> + <CommentsAnchor> wrappers. useComments(bindings, opts) hook returns items + openCount + CRUD + forbiddenWords guard. Adapter pattern — see contract-negotiations §1.",
+      "description": "Polymorphic-target threaded comments. Consumer picks `TargetRef = { kind, id, subId? }` (e.g. page+block, blog+slug, task+id). Reply nesting is real: `parentId` end-to-end + `buildThread(flat) → CommentNode[]` tree (oldest-first, orphan-safe). Renderless <CommentsThread> + <CommentsAnchor> wrappers; useComments(bindings, opts) returns items + `tree` + openCount + CRUD + forbiddenWords guard. Adapter pattern — see contract-negotiations §1.",
       "source": "rahmanef63/resource-site",
       "install": "npx rahman-resources add comments",
       "npmPackages": [],
@@ -2143,67 +2093,34 @@
       ]
     },
     {
-      "slug": "document-checklist",
-      "title": "Document Checklist — Job-Search Doc Tracker",
+      "slug": "markdown",
+      "title": "Markdown — page container with CRUD tabs + diagrams",
       "category": "content",
-      "description": "Track required job-search documents (CV, KTP, ijazah, etc.) with country-scoped seed templates and per-user completion state. Ships an Indonesian default checklist. Toggle completed + notes + expiry per item.",
-      "source": "rahmanef63/CareerPack",
-      "install": "npx rahman-resources add document-checklist",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `rr add document-checklist`. Wire <DocumentChecklist bindings={{ current, seed, updateStatus }} countryTemplateSlot={<CountryTemplateCard bindings={{ templates, getTemplate, instantiate }} />} /> — bindings sourced from api.features['document-checklist'].* queries/mutations.",
-      "tags": [
-        "career",
-        "documents",
-        "checklist",
-        "job-search",
-        "indonesia"
-      ]
-    },
-    {
-      "slug": "pricing-page",
-      "title": "Pricing Page",
-      "category": "ui",
-      "description": "Canonical pricing tier section — eyebrow + headline + 2/3/4 column tier grid with optional FAQ accordion below. Tiers fully data-driven (name/price/period/bullets/cta/featured/badge). Featured variant configurable (ring/scale/tint). Single SSOT — every saas/marketing template consumes this slice for pricing pages so admin-edited tiers propagate without per-template rewriting.",
-      "source": "rahman-resources",
-      "install": "npx rahman-resources add pricing-page",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add pricing-page`. <PricingSection eyebrow title subtitle tiers columns faq faqTitle featuredVariant /> — only `title` + `tiers` required. Each tier: `{ id, name, price, period?, blurb?, bullets[], cta?, featured?, badge? }`. Pass `featuredVariant=\"scale\"` for a popped-forward card or `\"tint\"` for a colored background. Wire admin CRUD via your store hook → useTiers() → pass array.",
-      "tags": [
-        "ui",
-        "pricing",
-        "section",
-        "marketing",
-        "saas",
-        "tiers",
-        "faq"
-      ]
-    },
-    {
-      "slug": "feature-grid",
-      "title": "Feature Grid",
-      "category": "ui",
-      "description": "Canonical features grid section — eyebrow + headline + 1/2/3/4 column item grid in three layout variants (cards, minimal, alternating). Items accept Lucide icon component OR string label, optional image (next/image), optional link CTA. Single SSOT — every template consumes this slice for features pages so admin-edited items propagate without per-template duplication.",
+      "description": "Markdown (.md) page container with optional CRUD surfaces. <MarkdownPage content={md} tabs={['read','write','review']}/> — Read renders rich text (headings, lists, todo, GitHub-style callouts, fenced code, KaTeX, tables, images, <details> toggles, inline marks); Write is a raw-source editor with snippet toolbar + live preview; Review overlays block-anchored comments (add/resolve, controlled via onAddComment/onResolveComment or internal fallback). Fenced ```mermaid blocks render as SVG diagrams (dynamic-imported mermaid) and ```chart blocks as recharts bar/line/area/pie from a JSON spec. Self-contained: ships its own parser (parseMarkdown → MdNode[]) + inline renderer, no notion runtime dependency. Sync is by shared grammar: the notion cluster's blocksToMarkdown / markdownToBlocks bridge (@notion/shared/lib/markdown) emits/consumes the exact same markdown this slice parses, so anything readable in the notion block page is readable here and vice-versa. No store, no Convex — comments CRUD is consumer-wired callbacks.",
       "source": "rahman-resources",
-      "install": "npx rahman-resources add feature-grid",
+      "install": "npx rahman-resources add markdown",
       "npmPackages": [],
       "exampleCode": "",
-      "agentRecipe": "Run `npx rr add feature-grid`. <FeatureGridSection eyebrow title subtitle items columns layout align /> — only `items` required. Each item: `{ id, title, body, icon?, image?, link? }`. `icon` can be a LucideIcon component (rendered as 5×5 inline) or a string (rendered as letter fallback). `layout=\"alternating\"` produces image+text rows that flip per index — set `image` per item for that variant.",
+      "agentRecipe": "Run `npx rr add markdown`. Read-only: `<MarkdownReader content={md}/>`. Full surface: `<MarkdownPage content={md} tabs={['read','write','review']} onContentChange={save} comments={list} onAddComment={add} onResolveComment={resolve}/>` (omit callbacks for internal-state demo mode). Diagrams: fence ```mermaid; charts: fence ```chart with { type: bar|line|area|pie, data: [...] }. To bridge from the notion editor call `blocksToMarkdown(page.blocks)` from `@notion/shared/lib/markdown`; reverse with `markdownToBlocks(md)`.",
       "tags": [
-        "ui",
-        "features",
-        "section",
-        "marketing",
-        "grid",
-        "saas"
+        "content",
+        "markdown",
+        "reader",
+        "editor",
+        "review",
+        "comments",
+        "mermaid",
+        "chart",
+        "rich-text",
+        "docs",
+        "notion-sync"
       ]
     },
     {
       "slug": "landing-sections",
       "title": "Landing Sections",
       "category": "infra",
-      "description": "CRUD-driven admin editor for the public landing-page composition. Ships a pure reducer + LandingProvider store adapter + admin LandingView/LandingEditorView built on the shared CRUD primitives, plus a per-section LandingSectionShell that handles background image + custom Tailwind className overlay. Sections carry { kind, order, title, subtitle, enabled, imageUrl, imageRatio, bgImageUrl, className, config (JSON) } with up/down reorder arrows. Consumers map each `kind` (hero, features, pricing, blog, changelog, testimonials, portfolio, services, stats, newsletter, faq, cta, custom) to their own renderer wrapped in <LandingSectionShell>. Canonical pattern used by all 7 rr website templates.",
+      "description": "Canonical landing-page composition slice — replaces the former standalone hero / cta / pricing-page / faq-section / feature-grid / testimonials-grid / blog-section / portfolio-section / changelog-feed slices (all merged here as `kind` variants in v0.2.0). Ships a pure reducer + LandingProvider store adapter + admin LandingView/LandingEditorView built on the shared CRUD primitives, plus a per-section LandingSectionShell that handles background image + custom Tailwind className overlay. Sections carry { kind, order, title, subtitle, enabled, imageUrl, imageRatio, bgImageUrl, className, config (JSON) } with up/down reorder arrows. Consumers map each `kind` (hero, features, pricing, blog, changelog, testimonials, portfolio, services, stats, newsletter, faq, cta, custom) to their own renderer wrapped in <LandingSectionShell>. Used by all 7 rr website templates.",
       "source": "rahman-resources",
       "install": "npx rahman-resources add landing-sections",
       "npmPackages": [],
@@ -2217,102 +2134,6 @@
         "crud"
       ]
     },
-    {
-      "slug": "faq-section",
-      "title": "FAQ Section",
-      "category": "ui",
-      "description": "Canonical FAQ accordion section — eyebrow + headline + accordion item list. Three layouts (single column, two-column, grouped by category). Optional footer CTA (\"Still have questions?\"). Items fully data-driven. Single SSOT — every template consumes this slice for FAQ blocks so admin-edited Q&A propagates without per-template rewrite.",
-      "source": "rahman-resources",
-      "install": "npx rahman-resources add faq-section",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add faq-section`. <FAQSection items title subtitle layout multiple defaultOpen footerCta /> — only `items` required. Each item: `{ id, q, a, category? }`. `layout=\"grouped\"` buckets by `category`. `multiple` lets users open several at once. `footerCta={{ label, href }}` wires a contact link below the accordion.",
-      "tags": [
-        "ui",
-        "faq",
-        "section",
-        "accordion",
-        "marketing"
-      ]
-    },
-    {
-      "slug": "testimonials-grid",
-      "title": "Testimonials Grid",
-      "category": "ui",
-      "description": "Canonical testimonials section — quote + author + role/company + optional avatar + optional star rating. Three layouts (uniform cards grid, centered quote-stack, CSS masonry). `featured` testimonials get a ring accent. Pairs naturally with the `testimonials` backend slice (Convex queries) but has zero coupling — pass any item array.",
-      "source": "rahman-resources",
-      "install": "npx rahman-resources add testimonials-grid",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add testimonials-grid`. <TestimonialsGridSection items title subtitle columns layout align /> — only `items` required. Each item: `{ id, quote, author, role?, company?, avatar?, rating?, featured? }`. `layout=\"quote-stack\"` renders a centered no-card scroll for editorial sites. `layout=\"masonry\"` uses CSS columns for variable-height quotes.",
-      "tags": [
-        "ui",
-        "testimonials",
-        "section",
-        "marketing",
-        "social-proof",
-        "saas"
-      ]
-    },
-    {
-      "slug": "blog-section",
-      "title": "Blog Section",
-      "category": "ui",
-      "description": "Canonical blog list + detail section. <BlogListSection> renders 3 layouts (cards grid, minimal list, featured-split with hero + side rail). <BlogPostView> renders the single-post page with cover + meta + paragraph-split body. Both pass through `hrefFor`/`backHref` so each template controls routing — single SSOT for /blog and /blog/[slug] across all templates.",
-      "source": "rahman-resources",
-      "install": "npx rahman-resources add blog-section",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add blog-section`. <BlogListSection posts hrefFor title columns layout limit /> for /blog — `hrefFor(post)` returns the per-post URL. <BlogPostView post backHref renderBody /> for /blog/[slug] — `renderBody` defaults to paragraph-split on `\\n\\n` (swap for an MDX renderer if you use mdx-blog).",
-      "tags": [
-        "ui",
-        "blog",
-        "section",
-        "marketing",
-        "content",
-        "list",
-        "detail"
-      ]
-    },
-    {
-      "slug": "changelog-feed",
-      "title": "Changelog Feed",
-      "category": "ui",
-      "description": "Canonical /changelog or /whats-new section. Entries support 5 kinds (feature/improvement/fix/chore/breaking) with color-coded badges. Three layouts (timeline with date-rail, large cards, minimal list). Optional `limit` for \"Recent updates\" excerpts on home pages. Optional `groups` per entry for sub-sectioned bullet lists.",
-      "source": "rahman-resources",
-      "install": "npx rahman-resources add changelog-feed",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add changelog-feed`. <ChangelogFeedSection entries title subtitle layout sortDescending limit /> — only `entries` required. Each entry: `{ id, version, date, kind, title, body, bullets?, groups? }`. `layout=\"timeline\"` adds a left date-rail; `layout=\"list\"` is the most compact. Pass `limit={3}` on home pages to show recent releases.",
-      "tags": [
-        "ui",
-        "changelog",
-        "section",
-        "saas",
-        "release-notes",
-        "marketing"
-      ]
-    },
-    {
-      "slug": "portfolio-section",
-      "title": "Portfolio Section",
-      "category": "ui",
-      "description": "Canonical portfolio list + detail section. <PortfolioListSection> renders 3 layouts (uniform 16:9 grid, CSS masonry, asymmetric with featured hero). <PortfolioDetailView> renders title + meta + cover + body + gallery + external link + related items. Both pass through `hrefFor`/`backHref` so each template controls routing — single SSOT for /portfolio and /portfolio/[slug] across agency-studio and personal-brand.",
-      "source": "rahman-resources",
-      "install": "npx rahman-resources add portfolio-section",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add portfolio-section`. <PortfolioListSection items hrefFor title columns layout limit /> for /portfolio — each item `{ id, slug, title, summary?, year?, client?, role?, tags?, cover: {src,alt}, gallery?, link? }`. <PortfolioDetailView item backHref renderBody related hrefForRelated /> for /portfolio/[slug] — `renderBody` defaults to paragraph split; override for project-specific layouts (problem/approach/result, brief/outcome, etc).",
-      "tags": [
-        "ui",
-        "portfolio",
-        "section",
-        "marketing",
-        "case-study",
-        "list",
-        "detail"
-      ]
-    },
     {
       "slug": "theme-presets",
       "title": "Theme Presets — unified switcher with bundled tweakcn registry",
@@ -2356,206 +2177,160 @@
       ]
     },
     {
-      "slug": "equation",
-      "title": "Equation — Notion-style KaTeX block primitive",
+      "slug": "selection",
+      "title": "Selection — marquee multi-select + bulk actions",
       "category": "ui",
-      "description": "Inline-or-display LaTeX equation block — Notion-inspired primitive. KaTeX-rendered with edit/preview toggle, raw-text fallback when KaTeX fails to parse. Pure UI primitive (zero Convex tables, zero global state). Lifted from notion-page-clone (Nosion). Use standalone OR bundled via the notion-blocks bundle. Drop into any React surface — docs, marketing landing, editor.",
+      "description": "Framework-agnostic multi-selection for any vertical list (Notion-style blocks, table rows, cards). Hold-and-drag on empty space draws a rubber-band rectangle — AutoCAD-style: drag RIGHT selects only fully-enclosed items (solid ring), drag LEFT selects anything the rectangle touches (dashed green ring). Click an item's edge to select (Shift = range, Cmd/Ctrl = toggle). Selecting activates items with a ring + data-block-selected attribute. Backspace/Delete bulk-deletes, Escape and click-outside clear, and a floating count toolbar offers Delete/Clear. SelectionProvider owns only the id set — the host owns the data via onBulkDelete(ids). Pairs with notion-shell (the notion-clone template wires it onto the editor); lifted from notion-page-clone's block-selection slice.",
       "source": "notion-page-clone",
-      "install": "npx rahman-resources add equation",
+      "install": "npx rahman-resources add selection",
       "npmPackages": [],
       "exampleCode": "",
-      "agentRecipe": "Run `npx rr add equation`. Single npm dep: katex. Import `import { EquationBlock } from \"@/features/equation\"`. Props-driven: pass `value` (LaTeX string) + `onChange`. For display-mode (block-level) pass `displayMode`. Renders raw text if KaTeX parse fails. Bundled inside notion-blocks if you also want code/notify/drag-fill.",
+      "agentRecipe": "Run `npx rr add selection`. Zero deps (react-dom only). Wrap your list area in `<SelectionProvider onBulkDelete={(ids) => removeMany(ids)}>`, give the surface a `position: relative` div with a ref, drop `<SelectionMarquee containerRef={ref} />` inside it, and wrap each item in `<SelectableBlock id={item.id} orderedIds={allIds}>…</SelectableBlock>`. Hold-drag on empty space to rubber-band: drag RIGHT = window (only fully-enclosed, solid ring), drag LEFT = crossing (anything touched, dashed green). Edge-click an item to pick it (Shift = range, Cmd/Ctrl = toggle). Backspace/Delete bulk-deletes (focus outside a contentEditable), Escape + click-outside clear, floating `N selected · Delete · Clear` toolbar. Read state anywhere via `useSelection()`. The slice owns ONLY the id set — you own the data + the delete. Works on table rows / cards too, not just notion blocks.",
       "tags": [
         "ui",
+        "selection",
+        "marquee",
+        "rubber-band",
+        "multi-select",
+        "bulk",
         "notion",
-        "notion-like",
-        "equation",
-        "katex",
-        "latex",
-        "math",
-        "block",
-        "primitive",
-        "editor"
+        "blocks",
+        "list"
       ]
     },
     {
-      "slug": "code-block",
-      "title": "Code Block — Notion-style syntax-highlighted code primitive",
+      "slug": "notion-database",
+      "title": "Notion Database",
       "category": "ui",
-      "description": "Highlight.js-powered code block — Notion-inspired primitive. Language selector dropdown (auto-detect + 50+ language packs), copy-to-clipboard button, line-wrap toggle. Pure-UI primitive — no Convex tables. Lifted from notion-page-clone (Nosion). Use standalone OR bundled via notion-blocks.",
-      "source": "notion-page-clone",
-      "install": "npx rahman-resources add code-block",
+      "description": "Drop-in Notion-style database surface. 11 views (table, board, list, gallery, calendar, feed, chart, dashboard, form, map, timeline), 18 property/cell types, and a per-type column-header config menu (number format, date ranges, select, relation, rollup, formula) plus filter / sort / group / calculate, row peek, row multi-select, table cell selection + drag-to-fill (click a cell, drag the handle to copy down — merged from the former database-cell-selection slice in v0.16), and CSV + JSON import-export. Pure and props-driven — the host owns the data and dispatches change callbacks. Domain types live in notion-shell (install it as the peer). Full release history in CHANGELOG.md.",
+      "source": "open-silong",
+      "install": "npx rahman-resources add notion-database",
       "npmPackages": [],
       "exampleCode": "",
-      "agentRecipe": "Run `npx rr add code-block`. Single npm dep: highlight.js. Import `import { CodeBlock, languageLabel } from \"@/features/code-block\"`. Props: `value` + `onChange` + `language` + `onLanguageChange`. Bundled inside notion-blocks if you also want equation/notify/drag-fill.",
+      "agentRecipe": "**Controlled component.** `<NotionDatabase />` renders the whole surface — 11 views (table, board, list, gallery, calendar, feed, chart, dashboard, form, map, timeline), 18 cell types, filter / sort / group / calculate, row peek + multi-select, table cell drag-fill, CSV / JSON import-export. It is 100% props-driven: it owns NO data state — you hold `db` + `rows` and persist every change callback. The view tab strip scrolls horizontally and the card clips to its border, so it stays inside any container width.\n\n**1. Install** — `npx rr add notion-database`. Cascades the `notion-shell` peer (the domain types live there). Components import from `@/features/notion-database`; types from `@/features/notion-shell`.\n\n**2. Minimal wire-up** — keep `db: Database` + `rows: Page[]` in your store (a Convex query result or `useState`) and pass change handlers:\n```tsx\nimport { NotionDatabase } from '@/features/notion-database';\n\n<NotionDatabase\n  db={db}\n  rows={rows}\n  onRowAdd={addRow}\n  onRowUpdate={(rowId, propId, value) => setValue(rowId, propId, value)}\n  onRowRemove={removeRow}\n  onPropertyAdd={addProperty}\n  onViewActivate={setActiveView}\n  onViewAdd={addView}\n  onViewConfigChange={(viewId, patch) => patchView(viewId, patch)}\n/>\n```\nOmit any callback and that affordance goes read-only; pass `readOnly` to freeze everything at once.\n\n**3. Data shape** — `Database = { id, name, properties: Property[], views: DatabaseViewConfig[], activeViewId }`; each row `Page = { id, title, rowProps: Record<propId, PropertyValue> }`. For `relation` / `rollup` cells also pass `pages` + `databases`; for `person` / `created_by` cells pass `userLookup(id)`.\n\n**4. Import / export** — mount `<DatabaseIOActions db={db} rows={rows} onImport={handleImport} />` in your toolbar: CSV/JSON in (with schema-diff), CSV/JSON + live-schema templates out. New columns arrive with a `tempId` — map it to your real backend id before writing their `rowProps`.\n\n**5. Backend (optional)** — the UI is store-agnostic. For Convex persistence copy `template-base/database-silong/convex/` (handlers → `convex/`, schema fragment merges into `convex/schema.ts`). Pick `_shared/minimal/` (single-user, noop authz) or `_shared/full/` (`@convex-dev/auth` + workspaces). See CONVEX-BACKEND.md.\n\n**Just one view?** Import it directly — `import { TableView } from '@/features/notion-database'` — and feed it `rows` + `renderCell` + `renderColumnHeader`.",
       "tags": [
         "ui",
         "notion",
         "notion-like",
-        "code",
-        "syntax",
-        "highlight",
-        "highlight.js",
-        "block",
+        "database",
+        "table",
+        "board",
+        "list",
+        "gallery",
+        "calendar",
+        "feed",
+        "chart",
+        "dashboard",
+        "form",
+        "map",
+        "timeline",
+        "gantt",
+        "kanban",
+        "views",
+        "filter",
+        "sort",
+        "property",
+        "files",
+        "person",
+        "formula",
+        "timestamp",
+        "unique-id",
+        "csv",
+        "json",
+        "import",
+        "export",
+        "template",
+        "data",
+        "backup",
         "primitive",
-        "editor"
+        "optional",
+        "embeddable"
       ]
     },
     {
-      "slug": "notifications",
-      "title": "Notifications — Notion-style per-page Notify Me",
+      "slug": "image-picker",
+      "title": "Image Picker — one-button image/wallpaper chooser (gallery · upload · link · Unsplash · reposition)",
       "category": "ui",
-      "description": "Pure-client per-page subscription primitive — Notion-inspired bell button + popover. State stored in localStorage (no backend needed). Shipped as a `NotifyMePopover` toggled from a page-action bell. Frequency choices: instant / daily digest / weekly digest. Lifted from notion-page-clone (Nosion). Use standalone OR bundled via notion-blocks.",
+      "description": "Generic image/wallpaper picker — not coupled to Notion. The headline API is ONE button (ImagePickerButton) that opens a dialog with 4 tabs: Gallery (12 colours + 8 gradients + Notion textures), Upload (drag/click, ≤8MB), Link (paste any https image URL), Unsplash (bundled curated landscapes + live search). On pick, onChange fires with an ImageValue ({ type, value, positionY?, metadata? }). ImageBanner is the optional reposition-able band — render an ImageValue as a full-width cover / profile header / card hero with hover controls: Change (opens the dialog), Reposition (drag the vertical focal point), Remove. The slice imports NO other slice and NO backend — the upload backend and Unsplash search are INJECTED as props (onUpload + searchUnsplash), so it drops into any app: wire onUpload to the `files` slice and searchUnsplash to a server route via unsplashSearchVia('/api/unsplash') that holds UNSPLASH_ACCESS_KEY server-side (never NEXT_PUBLIC). Ships a curated Unsplash fallback + gallery so it works with zero config. parseImage normalizes legacy raw-string values; imageStyle builds the focal-point CSS. Wired into the notion-page-clone template as the page cover via NotionPage's coverSlot.",
       "source": "notion-page-clone",
-      "install": "npx rahman-resources add notifications",
+      "install": "npx rahman-resources add image-picker",
       "npmPackages": [],
       "exampleCode": "",
-      "agentRecipe": "Run `npx rr add notifications`. Zero npm deps (only shadcn button + popover). Import `import { NotifyMePopover, useSubscription } from \"@/features/notifications\"`. Drop the popover anywhere; useSubscription(pageId) hook returns `{ isSubscribed, frequency, subscribe, unsubscribe, setFrequency }` reading from localStorage. To wire a real backend, swap the localStorage hook for your own.",
+      "agentRecipe": "Run `npx rr add image-picker`. The headline component is `<ImagePickerButton label=\"Change image\" onChange={(img)=>save(img)} onUpload={…} searchUnsplash={…} />` — ONE button that opens the 4-tab dialog (gallery / upload / link / Unsplash). For a reposition-able cover/hero band use `<ImageBanner image={value} onChange={save} resolvedUrl={…} onUpload={…} searchUnsplash={…} />` (also passable to notion-shell's `<NotionPage coverSlot={…} />`). Inject the backend: `onUpload` = the `files` slice's useFileUpload().upload (returns a FileRef); resolve upload images for display with `resolvedUrl` = files useFileUrl(parseFileRef(imageRef(parseImage(value))).storageId). `searchUnsplash` = `unsplashSearchVia('/api/unsplash')` — add a server route that proxies api.unsplash.com with UNSPLASH_ACCESS_KEY (never expose the key client-side). Ships a curated Unsplash + gallery fallback so it works with zero wiring. ImageValue = { type, value, positionY?, metadata? }; parseImage handles legacy string values.",
       "tags": [
         "ui",
-        "notion",
-        "notion-like",
-        "notifications",
-        "subscribe",
-        "notify",
-        "bell",
-        "popover",
-        "localstorage",
-        "primitive"
-      ]
-    },
-    {
-      "slug": "database-cell-selection",
-      "title": "Database Cell Selection — Notion-style drag-fill + multi-select",
-      "category": "ui",
-      "description": "Notion-style grid cell interaction primitives: drag-fill (Sheets/Excel-style range fill), multi-cell selection with shift-click + arrow-key extension, paste-from-clipboard column adapter. Pure-UI hooks + components, no Convex tables. Lifted from notion-page-clone (Nosion). Pair with any tabular UI (notion-shell databases, ag-grid, custom React table, etc.).",
-      "source": "notion-page-clone",
-      "install": "npx rahman-resources add database-cell-selection",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add database-cell-selection`. Zero deps. Import `import { useDragFill, SelectableCell, useCellSelection } from \"@/features/database-cell-selection\"`. Wrap your grid container with the selection hook; per-cell `<SelectableCell row col>` provides the click-and-drag affordance. Drag handles supplied by useDragFill. Composable with notion-shell's NotionDatabase or any custom grid.",
-      "tags": [
-        "ui",
-        "notion",
-        "notion-like",
-        "database",
-        "grid",
-        "cell",
-        "selection",
-        "drag-fill",
-        "spreadsheet",
-        "primitive",
-        "table"
-      ]
-    },
-    {
-      "slug": "notion-database",
-      "title": "Notion-like Database Table — full table with import/export + row peek + relation/rollup + row multi-select + calendar drag + DB-level menu + full-page shell + AST formula engine (11 views · 18 cells · CSV + JSON)",
-      "category": "ui",
-      "description": "Portable Notion-style database table surface — full capability in one slice. Optional companion to notion-shell — install shell alone for pages + sidebar + block editor, add notion-database when you want embedded databases with full table capability. Ships NotionDatabase (full DB UI w/ ViewTabs + ViewOptions + per-column menu + FilterBuilder/SortBuilder popovers), NotionProperty (value + schema editor), 16 property-cell types (text / number / checkbox / select / multi_select / status / date / url / email / phone / files / person / formula / created_time / last_edited_time / unique_id), 11 built-in views: Table / Board / List / Gallery / Calendar / Feed PLUS Chart (recharts bar/line/area/pie/donut + inline kind/X/agg/Y pickers) / Dashboard (KPI strip + group breakdowns + recent updates) / Form (public-facing submit-to-create — title + per-property inputs, optional required-field validation, configurable show/hide + success message via inline Settings panel) / Map (SVG world + lat/lng pins, no leaflet) / Timeline (Gantt-style with drag-to-shift / drag-to-resize). FilterBuilder + SortBuilder exported standalone for toolbar embedding. Formula cells use a pure expression engine ({{title}}/{{prop}} interpolation + concat/upper/lower/round/if/etc fns + `=expr` math). Files cells store URL refs (paste-URL workflow; host can plug `files` slice adapter for upload). Person cells are simplified vs upstream — no user directory lookup, just initials chips. Created_time / last_edited_time read row.createdAt / row.updatedAt directly. unique_id auto-derives from row position + optional prefix. Pure helpers: applyView, groupBy, bucketByDate. Domain types live in notion-shell (single source of truth — Page.rowOfDatabaseId + rowProps reference them) and re-exported here. Relation + rollup property types deferred to upstream open-silong mega-bundle (need cross-DB context). v0.5 added drop-in Convex backend templates (dual-mode: minimal single-user OR full multi-workspace) from open-silong's template-base/. v0.6 (Phase 7.10) merges former database-io slice in-tree: DatabaseIOActions toolbar (Export CSV/JSON · Import CSV/JSON · Download dynamic CSV/JSON templates), CsvImportDialog (auto-map columns + create-new-of-type picker), JsonImportDialog (schema diff + import), exportDatabase / exportDatabaseToCsv / parseExport / parseCsv / buildCsvTemplate / buildJsonTemplate helpers — all from `@/features/notion-database`. CsvNewProperty + JsonImportResult.newProperties now expose `tempId` so host can remap rowProps keys when persisting (single import handler serves both formats). Cell editor UX consolidated v0.5.3 — SelectCell + MultiSelectCell share OptionPicker (shared/identical popover: search-as-create + per-option rename/color/delete). Property-type lists single-source via PROPERTY_TYPE_META registry (v0.5.2). v0.7 (CK-1D Phase 1) lifts row-detail subsystem from notion-page-clone: RowPeek (sheet + dialog + persisted mode toggle via useRowOpenMode localStorage hook), RowDetailSheet (right drawer), RowDetailDialog (centered modal), RowDetailBody (shared chrome), RowOpenModeSwitcher (sheet/dialog/page toggle). Pure slot-driven — host supplies icon picker, properties form, and block editor via render slots (iconSlot, propertiesSlot, blocksSlot); no Convex / comments / editor coupling. onOpenAsPage callback wires one-shot navigation without changing the persisted default. v0.8 (CK-1D Phase 2) lifts relation + rollup cells: RelationCell (cross-database link picker w/ search + create-new-row affordance + stale-link healing) and RollupCell (read-only aggregate display — count / count_unique / values / sum / avg / min / max / earliest / latest / checked / percent_checked). PropertyType union extended with 'relation' and 'rollup'. Property gained relationDatabaseId / rollupRelationPropertyId / rollupTargetPropertyId / rollupAggregate fields. NotionDatabase added new props pages, databases, onCreateRelatedRow so host stays the source of truth — cells gracefully no-op when omitted. v0.9 (CK-1D Phase 3) lifts row multi-select subsystem: RowSelectionProvider (React Context holding selected id set + anchor; drops stale ids when rowOrder shrinks), RowMarqueeOverlay (drag-to-select rubber-band over any container w/ data-row-shell-id markers — AutoCAD window/crossing modes, threshold + long-press text-origin activation, additive shift-drag), RowSelectionToolbar (floating bottom-center action bar w/ N-rows-selected count, optional locked badge, host-supplied extraSlot, Delete button via onDelete callback, Clear via Esc/X), RowSelectionKeyboard (Esc clear + Del/Backspace bulk delete + outside-click dismiss). TableView automatically tags rows with data-row-shell-id and applies a primary-tinted ring when wrapped in RowSelectionProvider. Marquee primitive + useMarqueeDrag hook exported for reuse on Board / Gallery / custom views. v0.10 (CK-1D Phase 5) adds HeaderCheckboxGutter (tri-state select-all/clear w/ aria-checked='mixed' indeterminate) + RowCheckbox (per-row toggle) — TableView auto-renders a checkbox gutter column whenever a RowSelectionProvider is in scope. Pure calendarDrag helpers (parseExistingDate, formatDateValue, shiftYmd, computeDateShift, parseDropTargetId) exported for hosts wiring CalendarView/Timeline drag-to-move without taking on @dnd-kit coupling inside the slice. Column drag-reorder + row drag-reorder primitives deferred — upstream's flexbox-table refactor conflicts with rr's semantic <table> + 200-LOC view cap. v0.11 (CK-1D Phase 7) lifts Intl-based number + date formatters: lib/numberFormat.ts (resolveNumberFormat / formatPropertyNumber + COMMON_CURRENCIES 16-code picker) and lib/dateFormat.ts (parseYmdToLocal / formatYmd / formatTime / formatDateValue + DATE_FORMAT_LABELS / TIME_FORMAT_LABELS). Property gained numberCurrencyCode + dateFormat + timeFormat + dateIncludeTime fields. NumberCell currency now honours per-property ISO code; DateCell accepts an optional `prop` and routes through formatDateValue when any date-related field is set on it. Notion-shell DatabaseViewConfig split into ./view-config-types.ts to keep types.ts under the 200-LOC cap. v0.12 (CK-1D Phase 4) adds database-shell subsystem: DatabaseMenu (rename / duplicate {structure | with rows} / lock-toggle / delete popover — every action hidden when its callback is omitted; native window.confirm + window.prompt fallbacks keep zero new dialog deps) and DatabasePage (full-page wrapper composing a big header — icon slot + inline title input + DatabaseMenu — over a NotionDatabase body). NotionDatabase grew a `headerActions` render slot so hosts can drop a DatabaseMenu inline without switching to DatabasePage. Database type gained an optional `locked` flag. Strip vs upstream: useDbAdapter (Convex coupling) + SubItemsPicker (sub-items tree) + IconPickerPopover (lives in icon-picker slice) + DataMenu (database-json slice) deferred — host wires those externally. v0.13 (CK-1D Phase 6) replaces the flat formula.ts evaluator with a typed AST engine under lib/formulaEngine/ (types, coerce, dateUtils, ParserClass, parser, functions, evaluator, deps): recursive-descent parser w/ source-position tracking; typed FormulaValue (string/number/boolean/date/null/list) instead of string-only; circular-reference guard via visited set + per-row memoisation cache; new fn surface — substring, dateAdd, dateSubtract, dateBetween, formatDate, count, sum, join (on top of existing concat/lower/upper/length/if/and/or/not/empty/contains/replace/round/floor/ceil/abs/min/max/now/today). Relation refs in formulas now resolve via the workspace pages passed through NotionDatabase. FormulaCell upgraded — popover now shows parse-error message + source position; cell display flips to destructive style on invalid. Legacy evaluateFormula() string wrapper preserved for existing callers; new code should import evalFormula / formatFormulaValue from `@/features/notion-database`. collectDeps() exported for hosts wiring formula-dependency invalidation.",
-      "source": "open-silong",
-      "install": "npx rahman-resources add notion-database",
-      "npmPackages": [],
-      "exampleCode": "",
-      "agentRecipe": "Run `npx rr add notion-database` (cascades notion-shell as peer). Import: `import { NotionDatabase, NotionProperty, VIEW_REGISTRY, DatabaseIOActions, RowPeek } from \"@/features/notion-database\"`. NotionDatabase ships full props-driven DB UI — host owns rows + dispatches CRUD callbacks. For just one view in isolation, import the specific view component (TableView / BoardView / etc.). Property cells auto-render via renderPropertyCell helper. Pure helpers: applyView / groupBy / bucketByDate. For import/export, mount `<DatabaseIOActions db={db} rows={rows} onImport={async ({ newProperties, rows }) => { const tempToReal: Record<string, string> = {}; for (const np of newProperties) { const realId = await dispatchAddProperty(np); tempToReal[np.tempId] = realId; } for (const r of rows) { const rowId = await dispatchAddRow(r.title); for (const [propKey, v] of Object.entries(r.rowProps)) { await dispatchSetValue(rowId, tempToReal[propKey] ?? propKey, v); } } }} />` next to your DB toolbar — exports CSV/JSON + imports w/ schema diff + downloads dynamic templates from live db.properties. tempId on each new property lets host remap rowProps keys to its real backend ids. For backend persistence, copy template-base/database-silong/convex/ from the open-silong repo: handlers go to convex/, schema fragment merges into convex/schema.ts. Pick _shared/minimal/ (single-user, noop authz) or _shared/full/ (requires @convex-dev/auth + workspaces tables). See CONVEX-BACKEND.md.",
-      "tags": [
-        "ui",
-        "notion",
-        "notion-like",
-        "database",
-        "table",
-        "board",
-        "list",
+        "image",
+        "picker",
+        "wallpaper",
+        "cover",
+        "upload",
+        "unsplash",
         "gallery",
-        "calendar",
-        "feed",
-        "chart",
-        "dashboard",
-        "form",
-        "map",
-        "timeline",
-        "gantt",
-        "kanban",
-        "views",
-        "filter",
-        "sort",
-        "property",
+        "reposition",
         "files",
-        "person",
-        "formula",
-        "timestamp",
-        "unique-id",
-        "csv",
-        "json",
-        "import",
-        "export",
-        "template",
-        "data",
-        "backup",
         "primitive",
-        "optional",
-        "embeddable"
+        "portable",
+        "dialog"
       ]
     },
     {
-      "slug": "database-io",
-      "title": "[DEPRECATED] Database IO — merged into notion-database v0.6",
+      "slug": "notion-sidebar",
+      "title": "Notion Sidebar — tree nav + page CRUD (rename · drag · icon picker)",
       "category": "ui",
-      "description": "DEPRECATED — all functionality merged into `notion-database` v0.6 (Phase 7.10, 2026-05-22). This slice is now a thin re-export shim from `@/features/notion-database` to keep existing consumers compiling. New code should `npx rr add notion-database` (now bundles CSV + JSON import/export + dynamic templates) instead of installing this separately. Slice will be removed in v1.0. Original surface (DatabaseIOActions / CsvImportDialog / JsonImportDialog / exportDatabase / buildCsvTemplate / buildJsonTemplate) remains exported from notion-database — see its catalog entry. Merge rationale: 100% peer coupling to notion-database (every file imported Database/Page/Property types from it) + zero independent install path (always installed alongside notion-database in practice) = no modularity benefit from separation.",
+      "description": "Standalone Notion-style tree-nav sidebar with full page CRUD, lifted out of notion-shell so it is reusable on its own. Props-driven + fully decoupled — owns its own lightweight NotionSidebarPage type (id / title / icon / parentId), imports no other slice. Capabilities: click a row to open; DOUBLE-CLICK a title to rename inline; drag the grip to reorder AND reparent (a @dnd-kit sortable tree with horizontal-offset depth projection); collapse/expand subtrees; hover a row for +subpage / delete. Optional per-row icon PICKER — wire `renderIconPicker` + `onIconChange` (e.g. @/features/icon-picker's IconPickerPopover) so clicking a row icon opens the picker. The host owns the data and dispatches onSelect / onCreate / onRename / onDelete / onMove / onIconChange. Compose with notion-shell (page editor) + notion-database (embedded DBs) for the full Notion-clone OS — see the notion-page-clone-os template.",
       "source": "notion-page-clone",
-      "install": "npx rahman-resources add database-io",
+      "install": "npx rahman-resources add notion-sidebar",
       "npmPackages": [],
       "exampleCode": "",
-      "agentRecipe": "⚠️ DEPRECATED — use `npx rr add notion-database` (now bundles import/export). This slice is a thin re-export shim from `@/features/notion-database` for back-compat. New code: `import { DatabaseIOActions } from \"@/features/notion-database\"`. Remove when migration complete; slice scheduled for removal in v1.0.",
+      "agentRecipe": "Run `npx rr add notion-sidebar`. Import `import { NotionSidebar, type NotionSidebarPage } from \"@/features/notion-sidebar\"`. Feed it a flat `pages: NotionSidebarPage[]` ({ id, title, icon, parentId }) — the sidebar builds the tree. Wire callbacks: onSelect(id), onCreate(parentId|null), onRename(id, title) [double-click a title to trigger], onDelete(id), onMove(id, parentId, beforeId) [drag the grip — reorders + reparents], onIconChange(id, icon). For rich icons pass `renderIcon` (display) + `renderIconPicker` (click-to-pick) wired to `@/features/icon-picker` (DynamicIcon + IconPickerPopover). npm: @dnd-kit/core + sortable + utilities. Pair with notion-shell (page editor) + notion-database (embedded DBs) — the notion-page-clone-os template shows the full reducer wiring.",
       "tags": [
         "ui",
         "notion",
-        "notion-like",
-        "database",
-        "csv",
-        "json",
-        "import",
-        "export",
-        "template",
-        "data",
-        "backup",
-        "spreadsheet",
-        "wire-format",
+        "sidebar",
+        "tree",
+        "nav",
+        "page",
+        "crud",
+        "rename",
+        "drag",
+        "dnd",
+        "reorder",
+        "reparent",
+        "icon-picker",
         "primitive",
-        "optional"
+        "portable",
+        "notion-like"
       ]
     },
     {
       "slug": "notion-shell",
-      "title": "Notion Shell — page + sidebar + block editor primitives (pure, no database)",
+      "title": "Notion Shell — page + block editor primitives (pure, no sidebar/database)",
       "category": "ui",
-      "description": "Portable Notion-style PAGE + SIDEBAR + BLOCK editor primitives. CI-wave (2026-05-21) split the database surface out — install the optional `notion-database` peer for embedded TableView / BoardView / ListView / GalleryView / CalendarView / FeedView, NotionDatabase, NotionProperty, ViewTabs, ViewOptions, ColumnHeaderMenu, property-cells. notion-shell alone gives you Notion-clone pages + sidebar + editor without the database weight. Domain types (Database, Property, PropertyValue, DbView, DatabaseViewConfig, DatabaseFilter, DatabaseSort) remain in notion-shell as the single source of truth (Page.rowOfDatabaseId + rowProps reference them). FULL OLD DESC BELOW: Portable Notion-style wrapper primitives. PAGE EDITOR: NotionPage (optional cover image band + header + body), NotionHeader / NotionSidebar / NotionBlock (live inline-markdown decorator, hover actions menu, optional dragHandle slot), SlashMenu (searchable block-type picker w/ keyboard nav), BlockActionsMenu (turn-into / duplicate / delete), InsertBlockButton (`+` trigger w/ SlashMenu), SortableBlockList (@dnd-kit render-prop wrapper for block reorder), PageActionsMenu (header dropdown: cover/favorite/duplicate/export/trash). DATABASE: NotionDatabase (full DB surface w/ tabs + options + per-column menu), NotionProperty (10 property-cell types), 6 built-in views (Table/Board/List/Gallery/Calendar/Feed), ViewTabs, ViewOptions (sort + filter + search popover), ColumnHeaderMenu. SPECIALISED BLOCK RENDERERS: ImageRenderer (URL + caption + preview), EmbedRenderer (YouTube/Vimeo/Loom/Figma/CodePen/Spotify auto-detect + iframe fallback). Pure helpers: applyView, groupBy, bucketByDate. Pure / props-driven — host owns data + change handlers.",
+      "description": "Portable Notion-style PAGE EDITOR primitives. v0.22 split the tree-nav SIDEBAR out into the standalone `notion-sidebar` slice (so the page editor and the sidebar are independently reusable); embedded DATABASES already live in the `notion-database` peer. notion-shell ships: NotionPage (optional cover image band + header + body), NotionHeader, NotionBlock (live inline-markdown decorator, hover actions menu, optional dragHandle slot, BUILT-IN code (highlight.js) + equation (KaTeX) blocks), SlashMenu (searchable block-type picker w/ keyboard nav), BlockActionsMenu (turn-into / duplicate / delete), InsertBlockButton (`+` trigger w/ SlashMenu), SortableBlockList (@dnd-kit render-prop wrapper for block reorder), PageActionsMenu (header dropdown: cover/favorite/duplicate/export/trash), InlineFormatToolbar + BlockColorPicker (colour) + MentionTypeahead + PageLayoutSection (layout). SPECIALISED BLOCK RENDERERS: ImageRenderer, EmbedRenderer (YouTube/Vimeo/Loom/Figma/CodePen/Spotify auto-detect). Domain types (Database, Property, PropertyValue, DbView, DatabaseViewConfig, DatabaseFilter, DatabaseSort) remain in notion-shell as the single source of truth (Page.rowOfDatabaseId + rowProps reference them). Pure / props-driven — host owns data + change handlers. Compose notion-sidebar + notion-shell + notion-database for the full Notion-clone OS.",
       "source": "notion-page-clone",
       "install": "npx rahman-resources add notion-shell",
       "npmPackages": [],
       "exampleCode": "",
-      "agentRecipe": "Run `npx rr add notion-shell` for the portable UI wrappers ONLY (no backend). NPM deps: @dnd-kit/core, @dnd-kit/sortable, @dnd-kit/utilities. Import: `import { NotionPage, NotionSidebar, NotionBlock, NotionDatabase, SortableBlockList, PageActionsMenu, InsertBlockButton, ViewTabs, ImageRenderer, EmbedRenderer } from \"@/features/notion-shell\"`. NotionBlock ships slash menu + decorator + actions menu + dragHandle slot. NotionPage ships optional cover prop. SortableBlockList wraps a render-prop callback `(id, dragProps) => <NotionBlock dragHandle={...} />`. NotionDatabase ships 6 views via VIEW_REGISTRY. Property cells: text/number/checkbox/select/multi-select/status/date/url/email/phone all built in. For rich icon UX wire `renderIcon` + `renderIconPicker` to `@/features/icon-picker`. **PRODUCT POINTER: the full Convex-backed Notion-clone OS (multi-workspace + auth + sharing + comments + snapshots + MCP) lives at https://github.com/rahmanef63/open-silong — clone that repo for the production stack; use this slice when you only need to embed the Notion-style UI in another project.**",
+      "agentRecipe": "Run `npx rr add notion-shell` for the portable PAGE EDITOR wrappers ONLY (no backend; the tree-nav sidebar is the separate `notion-sidebar` slice). NPM deps: @dnd-kit/core, @dnd-kit/sortable, @dnd-kit/utilities. Import: `import { NotionPage, NotionBlock, SortableBlockList, PageActionsMenu, InsertBlockButton, InlineFormatToolbar, ImageRenderer, EmbedRenderer } from \"@/features/notion-shell\"`. NotionBlock ships slash menu + decorator + actions menu + dragHandle slot. **`createDefaultBlockRenderers()` returns the block-renderer registry — pass it to `<NotionBlock blockRenderers={…}>` so callout (icon+kind picker), table (editable grid), divider, image, embed, code (highlight.js) + equation (KaTeX) all render. code + equation are now BUILT-IN to notion-shell (npm: katex + highlight.js) — no adapter needed. Only `database` + `toc` are injected at the app level (they depend on host data + the sibling notion-database slice).** NotionPage ships optional cover prop. SortableBlockList wraps a render-prop callback `(id, dragProps) => <NotionBlock dragHandle={...} />`. NotionDatabase ships 6 views via VIEW_REGISTRY. Property cells: text/number/checkbox/select/multi-select/status/date/url/email/phone all built in. For rich icon UX wire `renderIcon` + `renderIconPicker` to `@/features/icon-picker`. **v0.17 — Notion-canonical editing keys (`blockKeyHandler.ts`): Enter splits at the caret into a new block (lists continue their type; an empty list item exits to paragraph); Backspace on an empty non-paragraph downgrades it to a plain paragraph (re-triggerable with `/`); a second Backspace on an empty paragraph merges into the previous block; Arrow up/down at a line edge hops blocks. Wire the host callbacks on `<NotionBlock>`: `onInsertAfter(type, init) => newId`, `onMergeBack()`, `onFocusSibling(dir)` — plus `focusBlock(id, offset?)` exported to move the caret after a host state change. The preview `page-demo.tsx` and the notion-clone template `DocView` show full array- and reducer-based wirings.** PRODUCT POINTER: the full Convex-backed Notion-clone OS (multi-workspace + auth + sharing + comments + snapshots + MCP) lives at https://github.com/rahmanef63/open-silong — clone that repo for the production stack; use this slice when you only need to embed the Notion-style UI in another project.**",
       "tags": [
         "ui",
         "notion",
         "shell",
         "wrapper",
-        "sidebar",
         "page",
-        "database",
+        "block",
+        "editor",
         "primitive",
         "portable",
         "slash-menu",
         "decorator",
         "wysiwyg",
-        "views",
-        "kanban",
-        "calendar",
-        "gallery",
         "drag",
         "cover",
         "embed",
         "image",
+        "code",
+        "equation",
         "notion-like"
       ]
     },
@@ -2604,13 +2379,137 @@
     }
   ],
   "slices": [
+    {
+      "slug": "image-editor",
+      "title": "Image Editor — Photoshop-style canvas (Konva)",
+      "category": "ui",
+      "kind": "full",
+      "version": "1.0.0",
+      "description": "A Photoshop-style raster image editor built on Konva. Layers panel (reorder, opacity, visibility, lock, 16 blend modes), free transform (move/scale/rotate/flip via a Transformer), image + text + shape + paint layers, brush & eraser with size/opacity/hardness, non-destructive adjustments + filters (brightness/contrast/hue/saturation/blur/grayscale/invert/sepia, applied via Konva.Filters), canvas resize/aspect presets, and Photoshop-style LAYER STYLES: stroke, drop shadow (angle/distance/size/opacity), outer glow, clipping mask (clip to layer below), per-layer blend mode. One-click BACKGROUND REMOVAL runs fully in-browser via @imgly/background-removal (free, MIT, no API key, no server — downloads a small ONNX model to the browser cache on first use) and drops the cutout back as a transparent layer. Undo/redo, zoom/pan, keyboard shortcuts, and PNG/JPG/WebP export at 1×/2×/3×. Self-contained: image I/O is via props (initialImage / onSave) so it drops into any app with zero backend.",
+      "source": "rahmanef63/os-vps",
+      "slicePath": "frontend/slices/image-editor",
+      "convexPaths": [],
+      "npm": [
+        "konva",
+        "react-konva",
+        "@imgly/background-removal",
+        "lucide-react"
+      ],
+      "shadcn": [
+        "button",
+        "input",
+        "slider",
+        "select",
+        "tabs",
+        "scroll-area",
+        "separator",
+        "tooltip",
+        "label",
+        "switch",
+        "popover",
+        "resizable"
+      ],
+      "env": [],
+      "peers": [],
+      "providers": [],
+      "tags": [
+        "image-editor",
+        "photoshop",
+        "canvas",
+        "konva",
+        "layers",
+        "filters",
+        "background-removal",
+        "paint",
+        "crop",
+        "ui"
+      ],
+      "agentRecipe": "Stack: Next 16 + React 19 + Tailwind 4 + shadcn/ui + Konva. A layered raster image editor. Image I/O is via props; background removal runs in-browser (no backend).\n\nSTEP 1 — Install. `npx rr add image-editor`. Ensure `@/features/image-editor` resolves in tsconfig paths and Tailwind scans the slice folder.\n\nSTEP 2 — Deps. npm: `konva react-konva @imgly/background-removal lucide-react`. shadcn: `npx shadcn@latest add button input slider select tabs scroll-area separator tooltip label switch popover`.\n\nSTEP 3 — Mount. It is fully self-contained; the Konva stage is loaded client-only (next/dynamic ssr:false) inside the slice, so just render it in a height-bearing box:\n```tsx\n\"use client\";\nimport { ImageEditor } from \"@/features/image-editor\";\nexport default function Page() {\n  return (\n    <div className=\"h-dvh\">\n      <ImageEditor onSave={(dataUrl) => console.log(dataUrl)} />\n    </div>\n  );\n}\n```\nProps: `initialImage?` (data/object/remote URL opened on mount), `width?`/`height?` (blank canvas size, default 1080²), `onSave?(dataUrl)` (fires from the Save button with a PNG data URL; omit to hide Save), `className?`.\n\nSTEP 4 — Background removal. The \"Remove BG\" button calls removeImageBackground() from @imgly/background-removal — free, in-browser, no key. First run downloads a small model to the browser cache, then runs locally via WASM. You can also import `removeImageBackground(src) => Promise<pngDataUrl>` directly.\n\nSTEP 5 — Export. PNG/JPG/WebP at 1×/2×/3× via the Export tab, or call `exportStage(stage, {...})` / `stageToDataURL(stage, {...})`. The container owns the box — render inside h-dvh / h-full."
+    },
+    {
+      "slug": "file-explorer",
+      "title": "File Explorer — Tree + CRUD + Breadcrumb",
+      "category": "ui",
+      "kind": "full",
+      "version": "1.0.0",
+      "description": "A complete, portable file-directory explorer: a collapsible folder TREE sidebar (lazy-loaded per dir), a responsive BREADCRUMB that auto-collapses to a dropdown, grid + list views with sort, multi-select, a right-click context menu, drag-and-drop (internal move + external file/folder upload), inline rename, and full CRUD (new folder, rename, cut/copy/paste, move, delete/trash, empty trash). The filesystem backend is INJECTED via a small FileExplorerAdapter (list/mkdir/remove/move/copy/upload/usage/rawUrl) — point it at a real API or use the bundled createMockAdapter() (a writable in-memory tree) so it works with zero backend. Opening a file fires an onOpenFile(path, entry) callback you wire to your own viewer/editor. Self-contained: imports only @/components/ui/* + @/lib/utils. Ported from os-vps (Topside) files manager. Pairs with appshell as the file-dir counterpart to a notion-style sidebar.",
+      "source": "rahmanef63/os-vps",
+      "slicePath": "frontend/slices/file-explorer",
+      "convexPaths": [],
+      "npm": [
+        "lucide-react"
+      ],
+      "shadcn": [
+        "button",
+        "input",
+        "scroll-area",
+        "separator",
+        "dropdown-menu",
+        "sheet"
+      ],
+      "env": [],
+      "peers": [],
+      "providers": [],
+      "tags": [
+        "files",
+        "file-manager",
+        "explorer",
+        "tree",
+        "breadcrumb",
+        "crud",
+        "sidebar",
+        "ui"
+      ],
+      "agentRecipe": "Stack: Next 16 + React 19 + Tailwind 4 + shadcn/ui. The slice is self-contained — imports only @/components/ui/* + @/lib/utils (cn). The filesystem backend is injected; nothing is hardcoded.\n\nSTEP 1 — Install. `npx rr add file-explorer`. Ensure `@/features/file-explorer` resolves in tsconfig paths and Tailwind's content globs scan the slice folder.\n\nSTEP 2 — shadcn + npm. `npx shadcn@latest add button input scroll-area separator dropdown-menu sheet`. npm: lucide-react.\n\nSTEP 3 — Mount it. Drop it in with NO adapter prop — it falls back to the backend configured in lib/backend.ts (the writable in-memory mock by default), so it works out of the box with realistic seed data and full CRUD:\n```tsx\n\"use client\";\nimport { FileExplorer } from \"@/features/file-explorer\";\nexport default function Page() {\n  return (\n    <div className=\"h-dvh\">\n      <FileExplorer rootLabel=\"Files\" onOpenFile={(path) => console.log(\"open\", path)} />\n    </div>\n  );\n}\n```\n\nSTEP 4 — The backend switch (ONE file). Go to a real filesystem without touching any component: edit `slices/file-explorer/lib/backend.ts` and set `FILE_EXPLORER_BACKEND = \"mock\" | \"live\" | \"convex\"` (or set env `NEXT_PUBLIC_FILE_EXPLORER_BACKEND`). \"live\" = REST host fs (os-vps /api/v1/fs shape, base via NEXT_PUBLIC_FILES_API_URL — see adapter/live.ts). \"convex\" = self-hosted Convex fs functions, PREPARED but inert until you wire your generated client + api in the switch (see adapter/convex.ts; the slice imports nothing from @convex so the build stays green even without Convex). You can still pass `adapter={…}` to override per-instance.\n\nSTEP 5 — Custom adapter. Implement FileExplorerAdapter: { mode: \"live\"|\"mock\"|\"readonly\", list(path), mkdir(path), remove(path), move(from,to), copy(from,to), upload(dest,files), usage(), rawUrl(path), write?(path,content) }. `list` returns { path, entries:[{name,kind,size,ext?}], roots?, parent? }. Set mode:\"readonly\" to show an inline notice instead of mutating. `rawUrl(path)` returns a bytes URL for image thumbnails (return \"\" to fall back to icons).\n\nThe container owns the box — render <FileExplorer> inside something with a height (h-dvh / h-full). It self-provides its adapter context; no extra provider needed."
+    },
+    {
+      "slug": "appshell",
+      "title": "AppShell — Desktop + Mobile OS Shell",
+      "category": "ui",
+      "kind": "full",
+      "version": "1.0.0",
+      "description": "Generic, brand-free OS-style shell framework. One <AppShell manifest> wrapper provider gives a project a macOS-style window manager (drag/snap/maximize, dock, menu bar, Spotlight) AND an iOS-style mobile surface (home pager, app library, control center, widgets), driven entirely by a manifest: brand, apps, features, surface regions, capabilities, persistence, keymap. Five shell features (search, inspector, notifications, control-center, widgets) are bundled as defineFeature() contributions inside the slice and mount via named <Slot>s. Responsiveness is a single ResponsiveProvider + 4 DRY primitives (AppFrame, MasterDetail, ResponsiveToolbar, TouchList). Imports nothing project-specific — the consumer injects data/auth/AI through manifest.capabilities. Lifted from os-vps (Topside).",
+      "source": "rahmanef63/os-vps",
+      "slicePath": "frontend/slices/appshell",
+      "convexPaths": [],
+      "npm": [
+        "lucide-react",
+        "class-variance-authority",
+        "clsx",
+        "tailwind-merge",
+        "vaul"
+      ],
+      "shadcn": [
+        "button",
+        "tooltip",
+        "scroll-area",
+        "sheet",
+        "drawer",
+        "dialog",
+        "alert-dialog",
+        "dropdown-menu"
+      ],
+      "env": [],
+      "peers": [],
+      "providers": [],
+      "tags": [
+        "shell",
+        "window-manager",
+        "desktop",
+        "mobile",
+        "responsive",
+        "framework",
+        "ui"
+      ],
+      "agentRecipe": "Stack required: Next 16 (App Router) + React 19 + Tailwind 4 + shadcn/ui. The slice is self-contained — it imports only @/components/ui/* + @/lib/utils (cn); everything project-specific arrives via the manifest. Follow ALL steps; the ⚠ ones are where installs break.\n\nSTEP 1 — Install. `npx rr add appshell` (alias `npx rahman-resources add appshell`). It copies to your slices dir. Ensure `@/features/appshell` resolves in tsconfig paths (point it at that dir), and that Tailwind's content globs SCAN the slice folder (else the shell renders unstyled).\n\nSTEP 2 — shadcn + npm deps. Add any missing shadcn primitives: `npx shadcn@latest add button tooltip scroll-area sheet drawer dialog alert-dialog dropdown-menu`. npm: lucide-react class-variance-authority clsx tailwind-merge vaul.\n\nSTEP 3 — ⚠ Theme. Import the slice's tokens ONCE in the root layout: `import \"@/features/appshell/appshell.css\"`. These are the glass/dock/window/wallpaper CSS variables the shell needs — they are NOT shadcn defaults, so skipping this = an unstyled, broken-looking shell. It pairs with your shadcn tokens (--background etc.). Dark mode = toggle the `.dark` class on <html> (appshell.css ships light + dark).\n\nSTEP 4 — Mount full-bleed. Render <AppShell manifest={manifest} /> from a CLIENT component that owns one full viewport (the page is h-dvh w-screen / the root). AppShell auto-picks the macOS desktop on wide viewports and the iOS surface on narrow — you write nothing extra for mobile.\n\nSTEP 5 — Build the ShellManifest:\n• brand: { name, logo (string or ReactNode), idleAppName?, wallpaper?: \"aurora\"|\"dusk\"|\"mist\"|\"noir\" }.\n• apps: AppDescriptor[] — { id, title, icon (a lucide-react icon component), gradient (a CSS gradient string for the glossy icon), load: async () => ({ default: YourAppComponent }), slug?, defaultSize?: {w,h}, multi?: true (spawn a new window per open, e.g. a file manager), noDock?: true }. Your app component receives props { payload }.\n• features: the fastest path is `features: DEFAULT_FEATURES` — the bundled default system-feature set (all five, generic + brand-free) exported from \"@/features/appshell\". Or import individually and list only what you want: searchFeature (⌘K Spotlight), inspectorFeature (⌘I AI/context panel), notificationsFeature (toasts + iOS dynamic island), controlCenterFeature (iOS control center), widgetsFeature (iOS Today widgets). The surfaces are slot-driven, so spreading/trimming DEFAULT_FEATURES just mounts/omits a feature — `features: [...DEFAULT_FEATURES.filter(f => f.id !== \"widgets\")]`.\n• capabilities: ShellCapabilities — your data/auth/AI injection seam. useAppearance() and useCpuPercent() are REQUIRED; useSearch/useSystemStats/useChat/useServerToggle are optional (defaults degrade gracefully). ⚠ CRITICAL: every capability hook MUST return a REFERENTIALLY STABLE value — a module-level const, or useMemo/useCallback. Returning a fresh object/closure each render makes Spotlight's search effect re-fire forever (\"Maximum update depth exceeded\"). e.g. define APPEARANCE once at module scope and `useAppearance: () => APPEARANCE`.\n• persistKey?: localStorage namespace for the saved window layout (default \"appshell:layout\").\n• routing?: defaults TRUE — it mirrors the focused app to the URL via the History API (window.history, NOT router.push). ⚠ If true you MUST add a catch-all route `app/[[...slug]]/page.tsx` that renders the mount AND calls notFound() for reserved paths (slug[0] === \"_next\"), or missing chunks return wrong-MIME 200s. SIMPLEST first install: set `routing: false` to skip the catch-all entirely.\n\nExtending: add an app = one manifest entry; add a shell feature = a new defineFeature({id, slots}) listed in features[]. No surface edits ever (open/closed). exampleCode ships BOTH variants: Variant A = routing:false mount in app/page.tsx (simplest); Variant B = catch-all app/[[...slug]]/page.tsx with routing on + app slugs for addressable, deep-linkable URLs (the catch-all MUST notFound() \"_next\")."
+    },
     {
       "slug": "convex-auth",
       "title": "Convex Auth — Multi-Provider Sign-in",
       "category": "auth",
       "kind": "backend",
-      "version": "0.2.1",
-      "description": "@convex-dev/auth with Password (PBKDF2-SHA256 100k, self-hosted-friendly), Anonymous (guest), Google OAuth, and Resend magic-link. Ships a production SignInPage with i18n, prop-driven provider list, and split Login/Register tabs. No Clerk.",
+      "version": "0.3.0",
+      "description": "@convex-dev/auth with Password (PBKDF2-SHA256 100k, self-hosted-friendly), Anonymous (guest), Google OAuth, and Resend magic-link. Ships a production SignInPage plus a presentational, props-driven AuthCard (v0.3) — choose `methods` (google, github, magic-link, password signin/signup tabs, phone OTP, anonymous) and render the card anywhere with different props; handlers default to a mock so it's interactive with zero wiring. i18n via labels. No Clerk.",
       "source": "rahmanef63/resource-site",
       "slicePath": "frontend/slices/convex-auth",
       "convexPaths": [
@@ -2627,7 +2526,8 @@
         "input",
         "label",
         "tabs",
-        "alert"
+        "alert",
+        "input-otp"
       ],
       "env": [
         {
@@ -2795,12 +2695,13 @@
       "title": "Resend — Transactional & Newsletter",
       "category": "email",
       "kind": "backend",
-      "version": "0.1.2",
-      "description": "Transactional email + newsletter blast via Resend. Double opt-in flow + audience segmentation. Magic-link delivery for Convex Auth.",
+      "version": "0.1.3",
+      "description": "Transactional email + newsletter blast via Resend. Double opt-in flow + audience segmentation. Magic-link delivery for Convex Auth. Bundles the subscribers list backend (subscribe / confirm / unsubscribe / count) — formerly the standalone `subscribers` slice, merged here in v0.1.3.",
       "source": "rahmanef63/resource-site",
       "slicePath": "frontend/slices/resend-newsletter",
       "convexPaths": [
-        "convex/features/newsletter"
+        "convex/features/newsletter",
+        "convex/features/subscribers"
       ],
       "npm": [
         "resend@^4.0.0"
@@ -2838,7 +2739,7 @@
       "title": "AI Chat — Workbench / Sidebar / Search",
       "category": "ai",
       "kind": "full",
-      "version": "0.1.0",
+      "version": "0.2.0",
       "description": "One conversational AI feature, three render modes. Same Convex backend (threads + streaming + tool calls + RAG), pick the surface via prop:\n\n  • workbench — Claude.ai / ChatGPT three-column page (default)\n  • sidebar — collapsible copilot panel inside another CRUD app\n  • search — single-question + answer + citations (Perplexity)\n\nUse cases:\n  – Customer-support chatbot embedded in your marketing site\n  – Developer copilot in your PR/docs admin\n  – Knowledge-base search over your blog + docs corpus\n  – Internal AI assistant in your dashboard\n\nWhat it ships: multi-provider (Anthropic / OpenAI / Google / Mistral / Ollama), multimodal (text + image + PDF + audio), typed tool calls with inline inspector, agent mode (plan→execute→reflect), branching threads, RAG citations, resumable streams, usage telemetry. Public surface = consumer chat; admin surface = persona, fallback, guardrails per-bot.",
       "source": "rahmanef63/resource-site",
       "slicePath": "frontend/slices/ai-chat",
@@ -3178,35 +3079,6 @@
       ],
       "agentRecipe": "Run `npx rr add vector-search`. Add embedding field + vectorIndex per searchable table. Re-embed on upsert via Convex action. Cache embeddings — don't re-call OpenAI on every read."
     },
-    {
-      "slug": "mdx-blog",
-      "title": "MDX Blog",
-      "category": "content",
-      "kind": "ui",
-      "version": "0.2.0",
-      "description": "Markdown-with-JSX untuk blog post. File-based MDX content collection. Portable defineMdxBlog(opts) factory dengan 4 config props (basePath, contentDir, labels.list, nav) — defaults preserve legacy /blog + content/blog. Auto-generate ToC, reading-time, syntax highlight, plus embed React components inline.",
-      "source": "rahmanef63/resource-site",
-      "slicePath": "frontend/slices/mdx-blog",
-      "convexPaths": [],
-      "npm": [
-        "@next/mdx@^16.0.0",
-        "gray-matter@^4.0.3",
-        "rehype-pretty-code@^0.14.0"
-      ],
-      "shadcn": [
-        "card"
-      ],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "content",
-        "blog",
-        "mdx",
-        "static"
-      ],
-      "agentRecipe": "Run `npx rr add mdx-blog`. Store post body sebagai markdown di content/blog/*.mdx. Render dengan MDXRemote di [slug]/page.tsx. Auto-extract headings ke ToC via remark plugin custom."
-    },
     {
       "slug": "cal-com-booking",
       "title": "Cal.com Booking",
@@ -3247,32 +3119,6 @@
       ],
       "agentRecipe": "Run `npx rr add cal-com-booking`. Embed Cal.com via @calcom/embed-react di halaman services. Configure webhook di Cal.com dashboard → POST ke /api/cal-webhook → upsert booking di Convex."
     },
-    {
-      "slug": "full-width-toggle",
-      "title": "Full Width Toggle",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.1",
-      "description": "Page-container width toggle (contained / wide / full). Per-device localStorage + cross-tab sync. Ships useFullWidth hook + FullWidthToggle button (icon/button/segment variants) + WidthContainer wrapper. Zero backend, zero env.",
-      "source": "rahmanef63/resource-site",
-      "slicePath": "frontend/slices/full-width-toggle",
-      "convexPaths": [],
-      "npm": [],
-      "shadcn": [
-        "button"
-      ],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "ui",
-        "layout",
-        "preference",
-        "localstorage",
-        "dashboard"
-      ],
-      "agentRecipe": "Run `npx rr add full-width-toggle`. Drop <WidthContainer> around page content, <FullWidthToggle variant='icon' /> in topbar. Variant 'segment' best for settings page. Hook useFullWidth() returns [mode, setMode, cycle]. SSR-safe — defaults to 'contained' until hydrate."
-    },
     {
       "slug": "command-menu",
       "title": "Command Menu",
@@ -3376,13 +3222,7 @@
         "tooltip"
       ],
       "env": [],
-      "peers": [
-        {
-          "slug": "full-width-toggle",
-          "range": "^0.1",
-          "reason": "Topbar surfaces the width toggle when this is mounted."
-        }
-      ],
+      "peers": [],
       "providers": [],
       "tags": [
         "ui",
@@ -3451,30 +3291,34 @@
     },
     {
       "slug": "rbac-roles",
-      "title": "RBAC — Tiered System Roles",
+      "title": "RBAC — Roles & Permissions",
       "category": "auth",
-      "kind": "backend",
-      "version": "0.1.0",
-      "description": "Workspace-scoped RBAC with 6 system roles (owner/admin/manager/staff/client/guest) and three tier presets — solo, influencer, organization. Env-based platform admin bypass via PLATFORM_ADMIN_EMAILS. checkPermission / requirePermission helpers, role seeding mutation, @convex-dev/auth aware (no Clerk).",
+      "kind": "full",
+      "version": "0.2.0",
+      "description": "RBAC engine ported from superspace. 6 system role presets (owner/admin/manager/staff/client/guest with levels), dot-namespaced permissions with `*` / `feature.*` wildcard matching, and pure check helpers (resolvePermissions / hasPermission / roleHasPermission). Props-driven UI primitives: <PermissionGate>, usePermissions, <RoleBadge>, <PermissionMatrix>. Convex template ships a tenant-scoped rbac_roles table + checkPermission / requirePermission helpers + idempotent seedSystemRoles, with a PLATFORM_ADMIN_EMAILS superadmin bypass. Pair with `user-management` for the members / invites / roles-admin UI. @convex-dev/auth aware — no Clerk.",
       "source": "superspace",
-      "slicePath": "",
+      "slicePath": "frontend/slices/rbac-roles",
       "convexPaths": [
-        "template-base/convex/lib/rbac"
+        "convex/features/rbac-roles"
       ],
       "npm": [],
-      "shadcn": [],
+      "shadcn": [
+        "badge",
+        "checkbox",
+        "label"
+      ],
       "env": [
         {
           "name": "PLATFORM_ADMIN_EMAILS",
           "scope": "convex",
-          "description": "Comma-separated emails granted cross-workspace admin."
+          "description": "Comma-separated emails granted cross-tenant superadmin (`*`)."
         }
       ],
       "peers": [
         {
           "slug": "convex-auth",
           "range": "^0.1",
-          "reason": "RBAC checks the authed user identity."
+          "reason": "RBAC checks resolve the authed user via getAuthUserId."
         }
       ],
       "providers": [],
@@ -3483,35 +3327,91 @@
         "auth",
         "permissions",
         "roles",
-        "workspaces"
+        "authorization",
+        "no-clerk",
+        "convex"
       ],
-      "agentRecipe": "Run `npx rr add rbac-roles`. Three tier presets pick which system roles to seed: solo (owner+admin), influencer (+manager), organization (6 roles). Platform admin via env PLATFORM_ADMIN_EMAILS bypasses all checks. Resolution: platform admin → workspace owner → membership.additionalPermissions → role.permissions."
+      "agentRecipe": "Run `npx rr add rbac-roles`. Frontend: import { PermissionGate, usePermissions, RoleBadge, PermissionMatrix, resolvePermissions, ROLE_PRESETS } from \"@/features/rbac-roles\". Feed usePermissions/PermissionGate the actor's resolved permission list (from your membership query or resolvePermissions(roleSlug)). Convex: spread rbacRolesTables into your schema, call seedSystemRoles({tenantId}) once, gate privileged fns with requirePermission(ctx, tenantId, \"members.manage\"). Set PLATFORM_ADMIN_EMAILS for superadmins. Add the user-management slice for the members/invites UI (provides um_members)."
     },
     {
-      "slug": "admin-panel",
-      "title": "Admin Panel — Unified Product Admin",
-      "category": "infra",
+      "slug": "user-management",
+      "title": "User Management",
+      "category": "auth",
       "kind": "full",
-      "version": "0.1.0",
-      "description": "17-section admin surface (events, funnels, attribution, users, A/B, flags, pricing, CMS, email, audit, ...) gated by RBAC. Auto-filters sidebar by tier (solo/influencer/organization) and user permissions. Single backend resolver (getMyAdminAccess) mirrors frontend gate so UI can never leak.",
-      "source": "superspace + spec",
-      "slicePath": "template-base/frontend/slices/admin-panel",
+      "version": "0.6.0",
+      "description": "Full superspace-parity user management, props-driven + RBAC-agnostic. <UserManagementPanel> tabs Members + Roles + Teams + Access: member table (search / filter / sort, inline role dropdown, soft-remove), InviteDialog (with an optional 'propagate to sub-workspaces' toggle — same / step-down role strategy) + PendingInvites, a RolesPanel (custom roles via permission matrix; system roles read-only), a TeamsPanel (named user groups), and an AccessMatrix (users × tenants grid with inline role assignment). All permission-gated. You pass `roles` + `currentPerms` + the permission catalog (resolved from rbac-roles) + callbacks; the slice imports no other slice's frontend. Convex ships um_members + um_invites + um_teams + um_team_members + um_tenant_links + member / invite / team / hierarchy endpoints + getAccessMatrix (gated via rbac-roles' requirePermission); roles CRUD reuses rbac-roles'. The hierarchy is a generic edge tree — rr never owns the tenant entities. P0–P4c: the complete user-management epic.",
+      "source": "superspace",
+      "slicePath": "frontend/slices/user-management",
       "convexPaths": [
-        "template-base/convex/features/admin-panel"
+        "convex/features/user-management"
       ],
       "npm": [],
       "shadcn": [
-        "card",
+        "avatar",
         "badge",
-        "button"
+        "button",
+        "checkbox",
+        "dialog",
+        "dropdown-menu",
+        "input",
+        "label",
+        "select",
+        "switch",
+        "table",
+        "tabs",
+        "textarea"
       ],
       "env": [],
       "peers": [
         {
           "slug": "rbac-roles",
-          "range": "^0.1",
-          "reason": "Admin sections require RBAC perms — must seed roles first."
-        }
+          "range": "^0.2",
+          "reason": "Roles + resolved permissions + convex permission helpers (requirePermission, getActorPermissions)."
+        },
+        {
+          "slug": "convex-auth",
+          "range": "^0.1",
+          "reason": "Member identity (name/email/avatar) joined from the users table."
+        }
+      ],
+      "providers": [],
+      "tags": [
+        "user-management",
+        "members",
+        "rbac",
+        "auth",
+        "team",
+        "admin",
+        "convex",
+        "no-clerk"
+      ],
+      "agentRecipe": "Run `npx rr add user-management` (pulls rbac-roles + convex-auth). Frontend: <MembersPanel members={useQuery(api[\"features/user-management/query\"].listMembers,{tenantId})} roles={ROLE_PRESETS.map(r=>({slug:r.slug,name:r.name,color:r.color}))} currentPerms={actorPerms} onUpdateRole={useMutation(...updateMemberRole)} onRemove={useMutation(...removeMember)} onInvite={openInvite} />. Wire roles + currentPerms from rbac-roles at the app level — the slice itself imports no other slice. Convex: spread userManagementTables; listMembers/mutations gate via rbac-roles requirePermission."
+    },
+    {
+      "slug": "admin-panel",
+      "title": "Admin Panel — Unified Product Admin",
+      "category": "infra",
+      "kind": "full",
+      "version": "0.1.0",
+      "description": "17-section admin surface (events, funnels, attribution, users, A/B, flags, pricing, CMS, email, audit, ...) gated by RBAC. Auto-filters sidebar by tier (solo/influencer/organization) and user permissions. Single backend resolver (getMyAdminAccess) mirrors frontend gate so UI can never leak.",
+      "source": "superspace + spec",
+      "slicePath": "template-base/frontend/slices/admin-panel",
+      "convexPaths": [
+        "template-base/convex/features/admin-panel"
+      ],
+      "npm": [],
+      "shadcn": [
+        "card",
+        "badge",
+        "button"
+      ],
+      "env": [],
+      "peers": [
+        {
+          "slug": "rbac-roles",
+          "range": "^0.1",
+          "reason": "Admin sections require RBAC perms — must seed roles first."
+        }
       ],
       "providers": [],
       "tags": [
@@ -3629,90 +3529,6 @@
       ],
       "agentRecipe": "Run `npx rr add activity`. Spread `activityTables` into your root Convex schema. Wrap the unauthenticated `create`/`update`/`remove` `internalMutation`s with your auth model (see README Install section). Render `<ActivityFeed rows={await fetchQuery(api.activity.listPublic)} stats={await fetchQuery(api.activity.statsThisWeek)} />`. Override `copy`, `categoryLabels`, `locale` per consumer. MCP integration: map `activity_create` tool → your wrapped `create` mutation."
     },
-    {
-      "slug": "i18n-translate",
-      "title": "i18n — Google Translate widget",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Drop-in Google Translate widget. Replaces hand-maintained locale dictionaries with on-the-fly translation to a curated locale list (16 default, prop-override). No API key, no Google Cloud billing. Auto-detect browser language on first visit, persist user choice via localStorage, click-to-reload language switching with router-refresh + in-place fallback strategies. Lifted 2026-05-27 from rahmanef.com; 510-LOC monolith split into 8 sub-files for the 200-LOC cap; project-specific Tailwind utilities stripped from defaults.",
-      "source": "rahmanef.com",
-      "slicePath": "frontend/slices/i18n-translate",
-      "convexPaths": [],
-      "npm": [
-        "lucide-react@^0.400.0",
-        "next@^15",
-        "react@^18"
-      ],
-      "shadcn": [],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "i18n",
-        "translate",
-        "google-translate",
-        "ui",
-        "language-switcher",
-        "locale",
-        "widget"
-      ],
-      "agentRecipe": "Run `npx rr add i18n-translate`. Mount `<GoogleTranslate />` anywhere (e.g. header). Add the CSP allowlist from README.md to your middleware/proxy — without it Google's script fails silently. Override `languages`, `storageKey`, and the four `*ClassName` props for per-project styling. Default `fallbackRefresh=\"reload\"` is the only path that works reliably across Next Cache Components — only opt into `\"router\"` or `\"none\"` if you've tested it on your tree."
-    },
-    {
-      "slug": "cta",
-      "title": "Call to Action",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Brutalist call-to-action section — eyebrow label, serif headline, body, arrow CTA. Pair with CtaButton standalone for inline placements. Lifted 2026-05-16 from rahmanef.com; assumes Tailwind tracking-brutal / tracking-brutal-sm utilities OR drop them for the default tracking scale.",
-      "source": "rahmanef.com",
-      "slicePath": "frontend/slices/cta",
-      "convexPaths": [],
-      "npm": [
-        "lucide-react@^0.400.0"
-      ],
-      "shadcn": [],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "ui",
-        "marketing",
-        "cta",
-        "section",
-        "brutalist"
-      ],
-      "agentRecipe": "Run `npx rr add cta`. <CtaView eyebrow title body href ctaLabel /> renders the full section; <CtaButton href label /> drops a standalone arrow button anywhere. Override tracking-brutal utilities in tailwind.config or swap for tracking-wide if your design system has no brutal preset."
-    },
-    {
-      "slug": "hero",
-      "title": "Hero",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.1",
-      "description": "Editorial split-grid landing hero — eyebrow pill + large serif H1 + italic pull-quote + 1-2 button CTA row + right-column portrait card with optional caption. Fully props-driven (title/quote/ctas/image). Sanitized from rahmanef.com on 2026-05-16: SITE_CONFIG hardcode dropped, custom Heading/Section primitives replaced with raw semantic elements + stock Tailwind tracking-widest so the slice ships without consumer preset utilities.",
-      "source": "rahmanef.com",
-      "slicePath": "frontend/slices/hero",
-      "convexPaths": [],
-      "npm": [
-        "lucide-react@^0.400.0"
-      ],
-      "shadcn": [],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "ui",
-        "hero",
-        "marketing",
-        "landing",
-        "section",
-        "editorial",
-        "brutalist"
-      ],
-      "agentRecipe": "Run `npx rr add hero`. <HeroView title eyebrow quote ctas image imageCaption /> — all props optional except title. Pass `image={undefined}` for text-only hero (auto-collapses to single 12-column row). Pairs visually with cta slice (same brutalist border + serif scale)."
-    },
     {
       "slug": "rate-limit",
       "title": "Rate Limit",
@@ -3739,45 +3555,6 @@
       ],
       "agentRecipe": "Run `npx rr add rate-limit`. Compose `rateLimitTables` into root convex/schema.ts. Wire `internal.features.rate_limit.mutations._pruneExpired` into convex/crons.ts every 5 min. Call `api.features.rate_limit.mutations.consume({ key, limit, windowMs })` from server-side handlers — keep a fail-open wrapper so a Convex outage doesn't 503 the route."
     },
-    {
-      "slug": "subscribers",
-      "title": "Subscribers",
-      "category": "email",
-      "kind": "backend",
-      "version": "0.1.0",
-      "description": "Newsletter list with honeypot + per-email rate-limit + token-based unsubscribe + admin remove. Public `subscribe` returns status strings (`created` / `already` / `resubscribed` / `honeypot`); admin `listAll` / `count` queries gated by `requireAdmin` (rr `_shared/auth`). Lifted 2026-05-16 from rahmanef.com; sanitized: token args dropped, sibling `analyticsEvents` insert removed — wrap subscribe in a consumer action if you want funnel telemetry.",
-      "source": "rahmanef.com",
-      "slicePath": "frontend/slices/subscribers",
-      "convexPaths": [
-        "convex/features/subscribers"
-      ],
-      "npm": [],
-      "shadcn": [],
-      "env": [
-        {
-          "name": "SUPER_ADMIN_EMAIL",
-          "scope": "convex",
-          "required": false,
-          "description": "Optional super-admin gate for admin queries."
-        }
-      ],
-      "peers": [
-        {
-          "slug": "convex-auth",
-          "range": "^0.1",
-          "reason": "requireAdmin uses getAuthUserId from @convex-dev/auth."
-        }
-      ],
-      "providers": [],
-      "tags": [
-        "email",
-        "newsletter",
-        "subscribers",
-        "convex",
-        "backend"
-      ],
-      "agentRecipe": "Run `npx rr add subscribers`. Compose `subscribersTables` into root convex/schema.ts. Public form posts `api.features.subscribers.mutations.subscribe({ email, source, website })` — `website` is the honeypot, leave it `\"\"` from the form. Render unsubscribe link `/unsubscribe?t=<token>` and call `unsubscribe({ token })`."
-    },
     {
       "slug": "testimonials",
       "title": "Testimonials",
@@ -3855,45 +3632,6 @@
       ],
       "agentRecipe": "Run `npx rr add services`. Compose `servicesTables` into root schema. Use `useQuery(api.features.services.queries.listAll)` from a server component / route to render service cards. CRUD via admin UI calling `create` / `update` / `remove` after `requireAdmin` passes."
     },
-    {
-      "slug": "socials",
-      "title": "Socials",
-      "category": "content",
-      "kind": "backend",
-      "version": "0.1.1",
-      "description": "Single source of truth for profile/social links. Powers JSON-LD `Person.sameAs` (Google entity graph), IndieWeb `<link rel=\"me\">` tags, and footer/contact/about UI surfaces. URL-deduped, ordered, `visible` / `featured` / `relMe` / `sameAs` flags. Lifted 2026-05-16 from rahmanef.com; token-based admin gate swapped, baked-in 14-platform rahmanef seed dropped — `seed` now takes items via args so each adopter ships their own list.",
-      "source": "rahmanef.com",
-      "slicePath": "frontend/slices/socials",
-      "convexPaths": [
-        "convex/features/socials"
-      ],
-      "npm": [],
-      "shadcn": [],
-      "env": [
-        {
-          "name": "SUPER_ADMIN_EMAIL",
-          "scope": "convex",
-          "required": false
-        }
-      ],
-      "peers": [
-        {
-          "slug": "convex-auth",
-          "range": "^0.1",
-          "reason": "requireAdmin uses getAuthUserId from @convex-dev/auth."
-        }
-      ],
-      "providers": [],
-      "tags": [
-        "content",
-        "socials",
-        "seo",
-        "indieweb",
-        "convex",
-        "backend"
-      ],
-      "agentRecipe": "Run `npx rr add socials`. Compose `socialsTables` into root schema. Bootstrap with `npx convex run internal.features.socials.mutations.seed '{\"items\":[{\"platform\":\"github\",\"url\":\"https://github.com/<you>\",\"order\":1,\"visible\":true,\"featured\":true,\"sameAs\":true,\"relMe\":true}]}'`. Wire `useQuery(api.features.socials.queries.listVisible)` into footer for entity-graph SEO."
-    },
     {
       "slug": "create-your-mcp",
       "title": "Create Your MCP",
@@ -4119,7 +3857,7 @@
       "category": "content",
       "kind": "full",
       "version": "0.2.1",
-      "description": "Polymorphic-target threaded comments. Consumer picks `TargetRef = { kind, id, subId? }` (e.g. page+block, blog+slug, task+id). Renderless <CommentsThread> + <CommentsAnchor> wrappers. useComments(bindings, opts) hook returns items + openCount + CRUD + forbiddenWords guard. Adapter pattern — see contract-negotiations §1.",
+      "description": "Polymorphic-target threaded comments. Consumer picks `TargetRef = { kind, id, subId? }` (e.g. page+block, blog+slug, task+id). Reply nesting is real: `parentId` end-to-end + `buildThread(flat) → CommentNode[]` tree (oldest-first, orphan-safe). Renderless <CommentsThread> + <CommentsAnchor> wrappers; useComments(bindings, opts) returns items + `tree` + openCount + CRUD + forbiddenWords guard. Adapter pattern — see contract-negotiations §1.",
       "source": "rahmanef63/resource-site",
       "slicePath": "frontend/slices/comments",
       "convexPaths": [
@@ -4188,121 +3926,51 @@
       "agentRecipe": "Run `rr add seo`. Call seo.generate from server actions or admin mutations with `personaContext` describing your brand voice (or rely on the generic default). Cost guard rate-limits per-user within 24h via callsInWindow query."
     },
     {
-      "slug": "document-checklist",
-      "title": "Document Checklist — Job-Search Doc Tracker",
+      "slug": "markdown",
+      "title": "Markdown — page container with CRUD tabs + diagrams",
       "category": "content",
-      "kind": "full",
-      "version": "0.1.0",
-      "description": "Track required job-search documents (CV, KTP, ijazah, etc.) with country-scoped seed templates and per-user completion state. Ships an Indonesian default checklist. Toggle completed + notes + expiry per item.",
-      "source": "rahmanef63/CareerPack",
-      "slicePath": "frontend/slices/document-checklist",
-      "convexPaths": [
-        "convex/features/document-checklist"
-      ],
-      "npm": [
-        "lucide-react"
-      ],
-      "shadcn": [
-        "badge",
-        "button",
-        "card",
-        "dialog",
-        "label",
-        "popover",
-        "calendar",
-        "progress",
-        "scroll-area",
-        "skeleton",
-        "tabs",
-        "textarea"
-      ],
-      "env": [],
-      "peers": [
-        {
-          "slug": "convex-auth",
-          "range": "^0.1",
-          "reason": "Auth identity for user-scoped checklist state."
-        }
-      ],
-      "providers": [],
-      "tags": [
-        "career",
-        "documents",
-        "checklist",
-        "job-search",
-        "indonesia"
-      ],
-      "agentRecipe": "Run `rr add document-checklist`. Wire <DocumentChecklist bindings={{ current, seed, updateStatus }} countryTemplateSlot={<CountryTemplateCard bindings={{ templates, getTemplate, instantiate }} />} /> — bindings sourced from api.features['document-checklist'].* queries/mutations."
-    },
-    {
-      "slug": "pricing-page",
-      "title": "Pricing Page",
-      "category": "ui",
       "kind": "ui",
-      "version": "0.1.0",
-      "description": "Canonical pricing tier section — eyebrow + headline + 2/3/4 column tier grid with optional FAQ accordion below. Tiers fully data-driven (name/price/period/bullets/cta/featured/badge). Featured variant configurable (ring/scale/tint). Single SSOT — every saas/marketing template consumes this slice for pricing pages so admin-edited tiers propagate without per-template rewriting.",
-      "source": "rahman-resources",
-      "slicePath": "frontend/slices/pricing-page",
-      "convexPaths": [],
-      "npm": [
-        "lucide-react@^0.400.0"
-      ],
-      "shadcn": [
-        "button",
-        "card",
-        "accordion"
-      ],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "ui",
-        "pricing",
-        "section",
-        "marketing",
-        "saas",
-        "tiers",
-        "faq"
-      ],
-      "agentRecipe": "Run `npx rr add pricing-page`. <PricingSection eyebrow title subtitle tiers columns faq faqTitle featuredVariant /> — only `title` + `tiers` required. Each tier: `{ id, name, price, period?, blurb?, bullets[], cta?, featured?, badge? }`. Pass `featuredVariant=\"scale\"` for a popped-forward card or `\"tint\"` for a colored background. Wire admin CRUD via your store hook → useTiers() → pass array."
-    },
-    {
-      "slug": "feature-grid",
-      "title": "Feature Grid",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Canonical features grid section — eyebrow + headline + 1/2/3/4 column item grid in three layout variants (cards, minimal, alternating). Items accept Lucide icon component OR string label, optional image (next/image), optional link CTA. Single SSOT — every template consumes this slice for features pages so admin-edited items propagate without per-template duplication.",
+      "version": "0.2.0",
+      "description": "Markdown (.md) page container with optional CRUD surfaces. <MarkdownPage content={md} tabs={['read','write','review']}/> — Read renders rich text (headings, lists, todo, GitHub-style callouts, fenced code, KaTeX, tables, images, <details> toggles, inline marks); Write is a raw-source editor with snippet toolbar + live preview; Review overlays block-anchored comments (add/resolve, controlled via onAddComment/onResolveComment or internal fallback). Fenced ```mermaid blocks render as SVG diagrams (dynamic-imported mermaid) and ```chart blocks as recharts bar/line/area/pie from a JSON spec. Self-contained: ships its own parser (parseMarkdown → MdNode[]) + inline renderer, no notion runtime dependency. Sync is by shared grammar: the notion cluster's blocksToMarkdown / markdownToBlocks bridge (@notion/shared/lib/markdown) emits/consumes the exact same markdown this slice parses, so anything readable in the notion block page is readable here and vice-versa. No store, no Convex — comments CRUD is consumer-wired callbacks.",
       "source": "rahman-resources",
-      "slicePath": "frontend/slices/feature-grid",
+      "slicePath": "frontend/slices/markdown",
       "convexPaths": [],
       "npm": [
+        "katex@^0.16",
+        "mermaid@^11",
+        "recharts@^3",
         "lucide-react@^0.400.0"
       ],
       "shadcn": [
         "button",
-        "card"
+        "tabs",
+        "textarea"
       ],
       "env": [],
       "peers": [],
       "providers": [],
       "tags": [
-        "ui",
-        "features",
-        "section",
-        "marketing",
-        "grid",
-        "saas"
+        "content",
+        "markdown",
+        "reader",
+        "editor",
+        "review",
+        "comments",
+        "mermaid",
+        "chart",
+        "rich-text",
+        "docs",
+        "notion-sync"
       ],
-      "agentRecipe": "Run `npx rr add feature-grid`. <FeatureGridSection eyebrow title subtitle items columns layout align /> — only `items` required. Each item: `{ id, title, body, icon?, image?, link? }`. `icon` can be a LucideIcon component (rendered as 5×5 inline) or a string (rendered as letter fallback). `layout=\"alternating\"` produces image+text rows that flip per index — set `image` per item for that variant."
+      "agentRecipe": "Run `npx rr add markdown`. Read-only: `<MarkdownReader content={md}/>`. Full surface: `<MarkdownPage content={md} tabs={['read','write','review']} onContentChange={save} comments={list} onAddComment={add} onResolveComment={resolve}/>` (omit callbacks for internal-state demo mode). Diagrams: fence ```mermaid; charts: fence ```chart with { type: bar|line|area|pie, data: [...] }. To bridge from the notion editor call `blocksToMarkdown(page.blocks)` from `@notion/shared/lib/markdown`; reverse with `markdownToBlocks(md)`."
     },
     {
       "slug": "landing-sections",
       "title": "Landing Sections",
       "category": "infra",
       "kind": "ui",
-      "version": "0.1.0",
-      "description": "CRUD-driven admin editor for the public landing-page composition. Ships a pure reducer + LandingProvider store adapter + admin LandingView/LandingEditorView built on the shared CRUD primitives, plus a per-section LandingSectionShell that handles background image + custom Tailwind className overlay. Sections carry { kind, order, title, subtitle, enabled, imageUrl, imageRatio, bgImageUrl, className, config (JSON) } with up/down reorder arrows. Consumers map each `kind` (hero, features, pricing, blog, changelog, testimonials, portfolio, services, stats, newsletter, faq, cta, custom) to their own renderer wrapped in <LandingSectionShell>. Canonical pattern used by all 7 rr website templates.",
+      "version": "0.2.0",
+      "description": "Canonical landing-page composition slice — replaces the former standalone hero / cta / pricing-page / faq-section / feature-grid / testimonials-grid / blog-section / portfolio-section / changelog-feed slices (all merged here as `kind` variants in v0.2.0). Ships a pure reducer + LandingProvider store adapter + admin LandingView/LandingEditorView built on the shared CRUD primitives, plus a per-section LandingSectionShell that handles background image + custom Tailwind className overlay. Sections carry { kind, order, title, subtitle, enabled, imageUrl, imageRatio, bgImageUrl, className, config (JSON) } with up/down reorder arrows. Consumers map each `kind` (hero, features, pricing, blog, changelog, testimonials, portfolio, services, stats, newsletter, faq, cta, custom) to their own renderer wrapped in <LandingSectionShell>. Used by all 7 rr website templates.",
       "source": "rahman-resources",
       "slicePath": "frontend/slices/landing-sections",
       "convexPaths": [],
@@ -4332,171 +4000,6 @@
       ],
       "agentRecipe": "Run `npx rr add landing-sections`. Fold `landingReducer` into your root reducer (cases LANDING_UPSERT + LANDING_DELETE), seed State.landingSections with `defaultLandingSections()`, wrap your StoreProvider with `<LandingProvider value={adapter}/>` where adapter maps {items, publicBase, adminBase, create, update, remove} from your dispatch. Mount `<LandingView/>` at `/admin/landing` and `<LandingEditorView id={params.id}/>` at `/admin/landing/[id]`. In HomePage iterate `state.landingSections.filter(s => s.enabled).sort((a,b) => a.order - b.order)` and render each through `<LandingSectionShell section={s}>` wrapping your own per-`kind` renderer."
     },
-    {
-      "slug": "faq-section",
-      "title": "FAQ Section",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Canonical FAQ accordion section — eyebrow + headline + accordion item list. Three layouts (single column, two-column, grouped by category). Optional footer CTA (\"Still have questions?\"). Items fully data-driven. Single SSOT — every template consumes this slice for FAQ blocks so admin-edited Q&A propagates without per-template rewrite.",
-      "source": "rahman-resources",
-      "slicePath": "frontend/slices/faq-section",
-      "convexPaths": [],
-      "npm": [],
-      "shadcn": [
-        "accordion",
-        "button"
-      ],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "ui",
-        "faq",
-        "section",
-        "accordion",
-        "marketing"
-      ],
-      "agentRecipe": "Run `npx rr add faq-section`. <FAQSection items title subtitle layout multiple defaultOpen footerCta /> — only `items` required. Each item: `{ id, q, a, category? }`. `layout=\"grouped\"` buckets by `category`. `multiple` lets users open several at once. `footerCta={{ label, href }}` wires a contact link below the accordion."
-    },
-    {
-      "slug": "testimonials-grid",
-      "title": "Testimonials Grid",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Canonical testimonials section — quote + author + role/company + optional avatar + optional star rating. Three layouts (uniform cards grid, centered quote-stack, CSS masonry). `featured` testimonials get a ring accent. Pairs naturally with the `testimonials` backend slice (Convex queries) but has zero coupling — pass any item array.",
-      "source": "rahman-resources",
-      "slicePath": "frontend/slices/testimonials-grid",
-      "convexPaths": [],
-      "npm": [
-        "lucide-react@^0.400.0"
-      ],
-      "shadcn": [
-        "avatar",
-        "button",
-        "card"
-      ],
-      "env": [],
-      "peers": [
-        {
-          "slug": "testimonials",
-          "range": "^0.1",
-          "reason": "Optional — pair with backend testimonials slice for full admin CRUD + storage."
-        }
-      ],
-      "providers": [],
-      "tags": [
-        "ui",
-        "testimonials",
-        "section",
-        "marketing",
-        "social-proof",
-        "saas"
-      ],
-      "agentRecipe": "Run `npx rr add testimonials-grid`. <TestimonialsGridSection items title subtitle columns layout align /> — only `items` required. Each item: `{ id, quote, author, role?, company?, avatar?, rating?, featured? }`. `layout=\"quote-stack\"` renders a centered no-card scroll for editorial sites. `layout=\"masonry\"` uses CSS columns for variable-height quotes."
-    },
-    {
-      "slug": "blog-section",
-      "title": "Blog Section",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Canonical blog list + detail section. <BlogListSection> renders 3 layouts (cards grid, minimal list, featured-split with hero + side rail). <BlogPostView> renders the single-post page with cover + meta + paragraph-split body. Both pass through `hrefFor`/`backHref` so each template controls routing — single SSOT for /blog and /blog/[slug] across all templates.",
-      "source": "rahman-resources",
-      "slicePath": "frontend/slices/blog-section",
-      "convexPaths": [],
-      "npm": [
-        "lucide-react@^0.400.0"
-      ],
-      "shadcn": [
-        "badge",
-        "button",
-        "card",
-        "separator"
-      ],
-      "env": [],
-      "peers": [
-        {
-          "slug": "mdx-blog",
-          "range": "^0.1",
-          "reason": "Optional — pair with mdx-blog backend slice for MDX-rendered posts."
-        }
-      ],
-      "providers": [],
-      "tags": [
-        "ui",
-        "blog",
-        "section",
-        "marketing",
-        "content",
-        "list",
-        "detail"
-      ],
-      "agentRecipe": "Run `npx rr add blog-section`. <BlogListSection posts hrefFor title columns layout limit /> for /blog — `hrefFor(post)` returns the per-post URL. <BlogPostView post backHref renderBody /> for /blog/[slug] — `renderBody` defaults to paragraph-split on `\\n\\n` (swap for an MDX renderer if you use mdx-blog)."
-    },
-    {
-      "slug": "changelog-feed",
-      "title": "Changelog Feed",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Canonical /changelog or /whats-new section. Entries support 5 kinds (feature/improvement/fix/chore/breaking) with color-coded badges. Three layouts (timeline with date-rail, large cards, minimal list). Optional `limit` for \"Recent updates\" excerpts on home pages. Optional `groups` per entry for sub-sectioned bullet lists.",
-      "source": "rahman-resources",
-      "slicePath": "frontend/slices/changelog-feed",
-      "convexPaths": [],
-      "npm": [],
-      "shadcn": [
-        "badge",
-        "card",
-        "separator"
-      ],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "ui",
-        "changelog",
-        "section",
-        "saas",
-        "release-notes",
-        "marketing"
-      ],
-      "agentRecipe": "Run `npx rr add changelog-feed`. <ChangelogFeedSection entries title subtitle layout sortDescending limit /> — only `entries` required. Each entry: `{ id, version, date, kind, title, body, bullets?, groups? }`. `layout=\"timeline\"` adds a left date-rail; `layout=\"list\"` is the most compact. Pass `limit={3}` on home pages to show recent releases."
-    },
-    {
-      "slug": "portfolio-section",
-      "title": "Portfolio Section",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Canonical portfolio list + detail section. <PortfolioListSection> renders 3 layouts (uniform 16:9 grid, CSS masonry, asymmetric with featured hero). <PortfolioDetailView> renders title + meta + cover + body + gallery + external link + related items. Both pass through `hrefFor`/`backHref` so each template controls routing — single SSOT for /portfolio and /portfolio/[slug] across agency-studio and personal-brand.",
-      "source": "rahman-resources",
-      "slicePath": "frontend/slices/portfolio-section",
-      "convexPaths": [],
-      "npm": [
-        "lucide-react@^0.400.0"
-      ],
-      "shadcn": [
-        "badge",
-        "button",
-        "card",
-        "separator"
-      ],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "ui",
-        "portfolio",
-        "section",
-        "marketing",
-        "case-study",
-        "list",
-        "detail"
-      ],
-      "agentRecipe": "Run `npx rr add portfolio-section`. <PortfolioListSection items hrefFor title columns layout limit /> for /portfolio — each item `{ id, slug, title, summary?, year?, client?, role?, tags?, cover: {src,alt}, gallery?, link? }`. <PortfolioDetailView item backHref renderBody related hrefForRelated /> for /portfolio/[slug] — `renderBody` defaults to paragraph split; override for project-specific layouts (problem/approach/result, brief/outcome, etc)."
-    },
     {
       "slug": "theme-presets",
       "title": "Theme Presets — unified switcher with bundled tweakcn registry",
@@ -4559,113 +4062,14 @@
       "agentRecipe": "Run `npx rr add files`. Wrap your tree with `<FilesAdapterProvider adapter={...}>` — pass `useLocalStorageFilesAdapter()` for a quick demo or implement `FilesAdapter` (upload + remove + useUrl) against your backend. Then drop `<FileUploadButton onUploaded={...}>` anywhere; pair with `<FileChip fileRef={...}>` for rendered chips. Hooks: `useFileUpload()` returns `{upload, uploading, progress, removeFromStorage}`; `useFileUrl(storageId)` resolves to a fetchable URL (Convex adapter uses useQuery for live invalidation; demo reads localStorage synchronously). To wire S3: implement the FilesAdapter interface with presigned URLs + DELETE; the slice doesn't care which backend you pick."
     },
     {
-      "slug": "equation",
-      "title": "Equation — Notion-style KaTeX block primitive",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Inline-or-display LaTeX equation block — Notion-inspired primitive. KaTeX-rendered with edit/preview toggle, raw-text fallback when KaTeX fails to parse. Pure UI primitive (zero Convex tables, zero global state). Lifted from notion-page-clone (Nosion). Use standalone OR bundled via the notion-blocks bundle. Drop into any React surface — docs, marketing landing, editor.",
-      "source": "notion-page-clone",
-      "slicePath": "frontend/slices/equation",
-      "convexPaths": [],
-      "npm": [
-        "katex@^0.16.45"
-      ],
-      "shadcn": [
-        "button"
-      ],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "ui",
-        "notion",
-        "notion-like",
-        "equation",
-        "katex",
-        "latex",
-        "math",
-        "block",
-        "primitive",
-        "editor"
-      ],
-      "agentRecipe": "Run `npx rr add equation`. Single npm dep: katex. Import `import { EquationBlock } from \"@/features/equation\"`. Props-driven: pass `value` (LaTeX string) + `onChange`. For display-mode (block-level) pass `displayMode`. Renders raw text if KaTeX parse fails. Bundled inside notion-blocks if you also want code/notify/drag-fill."
-    },
-    {
-      "slug": "code-block",
-      "title": "Code Block — Notion-style syntax-highlighted code primitive",
+      "slug": "selection",
+      "title": "Selection — marquee multi-select + bulk actions",
       "category": "ui",
       "kind": "ui",
-      "version": "0.1.0",
-      "description": "Highlight.js-powered code block — Notion-inspired primitive. Language selector dropdown (auto-detect + 50+ language packs), copy-to-clipboard button, line-wrap toggle. Pure-UI primitive — no Convex tables. Lifted from notion-page-clone (Nosion). Use standalone OR bundled via notion-blocks.",
-      "source": "notion-page-clone",
-      "slicePath": "frontend/slices/code-block",
-      "convexPaths": [],
-      "npm": [
-        "highlight.js@^11.11.1"
-      ],
-      "shadcn": [
-        "button",
-        "dropdown-menu"
-      ],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "ui",
-        "notion",
-        "notion-like",
-        "code",
-        "syntax",
-        "highlight",
-        "highlight.js",
-        "block",
-        "primitive",
-        "editor"
-      ],
-      "agentRecipe": "Run `npx rr add code-block`. Single npm dep: highlight.js. Import `import { CodeBlock, languageLabel } from \"@/features/code-block\"`. Props: `value` + `onChange` + `language` + `onLanguageChange`. Bundled inside notion-blocks if you also want equation/notify/drag-fill."
-    },
-    {
-      "slug": "notifications",
-      "title": "Notifications — Notion-style per-page Notify Me",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Pure-client per-page subscription primitive — Notion-inspired bell button + popover. State stored in localStorage (no backend needed). Shipped as a `NotifyMePopover` toggled from a page-action bell. Frequency choices: instant / daily digest / weekly digest. Lifted from notion-page-clone (Nosion). Use standalone OR bundled via notion-blocks.",
-      "source": "notion-page-clone",
-      "slicePath": "frontend/slices/notifications",
-      "convexPaths": [],
-      "npm": [],
-      "shadcn": [
-        "button",
-        "popover"
-      ],
-      "env": [],
-      "peers": [],
-      "providers": [],
-      "tags": [
-        "ui",
-        "notion",
-        "notion-like",
-        "notifications",
-        "subscribe",
-        "notify",
-        "bell",
-        "popover",
-        "localstorage",
-        "primitive"
-      ],
-      "agentRecipe": "Run `npx rr add notifications`. Zero npm deps (only shadcn button + popover). Import `import { NotifyMePopover, useSubscription } from \"@/features/notifications\"`. Drop the popover anywhere; useSubscription(pageId) hook returns `{ isSubscribed, frequency, subscribe, unsubscribe, setFrequency }` reading from localStorage. To wire a real backend, swap the localStorage hook for your own."
-    },
-    {
-      "slug": "database-cell-selection",
-      "title": "Database Cell Selection — Notion-style drag-fill + multi-select",
-      "category": "ui",
-      "kind": "ui",
-      "version": "0.1.0",
-      "description": "Notion-style grid cell interaction primitives: drag-fill (Sheets/Excel-style range fill), multi-cell selection with shift-click + arrow-key extension, paste-from-clipboard column adapter. Pure-UI hooks + components, no Convex tables. Lifted from notion-page-clone (Nosion). Pair with any tabular UI (notion-shell databases, ag-grid, custom React table, etc.).",
+      "version": "0.2.0",
+      "description": "Framework-agnostic multi-selection for any vertical list (Notion-style blocks, table rows, cards). Hold-and-drag on empty space draws a rubber-band rectangle — AutoCAD-style: drag RIGHT selects only fully-enclosed items (solid ring), drag LEFT selects anything the rectangle touches (dashed green ring). Click an item's edge to select (Shift = range, Cmd/Ctrl = toggle). Selecting activates items with a ring + data-block-selected attribute. Backspace/Delete bulk-deletes, Escape and click-outside clear, and a floating count toolbar offers Delete/Clear. SelectionProvider owns only the id set — the host owns the data via onBulkDelete(ids). Pairs with notion-shell (the notion-clone template wires it onto the editor); lifted from notion-page-clone's block-selection slice.",
       "source": "notion-page-clone",
-      "slicePath": "frontend/slices/database-cell-selection",
+      "slicePath": "frontend/slices/selection",
       "convexPaths": [],
       "npm": [],
       "shadcn": [],
@@ -4674,26 +4078,24 @@
       "providers": [],
       "tags": [
         "ui",
-        "notion",
-        "notion-like",
-        "database",
-        "grid",
-        "cell",
         "selection",
-        "drag-fill",
-        "spreadsheet",
-        "primitive",
-        "table"
+        "marquee",
+        "rubber-band",
+        "multi-select",
+        "bulk",
+        "notion",
+        "blocks",
+        "list"
       ],
-      "agentRecipe": "Run `npx rr add database-cell-selection`. Zero deps. Import `import { useDragFill, SelectableCell, useCellSelection } from \"@/features/database-cell-selection\"`. Wrap your grid container with the selection hook; per-cell `<SelectableCell row col>` provides the click-and-drag affordance. Drag handles supplied by useDragFill. Composable with notion-shell's NotionDatabase or any custom grid."
+      "agentRecipe": "Run `npx rr add selection`. Zero deps (react-dom only). Wrap your list area in `<SelectionProvider onBulkDelete={(ids) => removeMany(ids)}>`, give the surface a `position: relative` div with a ref, drop `<SelectionMarquee containerRef={ref} />` inside it, and wrap each item in `<SelectableBlock id={item.id} orderedIds={allIds}>…</SelectableBlock>`. Hold-drag on empty space to rubber-band: drag RIGHT = window (only fully-enclosed, solid ring), drag LEFT = crossing (anything touched, dashed green). Edge-click an item to pick it (Shift = range, Cmd/Ctrl = toggle). Backspace/Delete bulk-deletes (focus outside a contentEditable), Escape + click-outside clear, floating `N selected · Delete · Clear` toolbar. Read state anywhere via `useSelection()`. The slice owns ONLY the id set — you own the data + the delete. Works on table rows / cards too, not just notion blocks."
     },
     {
       "slug": "notion-database",
-      "title": "Notion-like Database Table — full table with import/export + row peek + relation/rollup + row multi-select + calendar drag + DB-level menu + full-page shell + AST formula engine (11 views · 18 cells · CSV + JSON)",
+      "title": "Notion Database",
       "category": "ui",
       "kind": "ui",
-      "version": "0.13.0",
-      "description": "Portable Notion-style database table surface — full capability in one slice. Optional companion to notion-shell — install shell alone for pages + sidebar + block editor, add notion-database when you want embedded databases with full table capability. Ships NotionDatabase (full DB UI w/ ViewTabs + ViewOptions + per-column menu + FilterBuilder/SortBuilder popovers), NotionProperty (value + schema editor), 16 property-cell types (text / number / checkbox / select / multi_select / status / date / url / email / phone / files / person / formula / created_time / last_edited_time / unique_id), 11 built-in views: Table / Board / List / Gallery / Calendar / Feed PLUS Chart (recharts bar/line/area/pie/donut + inline kind/X/agg/Y pickers) / Dashboard (KPI strip + group breakdowns + recent updates) / Form (public-facing submit-to-create — title + per-property inputs, optional required-field validation, configurable show/hide + success message via inline Settings panel) / Map (SVG world + lat/lng pins, no leaflet) / Timeline (Gantt-style with drag-to-shift / drag-to-resize). FilterBuilder + SortBuilder exported standalone for toolbar embedding. Formula cells use a pure expression engine ({{title}}/{{prop}} interpolation + concat/upper/lower/round/if/etc fns + `=expr` math). Files cells store URL refs (paste-URL workflow; host can plug `files` slice adapter for upload). Person cells are simplified vs upstream — no user directory lookup, just initials chips. Created_time / last_edited_time read row.createdAt / row.updatedAt directly. unique_id auto-derives from row position + optional prefix. Pure helpers: applyView, groupBy, bucketByDate. Domain types live in notion-shell (single source of truth — Page.rowOfDatabaseId + rowProps reference them) and re-exported here. Relation + rollup property types deferred to upstream open-silong mega-bundle (need cross-DB context). v0.5 added drop-in Convex backend templates (dual-mode: minimal single-user OR full multi-workspace) from open-silong's template-base/. v0.6 (Phase 7.10) merges former database-io slice in-tree: DatabaseIOActions toolbar (Export CSV/JSON · Import CSV/JSON · Download dynamic CSV/JSON templates), CsvImportDialog (auto-map columns + create-new-of-type picker), JsonImportDialog (schema diff + import), exportDatabase / exportDatabaseToCsv / parseExport / parseCsv / buildCsvTemplate / buildJsonTemplate helpers — all from `@/features/notion-database`. CsvNewProperty + JsonImportResult.newProperties now expose `tempId` so host can remap rowProps keys when persisting (single import handler serves both formats). Cell editor UX consolidated v0.5.3 — SelectCell + MultiSelectCell share OptionPicker (shared/identical popover: search-as-create + per-option rename/color/delete). Property-type lists single-source via PROPERTY_TYPE_META registry (v0.5.2). v0.7 (CK-1D Phase 1) lifts row-detail subsystem from notion-page-clone: RowPeek (sheet + dialog + persisted mode toggle via useRowOpenMode localStorage hook), RowDetailSheet (right drawer), RowDetailDialog (centered modal), RowDetailBody (shared chrome), RowOpenModeSwitcher (sheet/dialog/page toggle). Pure slot-driven — host supplies icon picker, properties form, and block editor via render slots (iconSlot, propertiesSlot, blocksSlot); no Convex / comments / editor coupling. onOpenAsPage callback wires one-shot navigation without changing the persisted default. v0.8 (CK-1D Phase 2) lifts relation + rollup cells: RelationCell (cross-database link picker w/ search + create-new-row affordance + stale-link healing) and RollupCell (read-only aggregate display — count / count_unique / values / sum / avg / min / max / earliest / latest / checked / percent_checked). PropertyType union extended with 'relation' and 'rollup'. Property gained relationDatabaseId / rollupRelationPropertyId / rollupTargetPropertyId / rollupAggregate fields. NotionDatabase added new props pages, databases, onCreateRelatedRow so host stays the source of truth — cells gracefully no-op when omitted. v0.9 (CK-1D Phase 3) lifts row multi-select subsystem: RowSelectionProvider (React Context holding selected id set + anchor; drops stale ids when rowOrder shrinks), RowMarqueeOverlay (drag-to-select rubber-band over any container w/ data-row-shell-id markers — AutoCAD window/crossing modes, threshold + long-press text-origin activation, additive shift-drag), RowSelectionToolbar (floating bottom-center action bar w/ N-rows-selected count, optional locked badge, host-supplied extraSlot, Delete button via onDelete callback, Clear via Esc/X), RowSelectionKeyboard (Esc clear + Del/Backspace bulk delete + outside-click dismiss). TableView automatically tags rows with data-row-shell-id and applies a primary-tinted ring when wrapped in RowSelectionProvider. Marquee primitive + useMarqueeDrag hook exported for reuse on Board / Gallery / custom views. v0.10 (CK-1D Phase 5) adds HeaderCheckboxGutter (tri-state select-all/clear w/ aria-checked='mixed' indeterminate) + RowCheckbox (per-row toggle) — TableView auto-renders a checkbox gutter column whenever a RowSelectionProvider is in scope. Pure calendarDrag helpers (parseExistingDate, formatDateValue, shiftYmd, computeDateShift, parseDropTargetId) exported for hosts wiring CalendarView/Timeline drag-to-move without taking on @dnd-kit coupling inside the slice. Column drag-reorder + row drag-reorder primitives deferred — upstream's flexbox-table refactor conflicts with rr's semantic <table> + 200-LOC view cap. v0.11 (CK-1D Phase 7) lifts Intl-based number + date formatters: lib/numberFormat.ts (resolveNumberFormat / formatPropertyNumber + COMMON_CURRENCIES 16-code picker) and lib/dateFormat.ts (parseYmdToLocal / formatYmd / formatTime / formatDateValue + DATE_FORMAT_LABELS / TIME_FORMAT_LABELS). Property gained numberCurrencyCode + dateFormat + timeFormat + dateIncludeTime fields. NumberCell currency now honours per-property ISO code; DateCell accepts an optional `prop` and routes through formatDateValue when any date-related field is set on it. Notion-shell DatabaseViewConfig split into ./view-config-types.ts to keep types.ts under the 200-LOC cap. v0.12 (CK-1D Phase 4) adds database-shell subsystem: DatabaseMenu (rename / duplicate {structure | with rows} / lock-toggle / delete popover — every action hidden when its callback is omitted; native window.confirm + window.prompt fallbacks keep zero new dialog deps) and DatabasePage (full-page wrapper composing a big header — icon slot + inline title input + DatabaseMenu — over a NotionDatabase body). NotionDatabase grew a `headerActions` render slot so hosts can drop a DatabaseMenu inline without switching to DatabasePage. Database type gained an optional `locked` flag. Strip vs upstream: useDbAdapter (Convex coupling) + SubItemsPicker (sub-items tree) + IconPickerPopover (lives in icon-picker slice) + DataMenu (database-json slice) deferred — host wires those externally. v0.13 (CK-1D Phase 6) replaces the flat formula.ts evaluator with a typed AST engine under lib/formulaEngine/ (types, coerce, dateUtils, ParserClass, parser, functions, evaluator, deps): recursive-descent parser w/ source-position tracking; typed FormulaValue (string/number/boolean/date/null/list) instead of string-only; circular-reference guard via visited set + per-row memoisation cache; new fn surface — substring, dateAdd, dateSubtract, dateBetween, formatDate, count, sum, join (on top of existing concat/lower/upper/length/if/and/or/not/empty/contains/replace/round/floor/ceil/abs/min/max/now/today). Relation refs in formulas now resolve via the workspace pages passed through NotionDatabase. FormulaCell upgraded — popover now shows parse-error message + source position; cell display flips to destructive style on invalid. Legacy evaluateFormula() string wrapper preserved for existing callers; new code should import evalFormula / formatFormulaValue from `@/features/notion-database`. collectDeps() exported for hosts wiring formula-dependency invalidation.",
+      "version": "0.17.1",
+      "description": "Drop-in Notion-style database surface. 11 views (table, board, list, gallery, calendar, feed, chart, dashboard, form, map, timeline), 18 property/cell types, and a per-type column-header config menu (number format, date ranges, select, relation, rollup, formula) plus filter / sort / group / calculate, row peek, row multi-select, table cell selection + drag-to-fill (click a cell, drag the handle to copy down — merged from the former database-cell-selection slice in v0.16), and CSV + JSON import-export. Pure and props-driven — the host owns the data and dispatches change callbacks. Domain types live in notion-shell (install it as the peer). Full release history in CHANGELOG.md.",
       "source": "open-silong",
       "slicePath": "frontend/slices/notion-database",
       "convexPaths": [
@@ -4764,66 +4166,109 @@
         "optional",
         "embeddable"
       ],
-      "agentRecipe": "Run `npx rr add notion-database` (cascades notion-shell as peer). Import: `import { NotionDatabase, NotionProperty, VIEW_REGISTRY, DatabaseIOActions, RowPeek } from \"@/features/notion-database\"`. NotionDatabase ships full props-driven DB UI — host owns rows + dispatches CRUD callbacks. For just one view in isolation, import the specific view component (TableView / BoardView / etc.). Property cells auto-render via renderPropertyCell helper. Pure helpers: applyView / groupBy / bucketByDate. For import/export, mount `<DatabaseIOActions db={db} rows={rows} onImport={async ({ newProperties, rows }) => { const tempToReal: Record<string, string> = {}; for (const np of newProperties) { const realId = await dispatchAddProperty(np); tempToReal[np.tempId] = realId; } for (const r of rows) { const rowId = await dispatchAddRow(r.title); for (const [propKey, v] of Object.entries(r.rowProps)) { await dispatchSetValue(rowId, tempToReal[propKey] ?? propKey, v); } } }} />` next to your DB toolbar — exports CSV/JSON + imports w/ schema diff + downloads dynamic templates from live db.properties. tempId on each new property lets host remap rowProps keys to its real backend ids. For backend persistence, copy template-base/database-silong/convex/ from the open-silong repo: handlers go to convex/, schema fragment merges into convex/schema.ts. Pick _shared/minimal/ (single-user, noop authz) or _shared/full/ (requires @convex-dev/auth + workspaces tables). See CONVEX-BACKEND.md."
+      "agentRecipe": "**Controlled component.** `<NotionDatabase />` renders the whole surface — 11 views (table, board, list, gallery, calendar, feed, chart, dashboard, form, map, timeline), 18 cell types, filter / sort / group / calculate, row peek + multi-select, table cell drag-fill, CSV / JSON import-export. It is 100% props-driven: it owns NO data state — you hold `db` + `rows` and persist every change callback. The view tab strip scrolls horizontally and the card clips to its border, so it stays inside any container width.\n\n**1. Install** — `npx rr add notion-database`. Cascades the `notion-shell` peer (the domain types live there). Components import from `@/features/notion-database`; types from `@/features/notion-shell`.\n\n**2. Minimal wire-up** — keep `db: Database` + `rows: Page[]` in your store (a Convex query result or `useState`) and pass change handlers:\n```tsx\nimport { NotionDatabase } from '@/features/notion-database';\n\n<NotionDatabase\n  db={db}\n  rows={rows}\n  onRowAdd={addRow}\n  onRowUpdate={(rowId, propId, value) => setValue(rowId, propId, value)}\n  onRowRemove={removeRow}\n  onPropertyAdd={addProperty}\n  onViewActivate={setActiveView}\n  onViewAdd={addView}\n  onViewConfigChange={(viewId, patch) => patchView(viewId, patch)}\n/>\n```\nOmit any callback and that affordance goes read-only; pass `readOnly` to freeze everything at once.\n\n**3. Data shape** — `Database = { id, name, properties: Property[], views: DatabaseViewConfig[], activeViewId }`; each row `Page = { id, title, rowProps: Record<propId, PropertyValue> }`. For `relation` / `rollup` cells also pass `pages` + `databases`; for `person` / `created_by` cells pass `userLookup(id)`.\n\n**4. Import / export** — mount `<DatabaseIOActions db={db} rows={rows} onImport={handleImport} />` in your toolbar: CSV/JSON in (with schema-diff), CSV/JSON + live-schema templates out. New columns arrive with a `tempId` — map it to your real backend id before writing their `rowProps`.\n\n**5. Backend (optional)** — the UI is store-agnostic. For Convex persistence copy `template-base/database-silong/convex/` (handlers → `convex/`, schema fragment merges into `convex/schema.ts`). Pick `_shared/minimal/` (single-user, noop authz) or `_shared/full/` (`@convex-dev/auth` + workspaces). See CONVEX-BACKEND.md.\n\n**Just one view?** Import it directly — `import { TableView } from '@/features/notion-database'` — and feed it `rows` + `renderCell` + `renderColumnHeader`."
     },
     {
-      "slug": "database-io",
-      "title": "[DEPRECATED] Database IO — merged into notion-database v0.6",
+      "slug": "image-picker",
+      "title": "Image Picker — one-button image/wallpaper chooser (gallery · upload · link · Unsplash · reposition)",
       "category": "ui",
       "kind": "ui",
-      "version": "0.2.0",
-      "description": "DEPRECATED — all functionality merged into `notion-database` v0.6 (Phase 7.10, 2026-05-22). This slice is now a thin re-export shim from `@/features/notion-database` to keep existing consumers compiling. New code should `npx rr add notion-database` (now bundles CSV + JSON import/export + dynamic templates) instead of installing this separately. Slice will be removed in v1.0. Original surface (DatabaseIOActions / CsvImportDialog / JsonImportDialog / exportDatabase / buildCsvTemplate / buildJsonTemplate) remains exported from notion-database — see its catalog entry. Merge rationale: 100% peer coupling to notion-database (every file imported Database/Page/Property types from it) + zero independent install path (always installed alongside notion-database in practice) = no modularity benefit from separation.",
+      "version": "0.1.0",
+      "description": "Generic image/wallpaper picker — not coupled to Notion. The headline API is ONE button (ImagePickerButton) that opens a dialog with 4 tabs: Gallery (12 colours + 8 gradients + Notion textures), Upload (drag/click, ≤8MB), Link (paste any https image URL), Unsplash (bundled curated landscapes + live search). On pick, onChange fires with an ImageValue ({ type, value, positionY?, metadata? }). ImageBanner is the optional reposition-able band — render an ImageValue as a full-width cover / profile header / card hero with hover controls: Change (opens the dialog), Reposition (drag the vertical focal point), Remove. The slice imports NO other slice and NO backend — the upload backend and Unsplash search are INJECTED as props (onUpload + searchUnsplash), so it drops into any app: wire onUpload to the `files` slice and searchUnsplash to a server route via unsplashSearchVia('/api/unsplash') that holds UNSPLASH_ACCESS_KEY server-side (never NEXT_PUBLIC). Ships a curated Unsplash fallback + gallery so it works with zero config. parseImage normalizes legacy raw-string values; imageStyle builds the focal-point CSS. Wired into the notion-page-clone template as the page cover via NotionPage's coverSlot.",
       "source": "notion-page-clone",
-      "slicePath": "frontend/slices/database-io",
+      "slicePath": "frontend/slices/image-picker",
       "convexPaths": [],
       "npm": [],
       "shadcn": [
-        "button",
         "dialog",
-        "dropdown-menu"
+        "button",
+        "input"
       ],
-      "env": [],
-      "peers": [
+      "env": [
         {
-          "slug": "notion-database",
-          "range": "^0.3",
-          "reason": "Reuses Database / Page / Property / PropertyValue / PropertyType / SelectOption / DatabaseViewConfig types."
+          "name": "UNSPLASH_ACCESS_KEY",
+          "scope": "server",
+          "required": false,
+          "description": "Server-side only (e.g. on the /api/unsplash route). Without it the Unsplash tab falls back to the curated set."
         }
       ],
+      "peers": [],
+      "providers": [],
+      "tags": [
+        "ui",
+        "image",
+        "picker",
+        "wallpaper",
+        "cover",
+        "upload",
+        "unsplash",
+        "gallery",
+        "reposition",
+        "files",
+        "primitive",
+        "portable",
+        "dialog"
+      ],
+      "agentRecipe": "Run `npx rr add image-picker`. The headline component is `<ImagePickerButton label=\"Change image\" onChange={(img)=>save(img)} onUpload={…} searchUnsplash={…} />` — ONE button that opens the 4-tab dialog (gallery / upload / link / Unsplash). For a reposition-able cover/hero band use `<ImageBanner image={value} onChange={save} resolvedUrl={…} onUpload={…} searchUnsplash={…} />` (also passable to notion-shell's `<NotionPage coverSlot={…} />`). Inject the backend: `onUpload` = the `files` slice's useFileUpload().upload (returns a FileRef); resolve upload images for display with `resolvedUrl` = files useFileUrl(parseFileRef(imageRef(parseImage(value))).storageId). `searchUnsplash` = `unsplashSearchVia('/api/unsplash')` — add a server route that proxies api.unsplash.com with UNSPLASH_ACCESS_KEY (never expose the key client-side). Ships a curated Unsplash + gallery fallback so it works with zero wiring. ImageValue = { type, value, positionY?, metadata? }; parseImage handles legacy string values."
+    },
+    {
+      "slug": "notion-sidebar",
+      "title": "Notion Sidebar — tree nav + page CRUD (rename · drag · icon picker)",
+      "category": "ui",
+      "kind": "ui",
+      "version": "0.1.0",
+      "description": "Standalone Notion-style tree-nav sidebar with full page CRUD, lifted out of notion-shell so it is reusable on its own. Props-driven + fully decoupled — owns its own lightweight NotionSidebarPage type (id / title / icon / parentId), imports no other slice. Capabilities: click a row to open; DOUBLE-CLICK a title to rename inline; drag the grip to reorder AND reparent (a @dnd-kit sortable tree with horizontal-offset depth projection); collapse/expand subtrees; hover a row for +subpage / delete. Optional per-row icon PICKER — wire `renderIconPicker` + `onIconChange` (e.g. @/features/icon-picker's IconPickerPopover) so clicking a row icon opens the picker. The host owns the data and dispatches onSelect / onCreate / onRename / onDelete / onMove / onIconChange. Compose with notion-shell (page editor) + notion-database (embedded DBs) for the full Notion-clone OS — see the notion-page-clone-os template.",
+      "source": "notion-page-clone",
+      "slicePath": "frontend/slices/notion-sidebar",
+      "convexPaths": [],
+      "npm": [
+        "@dnd-kit/core",
+        "@dnd-kit/sortable",
+        "@dnd-kit/utilities"
+      ],
+      "shadcn": [
+        "button",
+        "input"
+      ],
+      "env": [],
+      "peers": [],
       "providers": [],
       "tags": [
         "ui",
         "notion",
-        "notion-like",
-        "database",
-        "csv",
-        "json",
-        "import",
-        "export",
-        "template",
-        "data",
-        "backup",
-        "spreadsheet",
-        "wire-format",
+        "sidebar",
+        "tree",
+        "nav",
+        "page",
+        "crud",
+        "rename",
+        "drag",
+        "dnd",
+        "reorder",
+        "reparent",
+        "icon-picker",
         "primitive",
-        "optional"
+        "portable",
+        "notion-like"
       ],
-      "agentRecipe": "⚠️ DEPRECATED — use `npx rr add notion-database` (now bundles import/export). This slice is a thin re-export shim from `@/features/notion-database` for back-compat. New code: `import { DatabaseIOActions } from \"@/features/notion-database\"`. Remove when migration complete; slice scheduled for removal in v1.0."
+      "agentRecipe": "Run `npx rr add notion-sidebar`. Import `import { NotionSidebar, type NotionSidebarPage } from \"@/features/notion-sidebar\"`. Feed it a flat `pages: NotionSidebarPage[]` ({ id, title, icon, parentId }) — the sidebar builds the tree. Wire callbacks: onSelect(id), onCreate(parentId|null), onRename(id, title) [double-click a title to trigger], onDelete(id), onMove(id, parentId, beforeId) [drag the grip — reorders + reparents], onIconChange(id, icon). For rich icons pass `renderIcon` (display) + `renderIconPicker` (click-to-pick) wired to `@/features/icon-picker` (DynamicIcon + IconPickerPopover). npm: @dnd-kit/core + sortable + utilities. Pair with notion-shell (page editor) + notion-database (embedded DBs) — the notion-page-clone-os template shows the full reducer wiring."
     },
     {
       "slug": "notion-shell",
-      "title": "Notion Shell — page + sidebar + block editor primitives (pure, no database)",
+      "title": "Notion Shell — page + block editor primitives (pure, no sidebar/database)",
       "category": "ui",
       "kind": "ui",
-      "version": "0.7.1",
-      "description": "Portable Notion-style PAGE + SIDEBAR + BLOCK editor primitives. CI-wave (2026-05-21) split the database surface out — install the optional `notion-database` peer for embedded TableView / BoardView / ListView / GalleryView / CalendarView / FeedView, NotionDatabase, NotionProperty, ViewTabs, ViewOptions, ColumnHeaderMenu, property-cells. notion-shell alone gives you Notion-clone pages + sidebar + editor without the database weight. Domain types (Database, Property, PropertyValue, DbView, DatabaseViewConfig, DatabaseFilter, DatabaseSort) remain in notion-shell as the single source of truth (Page.rowOfDatabaseId + rowProps reference them). FULL OLD DESC BELOW: Portable Notion-style wrapper primitives. PAGE EDITOR: NotionPage (optional cover image band + header + body), NotionHeader / NotionSidebar / NotionBlock (live inline-markdown decorator, hover actions menu, optional dragHandle slot), SlashMenu (searchable block-type picker w/ keyboard nav), BlockActionsMenu (turn-into / duplicate / delete), InsertBlockButton (`+` trigger w/ SlashMenu), SortableBlockList (@dnd-kit render-prop wrapper for block reorder), PageActionsMenu (header dropdown: cover/favorite/duplicate/export/trash). DATABASE: NotionDatabase (full DB surface w/ tabs + options + per-column menu), NotionProperty (10 property-cell types), 6 built-in views (Table/Board/List/Gallery/Calendar/Feed), ViewTabs, ViewOptions (sort + filter + search popover), ColumnHeaderMenu. SPECIALISED BLOCK RENDERERS: ImageRenderer (URL + caption + preview), EmbedRenderer (YouTube/Vimeo/Loom/Figma/CodePen/Spotify auto-detect + iframe fallback). Pure helpers: applyView, groupBy, bucketByDate. Pure / props-driven — host owns data + change handlers.",
+      "version": "0.23.0",
+      "description": "Portable Notion-style PAGE EDITOR primitives. v0.22 split the tree-nav SIDEBAR out into the standalone `notion-sidebar` slice (so the page editor and the sidebar are independently reusable); embedded DATABASES already live in the `notion-database` peer. notion-shell ships: NotionPage (optional cover image band + header + body), NotionHeader, NotionBlock (live inline-markdown decorator, hover actions menu, optional dragHandle slot, BUILT-IN code (highlight.js) + equation (KaTeX) blocks), SlashMenu (searchable block-type picker w/ keyboard nav), BlockActionsMenu (turn-into / duplicate / delete), InsertBlockButton (`+` trigger w/ SlashMenu), SortableBlockList (@dnd-kit render-prop wrapper for block reorder), PageActionsMenu (header dropdown: cover/favorite/duplicate/export/trash), InlineFormatToolbar + BlockColorPicker (colour) + MentionTypeahead + PageLayoutSection (layout). SPECIALISED BLOCK RENDERERS: ImageRenderer, EmbedRenderer (YouTube/Vimeo/Loom/Figma/CodePen/Spotify auto-detect). Domain types (Database, Property, PropertyValue, DbView, DatabaseViewConfig, DatabaseFilter, DatabaseSort) remain in notion-shell as the single source of truth (Page.rowOfDatabaseId + rowProps reference them). Pure / props-driven — host owns data + change handlers. Compose notion-sidebar + notion-shell + notion-database for the full Notion-clone OS.",
       "source": "notion-page-clone",
       "slicePath": "frontend/slices/notion-shell",
       "convexPaths": [],
       "npm": [
         "@dnd-kit/core",
         "@dnd-kit/sortable",
-        "@dnd-kit/utilities"
+        "@dnd-kit/utilities",
+        "katex@^0.16.45",
+        "highlight.js@^11.11.1"
       ],
       "shadcn": [
         "button",
@@ -4840,25 +4285,23 @@
         "notion",
         "shell",
         "wrapper",
-        "sidebar",
         "page",
-        "database",
+        "block",
+        "editor",
         "primitive",
         "portable",
         "slash-menu",
         "decorator",
         "wysiwyg",
-        "views",
-        "kanban",
-        "calendar",
-        "gallery",
         "drag",
         "cover",
         "embed",
         "image",
+        "code",
+        "equation",
         "notion-like"
       ],
-      "agentRecipe": "Run `npx rr add notion-shell` for the portable UI wrappers ONLY (no backend). NPM deps: @dnd-kit/core, @dnd-kit/sortable, @dnd-kit/utilities. Import: `import { NotionPage, NotionSidebar, NotionBlock, NotionDatabase, SortableBlockList, PageActionsMenu, InsertBlockButton, ViewTabs, ImageRenderer, EmbedRenderer } from \"@/features/notion-shell\"`. NotionBlock ships slash menu + decorator + actions menu + dragHandle slot. NotionPage ships optional cover prop. SortableBlockList wraps a render-prop callback `(id, dragProps) => <NotionBlock dragHandle={...} />`. NotionDatabase ships 6 views via VIEW_REGISTRY. Property cells: text/number/checkbox/select/multi-select/status/date/url/email/phone all built in. For rich icon UX wire `renderIcon` + `renderIconPicker` to `@/features/icon-picker`. **PRODUCT POINTER: the full Convex-backed Notion-clone OS (multi-workspace + auth + sharing + comments + snapshots + MCP) lives at https://github.com/rahmanef63/open-silong — clone that repo for the production stack; use this slice when you only need to embed the Notion-style UI in another project.**"
+      "agentRecipe": "Run `npx rr add notion-shell` for the portable PAGE EDITOR wrappers ONLY (no backend; the tree-nav sidebar is the separate `notion-sidebar` slice). NPM deps: @dnd-kit/core, @dnd-kit/sortable, @dnd-kit/utilities. Import: `import { NotionPage, NotionBlock, SortableBlockList, PageActionsMenu, InsertBlockButton, InlineFormatToolbar, ImageRenderer, EmbedRenderer } from \"@/features/notion-shell\"`. NotionBlock ships slash menu + decorator + actions menu + dragHandle slot. **`createDefaultBlockRenderers()` returns the block-renderer registry — pass it to `<NotionBlock blockRenderers={…}>` so callout (icon+kind picker), table (editable grid), divider, image, embed, code (highlight.js) + equation (KaTeX) all render. code + equation are now BUILT-IN to notion-shell (npm: katex + highlight.js) — no adapter needed. Only `database` + `toc` are injected at the app level (they depend on host data + the sibling notion-database slice).** NotionPage ships optional cover prop. SortableBlockList wraps a render-prop callback `(id, dragProps) => <NotionBlock dragHandle={...} />`. NotionDatabase ships 6 views via VIEW_REGISTRY. Property cells: text/number/checkbox/select/multi-select/status/date/url/email/phone all built in. For rich icon UX wire `renderIcon` + `renderIconPicker` to `@/features/icon-picker`. **v0.17 — Notion-canonical editing keys (`blockKeyHandler.ts`): Enter splits at the caret into a new block (lists continue their type; an empty list item exits to paragraph); Backspace on an empty non-paragraph downgrades it to a plain paragraph (re-triggerable with `/`); a second Backspace on an empty paragraph merges into the previous block; Arrow up/down at a line edge hops blocks. Wire the host callbacks on `<NotionBlock>`: `onInsertAfter(type, init) => newId`, `onMergeBack()`, `onFocusSibling(dir)` — plus `focusBlock(id, offset?)` exported to move the caret after a host state change. The preview `page-demo.tsx` and the notion-clone template `DocView` show full array- and reducer-based wirings.** PRODUCT POINTER: the full Convex-backed Notion-clone OS (multi-workspace + auth + sharing + comments + snapshots + MCP) lives at https://github.com/rahmanef63/open-silong — clone that repo for the production stack; use this slice when you only need to embed the Notion-style UI in another project.**"
     },
     {
       "slug": "workspace-shell",