{"site":{"name":"Rahman Resources","shortName":"rmnr","description":"Reusable Next.js + Convex + shadcn vertical-slice template kitab. Copy-first. Production-grade.","tagline":"Rahman's library of Next.js templates.","url":"https://resource.rahmanef.com","repo":"https://github.com/rahmanef63/resource-site","author":"Rahman","authorUrl":"https://rahmanef.com","links":{"github":"https://github.com/rahmanef63/resource-site","rahmanefCom":"https://rahmanef.com","cescadesigns":"https://cescadesigns.com"}},"stack":[{"name":"Next.js 16","url":"https://nextjs.org/docs"},{"name":"React 19","url":"https://react.dev"},{"name":"TypeScript 5.6","url":"https://www.typescriptlang.org"},{"name":"Tailwind CSS 4","url":"https://tailwindcss.com"},{"name":"shadcn/ui","url":"https://ui.shadcn.com"},{"name":"Convex (self-hosted)","url":"https://docs.convex.dev/self-hosting"},{"name":"@convex-dev/auth","url":"https://labs.convex.dev/auth"},{"name":"Dokploy","url":"https://dokploy.com"},{"name":"Radix UI","url":"https://www.radix-ui.com"},{"name":"Lucide Icons","url":"https://lucide.dev"}],"features":[{"title":"Vertical-Slice Architecture","description":"Each feature owns its config, page, views, components, settings, agent, and Convex mirror. Add or remove a feature by adding or removing one folder."},{"title":"Copy-First Flow","description":"Never greenfield. Every artifact comes from a proven source project (internal kitab-core, rahmanef.com, cescadesigns, notion-clone). Edit imports, ship."},{"title":"shadcn-only UI","description":"All components are shadcn primitives or composed from them. ResponsiveDialog, DateField, FileUpload — no raw HTML buttons or dialogs."},{"title":"audit-bp Gated","description":"Best-practice auditor pulls latest Next 16 / React 19 / Convex docs via Context7 before scoring. Score ≥80 to ship."},{"title":"Dokploy in One Command","description":"si-coder skill creates the GitHub repo, pushes, configures Dokploy, sets DNS, and triggers deploy. Zero human involvement."},{"title":"Self-hosted Convex + @convex-dev/auth","description":"No Clerk. Self-hosted Convex backend in the same docker-compose. Postgres-backed for prod."},{"title":"Auto-generated Slice Docs","description":"Per-slice DEPS.md, CONTRACT.md, STATUS.md, USAGE.md generated from imports + defineFeature config."},{"title":"Cookbook + Recipes","description":"8 layout variants and 8 feature drop-ins (block editor, command palette, db views, comments, ...) ready to mount."}],"counts":{"total":92,"slice":56,"template":8,"layout":28},"resources":[{"source":"slice","slug":"convex-auth","title":"Convex Auth — Multi-Provider Sign-in","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.","category":"auth","tags":["auth","convex","password","magic-link","google","anonymous","no-clerk","pbkdf2"],"href":"/slices/convex-auth","previewPath":"/preview/slices/convex-auth","install":"npm i @convex-dev/auth @auth/core resend"},{"source":"slice","slug":"doku-payment","title":"DOKU — Indonesia Payment","description":"Pembayaran lokal Indonesia via DOKU — Checkout (hosted) + Direct (VA / QRIS / e-Wallet / PayLater / Minimarket / Kartu). HMAC-signed REST + signature-verified webhook + idempotent retries. Sibling slice to midtrans-payment dengan paymentOrders schema yang dishare.","category":"payment","tags":["payment","doku","indonesia","qris","virtual-account","ewallet","checkout"],"href":"/slices/doku-payment","previewPath":"/preview/slices/doku-payment","install":""},{"source":"slice","slug":"midtrans-payment","title":"Midtrans — Indonesia Payment","description":"Pembayaran lokal Indonesia via Midtrans Snap (BCA, Mandiri, BRI, e-wallet GoPay/OVO/Dana, QRIS). Webhook untuk konfirmasi. Provider-isolated under components/providers/midtrans + actions/midtrans so Doku/Stripe land as siblings.","category":"payment","tags":["payment","midtrans","indonesia","qris","snap"],"href":"/slices/midtrans-payment","previewPath":"/preview/slices/midtrans-payment","install":"npm i midtrans-client"},{"source":"slice","slug":"resend-newsletter","title":"Resend — Transactional & Newsletter","description":"Transactional email + newsletter blast via Resend. Double opt-in flow + audience segmentation. Magic-link delivery for Convex Auth.","category":"email","tags":["email","newsletter","resend"],"href":"/slices/resend-newsletter","previewPath":"/preview/slices/resend-newsletter","install":"npm i resend react-email @react-email/components"},{"source":"slice","slug":"ai-chat","title":"AI Chat — Workbench / Sidebar / Search","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.","category":"ai","tags":["ai","ai:chat","streaming","multimodal","tool-calls","agent-mode","rag","citations","branching","history"],"href":"/slices/ai-chat","previewPath":"/preview/slices/ai-chat","install":"npm i ai @ai-sdk/anthropic @ai-sdk/openai"},{"source":"slice","slug":"ai-studio","title":"AI Studio — Generation Canvas","description":"AI is the primary UI — single big prompt input → live-streaming output → variation grid → version tree. Suno / Midjourney / Lovable / v0 pattern. Output kinds: text, code, image, audio (configurable per template).\n\nUse cases:\n  – AI image generation product (creative output)\n  – AI logo / banner / social-post studio\n  – AI code-snippet generator (component scaffolder)\n  – AI music / voiceover producer\n  – AI blog-draft factory (text)\n\nFeatures: prompt history, branch + compare outputs, like + favorite, share-to-link, templates from ai-admin.","category":"ai","tags":["ai","ai:studio","generation","streaming","history","branching","image-gen"],"href":"/slices/ai-studio","previewPath":"/preview/slices/ai-studio","install":""},{"source":"slice","slug":"ai-agents","title":"AI Agents — Autonomous Workers","description":"Background AI workers. Define an agent (skill × model × tools × max-iter), trigger it on-demand or on a cron schedule, watch the step-by-step trace as it runs. Devin / Replit-Agent / Manus pattern.\n\nUse cases:\n  – Nightly audit-bp on the codebase (PR-reviewer style)\n  – Weekly SEO crawl + content suggestions\n  – Auto-moderate comment queue\n  – Scheduled data ingestion + summarization\n  – Long-form research task with multi-source citations\n\nFeatures: queue + live trace, per-step retry policy, hard cost cap, shareable trace URLs, full audit-log integration.","category":"ai","tags":["ai","ai:agents","agent-mode","tool-calls","async","queue","traces"],"href":"/slices/ai-agents","previewPath":"/preview/slices/ai-agents","install":""},{"source":"slice","slug":"ai-admin","title":"AI Admin — Console (Instructions · Skills · Tools · Agents · Providers)","description":"Central operator console for the whole AI stack. Every other ai-* feature reads its registries from here. Tabs ordered to match the build-flow:\n\n  1. Providers   — register Anthropic / OpenAI / Google / Mistral / Ollama (API keys AES-encrypted at rest)\n  2. Models      — per-provider catalog (capabilities, context window, pricing)\n  3. Instructions — custom system-prompt library (Claude Projects-style)\n  4. Skills      — named instruction + model default + tool defaults (consumed by chat + studio)\n  5. Tools       — JSON-schema function specs + impl (http / convex / shell) + sandbox flag\n  6. Agents      — skill × model × tools × max-iter (consumed by ai-agents)\n  7. Budgets     — per-workspace cost caps + alerts + hard kill\n  8. Audit       — every AI call: actor / agent / tokens / cost / latency / outcome\n\nIncludes Create-Agent / Create-Skill / Create-Tool / Create-Instruction wizards.","category":"ai","tags":["ai","ai:admin","instructions","skills","tools","agents","providers","models","budgets","audit"],"href":"/slices/ai-admin","previewPath":"/preview/slices/ai-admin","install":""},{"source":"slice","slug":"ai-router","title":"AI Router — Backend Provider Proxy","description":"Backend infrastructure (no UI). Single proxy that every other ai-* feature calls. Tier-routed — nano (Haiku) for classification, mid (Sonnet) for chat, flagship (Opus) for deep reasoning. Per-call usage log + cost guard. Works with direct provider keys or OpenRouter umbrella.\n\nNot something you mount — installed automatically as a peer when you add ai-chat / ai-studio / ai-agents.","category":"ai","tags":["ai","ai:backend","tier-routing","cost-guard"],"href":"/slices/ai-router","previewPath":"/preview/slices/ai-router","install":"npm i ai @openrouter/ai-sdk-provider"},{"source":"slice","slug":"vector-search","title":"Convex Vector Search","description":"Embeddings-based search via Convex's built-in vector index. Embed via OpenAI text-embedding-3-small (1536-dim), query via vectorIndex().","category":"search","tags":["search","vector","embeddings","convex","rag"],"href":"/slices/vector-search","previewPath":"/preview/slices/vector-search","install":"npm i openai"},{"source":"slice","slug":"mdx-blog","title":"MDX Blog","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.","category":"content","tags":["content","blog","mdx","static"],"href":"/slices/mdx-blog","previewPath":"/preview/slices/mdx-blog","install":"npm i next-mdx-remote rehype-pretty-code remark-gfm reading-time"},{"source":"slice","slug":"cal-com-booking","title":"Cal.com Booking","description":"Embedded Cal.com booking widget + webhook receiver to mirror bookings into Convex.","category":"data","tags":["data","scheduling","cal-com","bookings"],"href":"/slices/cal-com-booking","previewPath":"/preview/slices/cal-com-booking","install":"npm i @calcom/embed-react"},{"source":"slice","slug":"full-width-toggle","title":"Full Width Toggle","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.","category":"ui","tags":["ui","layout","preference","localstorage","dashboard"],"href":"/slices/full-width-toggle","previewPath":"/preview/slices/full-width-toggle","install":""},{"source":"slice","slug":"command-menu","title":"Command Menu","description":"Renderless ⌘K command palette + generic search modal. Consumer supplies CommandGroup[] + onSelect + label bag; slice owns dialog chrome, ⌘K hotkey, MRU history. Pulled UP from notion-page-clone's command-palette renderless surface (Wave N+3.7) — Nosion adapters dropped at the kitab boundary.","category":"ui","tags":["ui","palette","cmd-k","navigation","keyboard","search","notion-like"],"href":"/slices/command-menu","previewPath":"/preview/slices/command-menu","install":"npm i cmdk"},{"source":"slice","slug":"motion-primitives","title":"Motion Primitives (8)","description":"Eight ready-to-style motion components: marquee, kinetic-heading, magnetic, cursor-spotlight, stat-counter, reading-progress, grain, lightbox. Framer-Motion-powered, tree-shakeable. Facade slice — pulls from template-base/frontend/slices/motion-primitives.","category":"ui","tags":["ui","motion","animation","marquee","framer-motion"],"href":"/slices/motion-primitives","previewPath":"/preview/slices/motion-primitives","install":"npm i framer-motion"},{"source":"slice","slug":"responsive-dialog","title":"Responsive Dialog (Sheet ↔ Modal)","description":"ResponsiveDialog — auto-switches between bottom Sheet (mobile) and centered Dialog (desktop) at the md breakpoint. Same API as shadcn Dialog. Kitab forbids raw <dialog>; use this everywhere. Facade slice — pulls from template-base/frontend/slices/responsive-dialog.","category":"ui","tags":["ui","dialog","modal","sheet","responsive","primitive"],"href":"/slices/responsive-dialog","previewPath":"/preview/slices/responsive-dialog","install":""},{"source":"slice","slug":"dashboard-shell","title":"Dashboard Shell — Responsive","description":"ResponsiveDashboardShell — desktop sidebar + topbar, mobile dock + sheet sidebar, breakpoint-aware. Ports superspace's layout/dashboard/{Desktop,Mobile,Responsive}DashboardShell + sidebar primary/secondary slots. Facade slice — pulls from template-base/frontend/slices/dashboard-shell.","category":"ui","tags":["ui","layout","dashboard","sidebar","topbar","responsive"],"href":"/slices/dashboard-shell","previewPath":"/preview/slices/dashboard-shell","install":""},{"source":"slice","slug":"three-column","title":"Three-Column Layout — Sidebar/Content/Inspector","description":"ThreeColumnLayoutAdvanced — collapsible left/right + resizable widths + responsive breakpoints + PanelSection compound (Header/Items/Footer) + per-panel footer slots. Models shadcn sidebar API for the panel interior. Pair with PanelGroup/PanelMenu/PanelSeparator primitives. Trigger ≠ header (V-wave separation rule).","category":"ui","tags":["ui","layout","three-column","sidebar","inspector","panel-section","responsive","resizable"],"href":"/slices/three-column","previewPath":"/preview/three-column-trio","install":""},{"source":"slice","slug":"broadcast-channel-sync","title":"BroadcastChannel — Cross-tab Sync","description":"Same-origin cross-tab + cross-iframe state sync via BroadcastChannel API. Tiny, no backend, no install.","category":"realtime","tags":["realtime","cross-tab","broadcast-channel","demo-pattern"],"href":"/slices/broadcast-channel-sync","previewPath":"/preview/slices/broadcast-channel-sync","install":"// no install — Web Platform API"},{"source":"slice","slug":"rbac-roles","title":"RBAC — Tiered System Roles","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).","category":"auth","tags":["rbac","auth","permissions","roles","workspaces"],"href":"/slices/rbac-roles","previewPath":"/preview/slices/rbac-roles","install":"npx rahman-resources add rbac-roles"},{"source":"slice","slug":"admin-panel","title":"Admin Panel — Unified Product Admin","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.","category":"infra","tags":["admin","owner","platform","rbac","instrumentation","panel"],"href":"/slices/admin-panel","previewPath":"/preview/slices/admin-panel","install":"npx rahman-resources add admin-panel"},{"source":"slice","slug":"event-tracking","title":"Event Tracking — P0 Instrumentation","description":"Client SDK + Convex ingestion endpoint for structured product events. Auto-captures page_view/signup/login + UTM/referrer/first-touch attribution. Batched flush via requestIdleCallback. Targets <100ms p99 ingestion.","category":"data","tags":["events","analytics","instrumentation","attribution","utm","p0"],"href":"/slices/event-tracking","previewPath":"/preview/slices/event-tracking","install":"npx rahman-resources add event-tracking"},{"source":"slice","slug":"theme-preset-switcher","title":"Theme Preset Switcher","description":"Runtime theme swap (colors + fonts + shadows + tracking). OKLch CSS vars per preset. Persists to localStorage + Convex. Add a new preset by appending a CSS block in app/globals.css with [data-theme=\"<name>\"], then register in preset-groups.ts.","category":"ui","tags":["theme","presets","oklch","design-system"],"href":"/slices/theme-preset-switcher","previewPath":"/preview/slices/theme-preset-switcher","install":"npx rahman-resources add theme-preset-switcher"},{"source":"slice","slug":"icon-picker","title":"Icon Picker","description":"Emoji + lucide icon picker with search, 10-color palette, Twemoji/native toggle, recents tracking. One string stores emoji OR lucide:Name OR with ?c=hex tint — backwards-compat with raw-emoji fields. Two variants: Popover (compact trigger) and Inline (full sheet/dialog use). Lifted 2026-05-16 from notion-page-clone — full implementation (19 files) including emoji-keywords search index, twemoji renderer, lucide-catalog, recents store, style-pref hook.","category":"ui","tags":["icon","emoji","lucide","picker","twemoji","notion","notion-like"],"href":"/slices/icon-picker","previewPath":"/preview/slices/icon-picker","install":"npx rahman-resources add icon-picker"},{"source":"slice","slug":"cta","title":"Call to Action","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.","category":"ui","tags":["ui","marketing","cta","section","brutalist"],"href":"/slices/cta","install":"npx rahman-resources add cta"},{"source":"slice","slug":"hero","title":"Hero","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.","category":"ui","tags":["ui","hero","marketing","landing","section","editorial","brutalist"],"href":"/slices/hero","install":"npx rahman-resources add hero"},{"source":"slice","slug":"rate-limit","title":"Rate Limit","description":"Convex-backed per-key request counter. Atomic check-and-increment via `consume` mutation; expired rows pruned by `_pruneExpired` internalMutation wired to a 5-min cron. Replaces single-replica in-memory Map so multi-replica Next deployments share buckets. Caller chooses key namespace (csp:<ip>, mcp:<ip>, oauth_token:<ip>). Lifted 2026-05-16 from rahmanef.com.","category":"infra","tags":["infra","rate-limit","convex","backend","throttle"],"href":"/slices/rate-limit","install":"npx rahman-resources add rate-limit"},{"source":"slice","slug":"subscribers","title":"Subscribers","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.","category":"email","tags":["email","newsletter","subscribers","convex","backend"],"href":"/slices/subscribers","install":"npx rahman-resources add subscribers"},{"source":"slice","slug":"testimonials","title":"Testimonials","description":"Quote/name/role rotator backend. Public `listAll` + `get` (no auth — testimonials are public), admin CRUD via `requireAdmin`, internal `seed` for one-shot bootstrap. Indexed by `order` so carousel/grid keeps stable rotation. Lifted 2026-05-16 from rahmanef.com; token-based admin gate swapped for rr `_shared/auth`.","category":"content","tags":["content","testimonials","convex","backend","marketing"],"href":"/slices/testimonials","install":"npx rahman-resources add testimonials"},{"source":"slice","slug":"services","title":"Services","description":"Service offerings backend — title + summary + deliverables array + sort order. Public read, admin CRUD, internal seed. Pairs with a frontend services grid/list (consumer-side). Lifted 2026-05-16 from rahmanef.com; token-based admin gate swapped for rr `_shared/auth`.","category":"content","tags":["content","services","convex","backend","marketing","agency"],"href":"/slices/services","install":"npx rahman-resources add services"},{"source":"slice","slug":"socials","title":"Socials","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.","category":"content","tags":["content","socials","seo","indieweb","convex","backend"],"href":"/slices/socials","install":"npx rahman-resources add socials"},{"source":"slice","slug":"create-your-mcp","title":"Create Your MCP","description":"Turn any rr-based app into an MCP server that ChatGPT custom apps, Claude.ai connectors, Cursor MCP, and other AI clients authenticate to. OAuth 2.1 + PKCE flow with code → bearer exchange, env-configured vendor-host allowlist, single-use codes, 1-year bearer tokens, scope-tagged tools, opaque error collapsing, constant-time token compare. Static MCP_API_KEY fallback for service-account / CI scripts. Sanitized 2026-05-16 from rahmanef.com's production MCP integration — vendor literals (chatgpt.com / OpenAI paths) replaced with MCP_OAUTH_ALLOWED_HOSTS + MCP_OAUTH_ALLOWED_PATH_PREFIXES env vars so the slice ships portable.","category":"ai","tags":["ai","mcp","oauth","pkce","chatgpt","claude","cursor","convex","integration"],"href":"/slices/create-your-mcp","previewPath":"/preview/slices/create-your-mcp","install":"npx rahman-resources add create-your-mcp"},{"source":"slice","slug":"contact-form-resend","title":"Contact Form + Resend","description":"Contact form posting to Resend email API. Server Action + Zod input validation. Convex mutation for storage + Resend send.","category":"email","tags":["form","email","resend","convex"],"href":"/slices/contact-form-resend","previewPath":"/preview/slices/contact-form-resend","install":"npx rahman-resources add contact-form-resend"},{"source":"slice","slug":"admin","title":"Admin — Generic Shell","description":"Per-instance admin landing scaffold + portable nav-from-registry factory. Consumer supplies a SliceRegistryAdapter (each slice declares its own admin.activity[]) + queryTable reader; the slice's buildAdminStats(opts) emits the { counts, unreadMessages, activity } shape Convex's admin.stats query returns. Pulled UP from rahmanef.com (Wave N+3.1, commit b542389) — domain literals dropped at the kitab boundary. Gated by requireAdmin on Convex side; superadmin email gate via SUPER_ADMIN_EMAIL env.","category":"infra","tags":["infra","admin","shell","crud","nav-from-registry"],"href":"/slices/admin","previewPath":"/preview/slices/admin","install":"npx rahman-resources add admin"},{"source":"slice","slug":"platform-admin","title":"Platform Admin — Multi-Tenant Control Plane","description":"Multi-tenant SaaS control plane. Workspace lifecycle ops (list/delete/cascade), per-tenant tier presets (gates + quota), KPI dashboard grid. Consumer-domain bits injected via adapter props (tenantTablesAdapter / tierPresets / kpiSources). Contract-only scaffold; canonical implementation lands via /rr-send from superspace. See docs/contract-negotiations-2026-05-15.md §4.","category":"infra","tags":["infra","admin","multi-tenant","saas","platform"],"href":"/slices/platform-admin","previewPath":"/preview/slices/platform-admin","install":"npx rahman-resources add platform-admin"},{"source":"slice","slug":"audit-log","title":"Audit Log — Workspace Events","description":"Workspace-scoped audit event recorder. Canonical logAuditEvent helper for mutations + actions; supports entity tracking, before/after diff, IP/user-agent capture.","category":"infra","tags":["infra","audit","compliance","logging"],"href":"/slices/audit-log","previewPath":"/preview/slices/audit-log","install":"npx rahman-resources add audit-log"},{"source":"slice","slug":"comments","title":"Comments — Threaded","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.","category":"content","tags":["content","social","comments","threaded","annotations"],"href":"/slices/comments","previewPath":"/preview/slices/comments","install":"npx rahman-resources add comments"},{"source":"slice","slug":"seo","title":"SEO — AI Metadata Generator","description":"Service slice for SEO metadata generation — Anthropic-backed action with per-user 24h cost guard + portable persona prop. No public route. Backend exposes generate + generateAndApply mutations gated by requireAdmin; consumers inject brand voice via the personaContext arg (or buildSeoSystemPrompt factory).","category":"content","tags":["content","seo","ai","anthropic","metadata-generator"],"href":"/slices/seo","previewPath":"/preview/slices/seo","install":"npx rahman-resources add seo"},{"source":"slice","slug":"document-checklist","title":"Document Checklist — Job-Search Doc Tracker","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.","category":"content","tags":["career","documents","checklist","job-search","indonesia"],"href":"/slices/document-checklist","previewPath":"/preview/slices/document-checklist","install":"npx rahman-resources add document-checklist"},{"source":"slice","slug":"pricing-page","title":"Pricing Page","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.","category":"ui","tags":["ui","pricing","section","marketing","saas","tiers","faq"],"href":"/slices/pricing-page","previewPath":"/preview/slices/pricing-page","install":"npx rahman-resources add pricing-page"},{"source":"slice","slug":"feature-grid","title":"Feature Grid","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.","category":"ui","tags":["ui","features","section","marketing","grid","saas"],"href":"/slices/feature-grid","previewPath":"/preview/slices/feature-grid","install":"npx rahman-resources add feature-grid"},{"source":"slice","slug":"landing-sections","title":"Landing Sections","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.","category":"infra","tags":["admin","landing","cms","sections","crud"],"href":"/slices/landing-sections","install":"npx rahman-resources add landing-sections"},{"source":"slice","slug":"faq-section","title":"FAQ Section","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.","category":"ui","tags":["ui","faq","section","accordion","marketing"],"href":"/slices/faq-section","previewPath":"/preview/slices/faq-section","install":"npx rahman-resources add faq-section"},{"source":"slice","slug":"testimonials-grid","title":"Testimonials Grid","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.","category":"ui","tags":["ui","testimonials","section","marketing","social-proof","saas"],"href":"/slices/testimonials-grid","previewPath":"/preview/slices/testimonials-grid","install":"npx rahman-resources add testimonials-grid"},{"source":"slice","slug":"blog-section","title":"Blog Section","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.","category":"ui","tags":["ui","blog","section","marketing","content","list","detail"],"href":"/slices/blog-section","previewPath":"/preview/slices/blog-section","install":"npx rahman-resources add blog-section"},{"source":"slice","slug":"changelog-feed","title":"Changelog Feed","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.","category":"ui","tags":["ui","changelog","section","saas","release-notes","marketing"],"href":"/slices/changelog-feed","previewPath":"/preview/slices/changelog-feed","install":"npx rahman-resources add changelog-feed"},{"source":"slice","slug":"portfolio-section","title":"Portfolio Section","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.","category":"ui","tags":["ui","portfolio","section","marketing","case-study","list","detail"],"href":"/slices/portfolio-section","previewPath":"/preview/slices/portfolio-section","install":"npx rahman-resources add portfolio-section"},{"source":"slice","slug":"notion-blocks","title":"Notion Blocks — editor primitive bundle","description":"One install ships four notion-style block primitives: KaTeX equation, highlight.js code block, per-page subscription bell, drag-fill grid cell selection. Each is config-driven with zero shared-state coupling — drops into any React surface (marketing landing, admin panel, editor, doc page). Bundled to keep the catalog tight; per-block narrow imports still available via individual peer slices.","category":"ui","tags":["ui","notion","block","primitive","bundle","editor","katex","highlight","subscription","drag-fill","notion-like"],"href":"/slices/notion-blocks","previewPath":"/preview/slices/notion-blocks","install":"npx rahman-resources add notion-blocks"},{"source":"slice","slug":"theme-presets","title":"Theme Presets — tweakcn loader + 30+ color schemes","description":"Tweakcn theme preset loader — fetches from /r/registry.json + applies CSS variable overrides to next-themes. Ships <ThemePicker> popover, <TweakcnSwitcher> for quick toggle, <ThemeColorSync> for live preview, and a 30+ preset catalog. localStorage key `nosion:theme-preset` (preserved verbatim — host can rename for new deploys). Pure React + Tailwind v4 + next-themes. No backend.","category":"ui","tags":["ui","theme","tweakcn","color","preset","notion-like"],"href":"/slices/theme-presets","previewPath":"/preview/slices/theme-presets","install":"npx rahman-resources add theme-presets"},{"source":"slice","slug":"files","title":"Files — pluggable upload + URL resolver with storage-adapter contract","description":"Host-pluggable file upload + URL resolution. Ships <FileUploadButton>, <FileChip>, useFileUpload(), useFileUrl() — all reading from a FilesAdapter the host wires via <FilesAdapterProvider>. Bundled localStorage demo adapter stores blobs as data URLs (small files only). Drop in your own adapter for Convex / S3 / GCS / R2. The slice itself has zero backend coupling, proving the storage-adapter pattern for the rest of the open-silong blocked-pending-adapter wave (cover, workspace-io, templates, …).","category":"data","tags":["data","upload","files","storage","adapter","portable","notion-like"],"href":"/slices/files","previewPath":"/preview/slices/files","install":"npx rahman-resources add files"},{"source":"slice","slug":"equation","title":"Equation — Notion-style KaTeX block primitive","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.","category":"ui","tags":["ui","notion","notion-like","equation","katex","latex","math","block","primitive","editor"],"href":"/slices/equation","previewPath":"/preview/slices/equation","install":"npx rahman-resources add equation"},{"source":"slice","slug":"code-block","title":"Code Block — Notion-style syntax-highlighted code primitive","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.","category":"ui","tags":["ui","notion","notion-like","code","syntax","highlight","highlight.js","block","primitive","editor"],"href":"/slices/code-block","previewPath":"/preview/slices/code-block","install":"npx rahman-resources add code-block"},{"source":"slice","slug":"notifications","title":"Notifications — Notion-style per-page Notify Me","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.","category":"ui","tags":["ui","notion","notion-like","notifications","subscribe","notify","bell","popover","localstorage","primitive"],"href":"/slices/notifications","previewPath":"/preview/slices/notifications","install":"npx rahman-resources add notifications"},{"source":"slice","slug":"database-cell-selection","title":"Database Cell Selection — Notion-style drag-fill + multi-select","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.).","category":"ui","tags":["ui","notion","notion-like","database","grid","cell","selection","drag-fill","spreadsheet","primitive","table"],"href":"/slices/database-cell-selection","previewPath":"/preview/slices/database-cell-selection","install":"npx rahman-resources add database-cell-selection"},{"source":"slice","slug":"notion-database","title":"Notion Database — embedded DB surface (6 views, optional)","description":"Portable Notion-style database surface. Optional companion to notion-shell — install shell alone for pages + sidebar + block editor, add notion-database when you want embedded databases. Ships NotionDatabase (full DB UI w/ ViewTabs + ViewOptions + per-column menu), NotionProperty (value + schema editor), 10 property-cell types (text / number / checkbox / select / multi_select / status / date / url / email / phone), 6 built-in views (Table / Board / List / Gallery / Calendar / Feed), and pure helpers (applyView, groupBy, bucketByDate). Domain types live in notion-shell (single source of truth — Page.rowOfDatabaseId + rowProps reference them) and re-exported here for convenience. Lifted from notion-page-clone (Nosion) — CI-wave split (2026-05-21).","category":"ui","tags":["ui","notion","notion-like","database","table","board","list","gallery","calendar","feed","kanban","views","filter","sort","property","primitive","optional","embeddable"],"href":"/slices/notion-database","previewPath":"/preview/slices/notion-database","install":"npx rahman-resources add notion-database"},{"source":"slice","slug":"notion-shell","title":"Notion Shell — page + sidebar + block editor primitives (pure, no database)","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.","category":"ui","tags":["ui","notion","shell","wrapper","sidebar","page","database","primitive","portable","slash-menu","decorator","wysiwyg","views","kanban","calendar","gallery","drag","cover","embed","image","notion-like"],"href":"/slices/notion-shell","previewPath":"/preview/slices/notion-shell","install":"npx rahman-resources add notion-shell"},{"source":"template","slug":"personal-brand-os","title":"Personal Brand OS","description":"Full-app personal site — public landing (hero, blog, portfolio, services, resources, contact) + admin dashboard (posts, leads, chatbot, comments). Inspired by saudivisuals.com + cescadesigns. Fill-in-the-blank with lorem ipsum.","category":"website-template","tags":["template","personal-brand","blog","portfolio","admin","saas"],"href":"/templates/personal-brand-os","previewPath":"/preview/personal-brand-os/public","install":"npx rahman-resources add personal-brand-os"},{"source":"template","slug":"agency-studio-os","title":"Agency Studio OS","description":"Full-app B2B agency / studio site — public (home, services, work + project detail, about, contact) + admin (dashboard, projects pipeline, clients, services, leads, settings). Inspired by saudivisuals.com + cescadesigns.","category":"website-template","tags":["template","agency","studio","portfolio","b2b","admin","saas"],"href":"/templates/agency-studio-os","previewPath":"/preview/agency-studio-os/public","install":"npx rahman-resources add agency-studio-os"},{"source":"layout","slug":"landing-hero-carousel","title":"Landing — Hero Carousel","description":"Full-width image carousel hero with auto-fade + dot indicators. Originally CMS-driven via Convex. Best for visual brands.","category":"marketing","tags":["marketing","carousel","image","cms"],"href":"/layouts/landing-hero-carousel","previewPath":"/preview/landing-hero-carousel","install":"npx rahman-resources add landing-hero-carousel"},{"source":"layout","slug":"landing-asymmetric-masonry","title":"Landing — Asymmetric Masonry","description":"8-slot repeating asymmetric grid. Intersection-observer staggered scroll-reveal. Lifted from rahmanef.com portfolio.","category":"marketing","tags":["marketing","portfolio","masonry","scroll-reveal"],"href":"/layouts/landing-asymmetric-masonry","previewPath":"/preview/landing-asymmetric-masonry","install":"npx rahman-resources add landing-asymmetric-masonry"},{"source":"layout","slug":"landing-bento","title":"Landing — Bento Grid","description":"Feature-grid marketing landing. Compose Card + Magnetic + KineticHeading. Modern SaaS feel.","category":"marketing","tags":["marketing","bento","features"],"href":"/layouts/landing-bento","previewPath":"/preview/landing-bento","install":"npx rahman-resources add landing-bento"},{"source":"layout","slug":"landing-kinetic-text","title":"Landing — Kinetic Text","description":"Brand-forward landing. Letter-stagger headings + magnetic CTAs + marquee strips. Motion-heavy.","category":"marketing","tags":["marketing","motion","type"],"href":"/layouts/landing-kinetic-text","previewPath":"/preview/landing-kinetic-text","install":"npx rahman-resources add landing-kinetic-text"},{"source":"layout","slug":"dashboard-three-column","title":"Dashboard — Three Column","description":"Kitab flagship. Left tree / main / right inspector. Resizable, collapsible, mobile drawer fallback. Used by Database, Tasks, Contacts.","category":"dashboard","tags":["dashboard","three-column","resizable","responsive"],"href":"/layouts/dashboard-three-column","previewPath":"/preview/dashboard-three-column","install":"npx rahman-resources add dashboard-three-column"},{"source":"layout","slug":"dashboard-ide","title":"Dashboard — IDE","description":"Activity bar + tabs + editor + bottom panel. Editor-first apps (notion, code, doc tools).","category":"dashboard","tags":["dashboard","ide","editor"],"href":"/layouts/dashboard-ide","previewPath":"/preview/dashboard-ide","install":"npx rahman-resources add dashboard-ide"},{"source":"layout","slug":"dashboard-mobile-dock","title":"Dashboard — Mobile Dock","description":"Mobile-first auth app. MobileTopBar + content + MobileDashboardDock bottom nav. Native-app feel on mobile, sidebar on desktop.","category":"dashboard","tags":["dashboard","mobile","pwa"],"href":"/layouts/dashboard-mobile-dock","previewPath":"/preview/dashboard-mobile-dock","install":"npx rahman-resources add dashboard-mobile-dock"},{"source":"layout","slug":"cms-public-storefront","title":"CMS — Public Storefront","description":"E-commerce / blog public storefront. Convex read-only. Cart context + currency selector + i18n.","category":"cms","tags":["cms","ecommerce","storefront"],"href":"/layouts/cms-public-storefront","previewPath":"/preview/cms-public-storefront","install":"npx rahman-resources add cms-public-storefront"},{"source":"template","slug":"notion-page-clone-os","title":"Notion Page Clone OS — localStorage demo (pointer to open-silong for production)","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.","category":"website-template","tags":["template","notion","notes","blocks","katex","code","editor","indonesia"],"href":"/templates/notion-page-clone-os","previewPath":"/preview/notion-page-clone-os/public","install":"npx rahman-resources add notion-page-clone-os"},{"source":"template","slug":"saas-marketing-os","title":"SaaS Marketing OS","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.","category":"website-template","tags":["template","saas","marketing","mdx","blog","changelog","admin"],"href":"/templates/saas-marketing-os","previewPath":"/preview/saas-marketing-os/public","install":"npx rahman-resources add saas-marketing-os"},{"source":"template","slug":"kreator-studio-os","title":"Kreator Studio OS","description":"Multi-channel content planner + voice trainer + repurposing engine + carousel maker. Public newsletter site + admin (planner, voice, scripts, carousels, assets, performance, comments). Bahasa Indonesia, ID-first.","category":"website-template","tags":["template","creator","newsletter","content-planner","voice-trainer","indonesia"],"href":"/templates/kreator-studio-os","previewPath":"/preview/kreator-studio-os/public","install":"npx rahman-resources add kreator-studio-os"},{"source":"template","slug":"konsultan-os","title":"Konsultan OS","description":"Consultancy workspace — public services landing + case studies + admin (CRM, proposals AI, kontrak ID-aware, projects, PajakAware billing, documents). Indonesian-tax aware (PPN/PPh).","category":"website-template","tags":["template","consultant","crm","proposals","billing","indonesia"],"href":"/templates/konsultan-os","previewPath":"/preview/konsultan-os/public","install":"npx rahman-resources add konsultan-os"},{"source":"template","slug":"wirausaha-os","title":"Wirausaha OS","description":"Indonesian UKM operations hub — public storefront + 8-tab admin (multi-business registry, inventory, orders, customers/CRM, finance with AI laporan, staff). Bahasa Indonesia, mobile-first public.","category":"website-template","tags":["template","smb","ukm","multi-business","midtrans","qris","indonesia"],"href":"/templates/wirausaha-os","previewPath":"/preview/wirausaha-os/public","install":"npx rahman-resources add wirausaha-os"},{"source":"template","slug":"riset-kit","title":"Riset Kit","description":"Research workspace — public knowledge-base reader + admin (document library, AI reader, literature review, citations, notes). Bahasa Indonesia academic-style, vector-search ready.","category":"website-template","tags":["template","research","knowledge-base","vector-search","ai-reader","indonesia"],"href":"/templates/riset-kit","previewPath":"/preview/riset-kit/public","install":"npx rahman-resources add riset-kit"},{"source":"layout","slug":"hero-centered","title":"Hero — Centered","description":"Single-column centered hero with eyebrow pill, headline, sub-copy, and dual CTA. Radial gradient backdrop.","category":"marketing","tags":["block","hero","centered","marketing"],"href":"/layouts/hero-centered","previewPath":"/preview/hero-centered","install":"npx rahman-resources add hero-centered"},{"source":"layout","slug":"hero-split","title":"Hero — Split (Text + Visual)","description":"Two-column hero: left copy + feature list + CTAs, right visual slot. 9-cell mock grid placeholder for product shot.","category":"marketing","tags":["block","hero","split","marketing","product"],"href":"/layouts/hero-split","previewPath":"/preview/hero-split","install":"npx rahman-resources add hero-split"},{"source":"layout","slug":"hero-bento-bg","title":"Hero — Bento Background","description":"Bento mini-grid behind a centered headline. Radial mask focuses the eye on the copy while the grid hints at features.","category":"marketing","tags":["block","hero","bento","marketing","decorative"],"href":"/layouts/hero-bento-bg","previewPath":"/preview/hero-bento-bg","install":"npx rahman-resources add hero-bento-bg"},{"source":"layout","slug":"hero-video-loop","title":"Hero — Video Loop (dark)","description":"Dark-mode hero with conic-gradient animated backdrop (stand-in for video). Play CTA, headline, dual CTA.","category":"marketing","tags":["block","hero","video","marketing","dark"],"href":"/layouts/hero-video-loop","previewPath":"/preview/hero-video-loop","install":"npx rahman-resources add hero-video-loop"},{"source":"layout","slug":"hero-animated-text","title":"Hero — Animated Text","description":"Rotating word inside the headline cycles every 2s with gradient text + fade-slide transition. Lightweight, no extra deps.","category":"marketing","tags":["block","hero","motion","marketing","kinetic"],"href":"/layouts/hero-animated-text","previewPath":"/preview/hero-animated-text","install":"npx rahman-resources add hero-animated-text"},{"source":"layout","slug":"pricing-three","title":"Pricing — Three Tier","description":"Classic 3-tier card layout. Middle tier highlighted with Most Popular badge + soft shadow.","category":"marketing","tags":["block","pricing","marketing","saas"],"href":"/layouts/pricing-three","previewPath":"/preview/pricing-three","install":"npx rahman-resources add pricing-three"},{"source":"layout","slug":"pricing-four","title":"Pricing — Four Tier","description":"Four-tier with Best Value badge on tier 3. Compact card chrome, 4-column grid that collapses gracefully.","category":"marketing","tags":["block","pricing","marketing","saas"],"href":"/layouts/pricing-four","previewPath":"/preview/pricing-four","install":"npx rahman-resources add pricing-four"},{"source":"layout","slug":"pricing-toggle","title":"Pricing — Monthly/Yearly Toggle","description":"3-tier with a monthly/yearly pill toggle. Yearly price strikethroughs the monthly, -20% savings badge inside the toggle.","category":"marketing","tags":["block","pricing","marketing","interactive"],"href":"/layouts/pricing-toggle","previewPath":"/preview/pricing-toggle","install":"npx rahman-resources add pricing-toggle"},{"source":"layout","slug":"pricing-compare","title":"Pricing — Feature Comparison","description":"Single comparison table: feature rows × plan columns. Check/Minus icons, header row with prices, sticky CTA row.","category":"marketing","tags":["block","pricing","marketing","comparison","table"],"href":"/layouts/pricing-compare","previewPath":"/preview/pricing-compare","install":"npx rahman-resources add pricing-compare"},{"source":"layout","slug":"pricing-slider","title":"Pricing — Usage Slider","description":"Range slider drives the price. Tier name and per-seat cost update live. Single-card layout, focus on the math.","category":"marketing","tags":["block","pricing","marketing","interactive","usage"],"href":"/layouts/pricing-slider","previewPath":"/preview/pricing-slider","install":"npx rahman-resources add pricing-slider"},{"source":"layout","slug":"accordion-faq","title":"Accordion — Classic FAQ","description":"Single-open FAQ accordion. ChevronDown rotates, content reveals below. Clean, compact, perfect for support pages.","category":"marketing","tags":["block","accordion","faq","marketing"],"href":"/layouts/accordion-faq","previewPath":"/preview/accordion-faq","install":"npx rahman-resources add accordion-faq"},{"source":"layout","slug":"accordion-grouped","title":"Accordion — Grouped Sections","description":"FAQ split into themed groups (Getting Started / Slices / Billing). Each group is its own card. Independent open state per item.","category":"marketing","tags":["block","accordion","faq","marketing","grouped"],"href":"/layouts/accordion-grouped","previewPath":"/preview/accordion-grouped","install":"npx rahman-resources add accordion-grouped"},{"source":"layout","slug":"accordion-sidebar","title":"Accordion — Sidebar Navigation","description":"Docs-style: left nav switches sections, right pane shows the section's accordion. Two-axis navigation in one layout.","category":"marketing","tags":["block","accordion","docs","sidebar","navigation"],"href":"/layouts/accordion-sidebar","previewPath":"/preview/accordion-sidebar","install":"npx rahman-resources add accordion-sidebar"},{"source":"layout","slug":"accordion-animated","title":"Accordion — Smooth Animated","description":"Grid-row transition for true height animation, no janky calc. Each item is a rounded card with rotating plus → primary close icon.","category":"marketing","tags":["block","accordion","marketing","motion"],"href":"/layouts/accordion-animated","previewPath":"/preview/accordion-animated","install":"npx rahman-resources add accordion-animated"},{"source":"layout","slug":"accordion-multi","title":"Accordion — Multi-open","description":"All items can be open at once. Expand-all / Collapse-all toggle in header. Best for compare-style reading.","category":"marketing","tags":["block","accordion","marketing","multi-open"],"href":"/layouts/accordion-multi","previewPath":"/preview/accordion-multi","install":"npx rahman-resources add accordion-multi"},{"source":"layout","slug":"blog-grid","title":"Blog — Card Grid","description":"3-column responsive card grid. Cover thumbnail (HSL gradient), title, excerpt, author·date·read meta. Default blog index shape.","category":"cms","tags":["block","blog","cms","grid"],"href":"/layouts/blog-grid","previewPath":"/preview/blog-grid","install":"npx rahman-resources add blog-grid"},{"source":"layout","slug":"blog-list","title":"Blog — Dense List","description":"Single-column scannable list. Thumbnail left, meta + title + excerpt right. High density, low scroll.","category":"cms","tags":["block","blog","cms","list"],"href":"/layouts/blog-list","previewPath":"/preview/blog-list","install":"npx rahman-resources add blog-list"},{"source":"layout","slug":"blog-magazine","title":"Blog — Magazine Layout","description":"Editorial spread: large hero post (2/3 width) + secondary featured + tail of headlines. Issue-number header gives quarterly feel.","category":"cms","tags":["block","blog","cms","editorial","magazine"],"href":"/layouts/blog-magazine","previewPath":"/preview/blog-magazine","install":"npx rahman-resources add blog-magazine"},{"source":"layout","slug":"blog-masonry","title":"Blog — Masonry","description":"CSS columns-based masonry with varying card heights for organic rhythm. break-inside-avoid keeps each card intact.","category":"cms","tags":["block","blog","cms","masonry"],"href":"/layouts/blog-masonry","previewPath":"/preview/blog-masonry","install":"npx rahman-resources add blog-masonry"},{"source":"layout","slug":"blog-featured","title":"Blog — Featured Hero + Tail","description":"Full-bleed cover hero on the first post, then a tight 2-column grid for the rest. Cinematic open, fast scroll for the tail.","category":"cms","tags":["block","blog","cms","featured","hero"],"href":"/layouts/blog-featured","previewPath":"/preview/blog-featured","install":"npx rahman-resources add blog-featured"}],"slices":[{"slug":"convex-auth","title":"Convex Auth — Multi-Provider Sign-in","category":"auth","kind":"backend","version":"0.2.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 with i18n, prop-driven provider list, and split Login/Register tabs. No Clerk.","slicePath":"frontend/slices/convex-auth","convexPaths":["convex/features/auth"],"tags":["auth","convex","password","magic-link","google","anonymous","no-clerk","pbkdf2"],"install":"npm i @convex-dev/auth @auth/core resend","previewPath":"/preview/slices/convex-auth"},{"slug":"doku-payment","title":"DOKU — Indonesia Payment","category":"payment","kind":"full","version":"0.1.0","description":"Pembayaran lokal Indonesia via DOKU — Checkout (hosted) + Direct (VA / QRIS / e-Wallet / PayLater / Minimarket / Kartu). HMAC-signed REST + signature-verified webhook + idempotent retries. Sibling slice to midtrans-payment dengan paymentOrders schema yang dishare.","slicePath":"frontend/slices/doku-payment","convexPaths":["convex/features/payment"],"tags":["payment","doku","indonesia","qris","virtual-account","ewallet","checkout"],"install":"","previewPath":"/preview/slices/doku-payment"},{"slug":"midtrans-payment","title":"Midtrans — Indonesia Payment","category":"payment","kind":"full","version":"0.1.0","description":"Pembayaran lokal Indonesia via Midtrans Snap (BCA, Mandiri, BRI, e-wallet GoPay/OVO/Dana, QRIS). Webhook untuk konfirmasi. Provider-isolated under components/providers/midtrans + actions/midtrans so Doku/Stripe land as siblings.","slicePath":"frontend/slices/midtrans-payment","convexPaths":["convex/features/payment"],"tags":["payment","midtrans","indonesia","qris","snap"],"install":"npm i midtrans-client","previewPath":"/preview/slices/midtrans-payment"},{"slug":"resend-newsletter","title":"Resend — Transactional & Newsletter","category":"email","kind":"backend","version":"0.1.0","description":"Transactional email + newsletter blast via Resend. Double opt-in flow + audience segmentation. Magic-link delivery for Convex Auth.","slicePath":"frontend/slices/resend-newsletter","convexPaths":["convex/features/newsletter"],"tags":["email","newsletter","resend"],"install":"npm i resend react-email @react-email/components","previewPath":"/preview/slices/resend-newsletter"},{"slug":"ai-chat","title":"AI Chat — Workbench / Sidebar / Search","category":"ai","kind":"full","version":"0.1.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.","slicePath":"frontend/slices/ai-chat","convexPaths":["convex/features/ai"],"tags":["ai","ai:chat","streaming","multimodal","tool-calls","agent-mode","rag","citations","branching","history"],"install":"npm i ai @ai-sdk/anthropic @ai-sdk/openai","previewPath":"/preview/slices/ai-chat"},{"slug":"ai-studio","title":"AI Studio — Generation Canvas","category":"ai","kind":"full","version":"0.1.0","description":"AI is the primary UI — single big prompt input → live-streaming output → variation grid → version tree. Suno / Midjourney / Lovable / v0 pattern. Output kinds: text, code, image, audio (configurable per template).\n\nUse cases:\n  – AI image generation product (creative output)\n  – AI logo / banner / social-post studio\n  – AI code-snippet generator (component scaffolder)\n  – AI music / voiceover producer\n  – AI blog-draft factory (text)\n\nFeatures: prompt history, branch + compare outputs, like + favorite, share-to-link, templates from ai-admin.","slicePath":"frontend/slices/ai-studio","convexPaths":["convex/features/ai"],"tags":["ai","ai:studio","generation","streaming","history","branching","image-gen"],"install":"","previewPath":"/preview/slices/ai-studio"},{"slug":"ai-agents","title":"AI Agents — Autonomous Workers","category":"ai","kind":"full","version":"0.1.0","description":"Background AI workers. Define an agent (skill × model × tools × max-iter), trigger it on-demand or on a cron schedule, watch the step-by-step trace as it runs. Devin / Replit-Agent / Manus pattern.\n\nUse cases:\n  – Nightly audit-bp on the codebase (PR-reviewer style)\n  – Weekly SEO crawl + content suggestions\n  – Auto-moderate comment queue\n  – Scheduled data ingestion + summarization\n  – Long-form research task with multi-source citations\n\nFeatures: queue + live trace, per-step retry policy, hard cost cap, shareable trace URLs, full audit-log integration.","slicePath":"frontend/slices/ai-agents","convexPaths":["convex/features/ai"],"tags":["ai","ai:agents","agent-mode","tool-calls","async","queue","traces"],"install":"","previewPath":"/preview/slices/ai-agents"},{"slug":"ai-admin","title":"AI Admin — Console (Instructions · Skills · Tools · Agents · Providers)","category":"ai","kind":"full","version":"0.2.0","description":"Central operator console for the whole AI stack. Every other ai-* feature reads its registries from here. Tabs ordered to match the build-flow:\n\n  1. Providers   — register Anthropic / OpenAI / Google / Mistral / Ollama (API keys AES-encrypted at rest)\n  2. Models      — per-provider catalog (capabilities, context window, pricing)\n  3. Instructions — custom system-prompt library (Claude Projects-style)\n  4. Skills      — named instruction + model default + tool defaults (consumed by chat + studio)\n  5. Tools       — JSON-schema function specs + impl (http / convex / shell) + sandbox flag\n  6. Agents      — skill × model × tools × max-iter (consumed by ai-agents)\n  7. Budgets     — per-workspace cost caps + alerts + hard kill\n  8. Audit       — every AI call: actor / agent / tokens / cost / latency / outcome\n\nIncludes Create-Agent / Create-Skill / Create-Tool / Create-Instruction wizards.","slicePath":"frontend/slices/ai-admin","convexPaths":["convex/features/ai"],"tags":["ai","ai:admin","instructions","skills","tools","agents","providers","models","budgets","audit"],"install":"","previewPath":"/preview/slices/ai-admin"},{"slug":"ai-router","title":"AI Router — Backend Provider Proxy","category":"ai","kind":"backend","version":"0.1.0","description":"Backend infrastructure (no UI). Single proxy that every other ai-* feature calls. Tier-routed — nano (Haiku) for classification, mid (Sonnet) for chat, flagship (Opus) for deep reasoning. Per-call usage log + cost guard. Works with direct provider keys or OpenRouter umbrella.\n\nNot something you mount — installed automatically as a peer when you add ai-chat / ai-studio / ai-agents.","slicePath":"frontend/slices/ai-router","convexPaths":["convex/features/ai"],"tags":["ai","ai:backend","tier-routing","cost-guard"],"install":"npm i ai @openrouter/ai-sdk-provider","previewPath":"/preview/slices/ai-router"},{"slug":"vector-search","title":"Convex Vector Search","category":"search","kind":"full","version":"0.1.0","description":"Embeddings-based search via Convex's built-in vector index. Embed via OpenAI text-embedding-3-small (1536-dim), query via vectorIndex().","slicePath":"frontend/slices/vector-search","convexPaths":["convex/features/search"],"tags":["search","vector","embeddings","convex","rag"],"install":"npm i openai","previewPath":"/preview/slices/vector-search"},{"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.","slicePath":"frontend/slices/mdx-blog","convexPaths":[],"tags":["content","blog","mdx","static"],"install":"npm i next-mdx-remote rehype-pretty-code remark-gfm reading-time","previewPath":"/preview/slices/mdx-blog"},{"slug":"cal-com-booking","title":"Cal.com Booking","category":"data","kind":"full","version":"0.1.0","description":"Embedded Cal.com booking widget + webhook receiver to mirror bookings into Convex.","slicePath":"frontend/slices/cal-com-booking","convexPaths":["convex/features/bookings"],"tags":["data","scheduling","cal-com","bookings"],"install":"npm i @calcom/embed-react","previewPath":"/preview/slices/cal-com-booking"},{"slug":"full-width-toggle","title":"Full Width Toggle","category":"ui","kind":"ui","version":"0.1.0","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.","slicePath":"frontend/slices/full-width-toggle","convexPaths":[],"tags":["ui","layout","preference","localstorage","dashboard"],"install":"","previewPath":"/preview/slices/full-width-toggle"},{"slug":"command-menu","title":"Command Menu","category":"ui","kind":"ui","version":"0.2.0","description":"Renderless ⌘K command palette + generic search modal. Consumer supplies CommandGroup[] + onSelect + label bag; slice owns dialog chrome, ⌘K hotkey, MRU history. Pulled UP from notion-page-clone's command-palette renderless surface (Wave N+3.7) — Nosion adapters dropped at the kitab boundary.","slicePath":"frontend/slices/command-menu","convexPaths":[],"tags":["ui","palette","cmd-k","navigation","keyboard","search","notion-like"],"install":"npm i cmdk","previewPath":"/preview/slices/command-menu"},{"slug":"motion-primitives","title":"Motion Primitives (8)","category":"ui","kind":"ui","version":"0.1.0","description":"Eight ready-to-style motion components: marquee, kinetic-heading, magnetic, cursor-spotlight, stat-counter, reading-progress, grain, lightbox. Framer-Motion-powered, tree-shakeable. Facade slice — pulls from template-base/frontend/slices/motion-primitives.","slicePath":"template-base/frontend/slices/motion-primitives","convexPaths":[],"tags":["ui","motion","animation","marquee","framer-motion"],"install":"npm i framer-motion","previewPath":"/preview/slices/motion-primitives"},{"slug":"responsive-dialog","title":"Responsive Dialog (Sheet ↔ Modal)","category":"ui","kind":"ui","version":"0.1.0","description":"ResponsiveDialog — auto-switches between bottom Sheet (mobile) and centered Dialog (desktop) at the md breakpoint. Same API as shadcn Dialog. Kitab forbids raw <dialog>; use this everywhere. Facade slice — pulls from template-base/frontend/slices/responsive-dialog.","slicePath":"template-base/frontend/slices/responsive-dialog","convexPaths":[],"tags":["ui","dialog","modal","sheet","responsive","primitive"],"install":"","previewPath":"/preview/slices/responsive-dialog"},{"slug":"dashboard-shell","title":"Dashboard Shell — Responsive","category":"ui","kind":"ui","version":"0.1.0","description":"ResponsiveDashboardShell — desktop sidebar + topbar, mobile dock + sheet sidebar, breakpoint-aware. Ports superspace's layout/dashboard/{Desktop,Mobile,Responsive}DashboardShell + sidebar primary/secondary slots. Facade slice — pulls from template-base/frontend/slices/dashboard-shell.","slicePath":"template-base/frontend/slices/dashboard-shell","convexPaths":[],"tags":["ui","layout","dashboard","sidebar","topbar","responsive"],"install":"","previewPath":"/preview/slices/dashboard-shell"},{"slug":"three-column","title":"Three-Column Layout — Sidebar/Content/Inspector","category":"ui","kind":"ui","version":"0.1.0","description":"ThreeColumnLayoutAdvanced — collapsible left/right + resizable widths + responsive breakpoints + PanelSection compound (Header/Items/Footer) + per-panel footer slots. Models shadcn sidebar API for the panel interior. Pair with PanelGroup/PanelMenu/PanelSeparator primitives. Trigger ≠ header (V-wave separation rule).","slicePath":"template-base/frontend/slices/three-column","convexPaths":[],"tags":["ui","layout","three-column","sidebar","inspector","panel-section","responsive","resizable"],"install":"","previewPath":"/preview/three-column-trio"},{"slug":"broadcast-channel-sync","title":"BroadcastChannel — Cross-tab Sync","category":"realtime","kind":"ui","version":"0.1.0","description":"Same-origin cross-tab + cross-iframe state sync via BroadcastChannel API. Tiny, no backend, no install.","slicePath":"frontend/slices/broadcast-channel-sync","convexPaths":[],"tags":["realtime","cross-tab","broadcast-channel","demo-pattern"],"install":"// no install — Web Platform API","previewPath":"/preview/slices/broadcast-channel-sync"},{"slug":"rbac-roles","title":"RBAC — Tiered System Roles","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).","slicePath":"","convexPaths":["template-base/convex/lib/rbac"],"tags":["rbac","auth","permissions","roles","workspaces"],"install":"npx rahman-resources add rbac-roles","previewPath":"/preview/slices/rbac-roles"},{"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.","slicePath":"template-base/frontend/slices/admin-panel","convexPaths":["template-base/convex/features/admin-panel"],"tags":["admin","owner","platform","rbac","instrumentation","panel"],"install":"npx rahman-resources add admin-panel","previewPath":"/preview/slices/admin-panel"},{"slug":"event-tracking","title":"Event Tracking — P0 Instrumentation","category":"data","kind":"full","version":"0.1.0","description":"Client SDK + Convex ingestion endpoint for structured product events. Auto-captures page_view/signup/login + UTM/referrer/first-touch attribution. Batched flush via requestIdleCallback. Targets <100ms p99 ingestion.","slicePath":"template-base/frontend/slices/admin-panel/slices/events","convexPaths":["template-base/convex/features/admin-panel","template-base/convex/features/analytics"],"tags":["events","analytics","instrumentation","attribution","utm","p0"],"install":"npx rahman-resources add event-tracking","previewPath":"/preview/slices/event-tracking"},{"slug":"theme-preset-switcher","title":"Theme Preset Switcher","category":"ui","kind":"ui","version":"0.1.0","description":"Runtime theme swap (colors + fonts + shadows + tracking). OKLch CSS vars per preset. Persists to localStorage + Convex. Add a new preset by appending a CSS block in app/globals.css with [data-theme=\"<name>\"], then register in preset-groups.ts.","slicePath":"template-base/frontend/shared/theme","convexPaths":[],"tags":["theme","presets","oklch","design-system"],"install":"npx rahman-resources add theme-preset-switcher","previewPath":"/preview/slices/theme-preset-switcher"},{"slug":"icon-picker","title":"Icon Picker","category":"ui","kind":"ui","version":"0.2.0","description":"Emoji + lucide icon picker with search, 10-color palette, Twemoji/native toggle, recents tracking. One string stores emoji OR lucide:Name OR with ?c=hex tint — backwards-compat with raw-emoji fields. Two variants: Popover (compact trigger) and Inline (full sheet/dialog use). Lifted 2026-05-16 from notion-page-clone — full implementation (19 files) including emoji-keywords search index, twemoji renderer, lucide-catalog, recents store, style-pref hook.","slicePath":"frontend/slices/icon-picker","convexPaths":[],"tags":["icon","emoji","lucide","picker","twemoji","notion","notion-like"],"install":"npx rahman-resources add icon-picker","previewPath":"/preview/slices/icon-picker"},{"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.","slicePath":"frontend/slices/cta","convexPaths":[],"tags":["ui","marketing","cta","section","brutalist"],"install":"npx rahman-resources add cta"},{"slug":"hero","title":"Hero","category":"ui","kind":"ui","version":"0.1.0","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.","slicePath":"frontend/slices/hero","convexPaths":[],"tags":["ui","hero","marketing","landing","section","editorial","brutalist"],"install":"npx rahman-resources add hero"},{"slug":"rate-limit","title":"Rate Limit","category":"infra","kind":"backend","version":"0.1.0","description":"Convex-backed per-key request counter. Atomic check-and-increment via `consume` mutation; expired rows pruned by `_pruneExpired` internalMutation wired to a 5-min cron. Replaces single-replica in-memory Map so multi-replica Next deployments share buckets. Caller chooses key namespace (csp:<ip>, mcp:<ip>, oauth_token:<ip>). Lifted 2026-05-16 from rahmanef.com.","slicePath":"frontend/slices/rate-limit","convexPaths":["convex/features/rate-limit"],"tags":["infra","rate-limit","convex","backend","throttle"],"install":"npx rahman-resources add rate-limit"},{"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.","slicePath":"frontend/slices/subscribers","convexPaths":["convex/features/subscribers"],"tags":["email","newsletter","subscribers","convex","backend"],"install":"npx rahman-resources add subscribers"},{"slug":"testimonials","title":"Testimonials","category":"content","kind":"backend","version":"0.1.0","description":"Quote/name/role rotator backend. Public `listAll` + `get` (no auth — testimonials are public), admin CRUD via `requireAdmin`, internal `seed` for one-shot bootstrap. Indexed by `order` so carousel/grid keeps stable rotation. Lifted 2026-05-16 from rahmanef.com; token-based admin gate swapped for rr `_shared/auth`.","slicePath":"frontend/slices/testimonials","convexPaths":["convex/features/testimonials"],"tags":["content","testimonials","convex","backend","marketing"],"install":"npx rahman-resources add testimonials"},{"slug":"services","title":"Services","category":"content","kind":"backend","version":"0.1.0","description":"Service offerings backend — title + summary + deliverables array + sort order. Public read, admin CRUD, internal seed. Pairs with a frontend services grid/list (consumer-side). Lifted 2026-05-16 from rahmanef.com; token-based admin gate swapped for rr `_shared/auth`.","slicePath":"frontend/slices/services","convexPaths":["convex/features/services"],"tags":["content","services","convex","backend","marketing","agency"],"install":"npx rahman-resources add services"},{"slug":"socials","title":"Socials","category":"content","kind":"backend","version":"0.1.0","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.","slicePath":"frontend/slices/socials","convexPaths":["convex/features/socials"],"tags":["content","socials","seo","indieweb","convex","backend"],"install":"npx rahman-resources add socials"},{"slug":"create-your-mcp","title":"Create Your MCP","category":"ai","kind":"full","version":"0.1.0","description":"Turn any rr-based app into an MCP server that ChatGPT custom apps, Claude.ai connectors, Cursor MCP, and other AI clients authenticate to. OAuth 2.1 + PKCE flow with code → bearer exchange, env-configured vendor-host allowlist, single-use codes, 1-year bearer tokens, scope-tagged tools, opaque error collapsing, constant-time token compare. Static MCP_API_KEY fallback for service-account / CI scripts. Sanitized 2026-05-16 from rahmanef.com's production MCP integration — vendor literals (chatgpt.com / OpenAI paths) replaced with MCP_OAUTH_ALLOWED_HOSTS + MCP_OAUTH_ALLOWED_PATH_PREFIXES env vars so the slice ships portable.","slicePath":"frontend/slices/create-your-mcp","convexPaths":["convex/features/create-your-mcp"],"tags":["ai","mcp","oauth","pkce","chatgpt","claude","cursor","convex","integration"],"install":"npx rahman-resources add create-your-mcp","previewPath":"/preview/slices/create-your-mcp"},{"slug":"contact-form-resend","title":"Contact Form + Resend","category":"email","kind":"full","version":"0.1.0","description":"Contact form posting to Resend email API. Server Action + Zod input validation. Convex mutation for storage + Resend send.","slicePath":"template-base/frontend/slices/contact-form-resend","convexPaths":[],"tags":["form","email","resend","convex"],"install":"npx rahman-resources add contact-form-resend","previewPath":"/preview/slices/contact-form-resend"},{"slug":"admin","title":"Admin — Generic Shell","category":"infra","kind":"full","version":"0.2.0","description":"Per-instance admin landing scaffold + portable nav-from-registry factory. Consumer supplies a SliceRegistryAdapter (each slice declares its own admin.activity[]) + queryTable reader; the slice's buildAdminStats(opts) emits the { counts, unreadMessages, activity } shape Convex's admin.stats query returns. Pulled UP from rahmanef.com (Wave N+3.1, commit b542389) — domain literals dropped at the kitab boundary. Gated by requireAdmin on Convex side; superadmin email gate via SUPER_ADMIN_EMAIL env.","slicePath":"frontend/slices/admin","convexPaths":["convex/features/admin"],"tags":["infra","admin","shell","crud","nav-from-registry"],"install":"npx rahman-resources add admin","previewPath":"/preview/slices/admin"},{"slug":"platform-admin","title":"Platform Admin — Multi-Tenant Control Plane","category":"infra","kind":"full","version":"0.1.0","description":"Multi-tenant SaaS control plane. Workspace lifecycle ops (list/delete/cascade), per-tenant tier presets (gates + quota), KPI dashboard grid. Consumer-domain bits injected via adapter props (tenantTablesAdapter / tierPresets / kpiSources). Contract-only scaffold; canonical implementation lands via /rr-send from superspace. See docs/contract-negotiations-2026-05-15.md §4.","slicePath":"frontend/slices/platform-admin","convexPaths":[],"tags":["infra","admin","multi-tenant","saas","platform"],"install":"npx rahman-resources add platform-admin","previewPath":"/preview/slices/platform-admin"},{"slug":"audit-log","title":"Audit Log — Workspace Events","category":"infra","kind":"backend","version":"0.2.0","description":"Workspace-scoped audit event recorder. Canonical logAuditEvent helper for mutations + actions; supports entity tracking, before/after diff, IP/user-agent capture.","slicePath":"frontend/slices/audit-log","convexPaths":["convex/features/audit-log"],"tags":["infra","audit","compliance","logging"],"install":"npx rahman-resources add audit-log","previewPath":"/preview/slices/audit-log"},{"slug":"comments","title":"Comments — Threaded","category":"content","kind":"full","version":"0.2.0","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.","slicePath":"frontend/slices/comments","convexPaths":["convex/features/comments"],"tags":["content","social","comments","threaded","annotations"],"install":"npx rahman-resources add comments","previewPath":"/preview/slices/comments"},{"slug":"seo","title":"SEO — AI Metadata Generator","category":"content","kind":"full","version":"0.2.0","description":"Service slice for SEO metadata generation — Anthropic-backed action with per-user 24h cost guard + portable persona prop. No public route. Backend exposes generate + generateAndApply mutations gated by requireAdmin; consumers inject brand voice via the personaContext arg (or buildSeoSystemPrompt factory).","slicePath":"frontend/slices/seo","convexPaths":["convex/features/seo"],"tags":["content","seo","ai","anthropic","metadata-generator"],"install":"npx rahman-resources add seo","previewPath":"/preview/slices/seo"},{"slug":"document-checklist","title":"Document Checklist — Job-Search Doc Tracker","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.","slicePath":"frontend/slices/document-checklist","convexPaths":["convex/features/document-checklist"],"tags":["career","documents","checklist","job-search","indonesia"],"install":"npx rahman-resources add document-checklist","previewPath":"/preview/slices/document-checklist"},{"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.","slicePath":"frontend/slices/pricing-page","convexPaths":[],"tags":["ui","pricing","section","marketing","saas","tiers","faq"],"install":"npx rahman-resources add pricing-page","previewPath":"/preview/slices/pricing-page"},{"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.","slicePath":"frontend/slices/feature-grid","convexPaths":[],"tags":["ui","features","section","marketing","grid","saas"],"install":"npx rahman-resources add feature-grid","previewPath":"/preview/slices/feature-grid"},{"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.","slicePath":"frontend/slices/landing-sections","convexPaths":[],"tags":["admin","landing","cms","sections","crud"],"install":"npx rahman-resources add landing-sections"},{"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.","slicePath":"frontend/slices/faq-section","convexPaths":[],"tags":["ui","faq","section","accordion","marketing"],"install":"npx rahman-resources add faq-section","previewPath":"/preview/slices/faq-section"},{"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.","slicePath":"frontend/slices/testimonials-grid","convexPaths":[],"tags":["ui","testimonials","section","marketing","social-proof","saas"],"install":"npx rahman-resources add testimonials-grid","previewPath":"/preview/slices/testimonials-grid"},{"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.","slicePath":"frontend/slices/blog-section","convexPaths":[],"tags":["ui","blog","section","marketing","content","list","detail"],"install":"npx rahman-resources add blog-section","previewPath":"/preview/slices/blog-section"},{"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.","slicePath":"frontend/slices/changelog-feed","convexPaths":[],"tags":["ui","changelog","section","saas","release-notes","marketing"],"install":"npx rahman-resources add changelog-feed","previewPath":"/preview/slices/changelog-feed"},{"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.","slicePath":"frontend/slices/portfolio-section","convexPaths":[],"tags":["ui","portfolio","section","marketing","case-study","list","detail"],"install":"npx rahman-resources add portfolio-section","previewPath":"/preview/slices/portfolio-section"},{"slug":"notion-blocks","title":"Notion Blocks — editor primitive bundle","category":"ui","kind":"ui","version":"0.1.0","description":"One install ships four notion-style block primitives: KaTeX equation, highlight.js code block, per-page subscription bell, drag-fill grid cell selection. Each is config-driven with zero shared-state coupling — drops into any React surface (marketing landing, admin panel, editor, doc page). Bundled to keep the catalog tight; per-block narrow imports still available via individual peer slices.","slicePath":"frontend/slices/notion-blocks","convexPaths":[],"tags":["ui","notion","block","primitive","bundle","editor","katex","highlight","subscription","drag-fill","notion-like"],"install":"npx rahman-resources add notion-blocks","previewPath":"/preview/slices/notion-blocks"},{"slug":"theme-presets","title":"Theme Presets — tweakcn loader + 30+ color schemes","category":"ui","kind":"ui","version":"0.1.0","description":"Tweakcn theme preset loader — fetches from /r/registry.json + applies CSS variable overrides to next-themes. Ships <ThemePicker> popover, <TweakcnSwitcher> for quick toggle, <ThemeColorSync> for live preview, and a 30+ preset catalog. localStorage key `nosion:theme-preset` (preserved verbatim — host can rename for new deploys). Pure React + Tailwind v4 + next-themes. No backend.","slicePath":"frontend/slices/theme-presets","convexPaths":[],"tags":["ui","theme","tweakcn","color","preset","notion-like"],"install":"npx rahman-resources add theme-presets","previewPath":"/preview/slices/theme-presets"},{"slug":"files","title":"Files — pluggable upload + URL resolver with storage-adapter contract","category":"data","kind":"ui","version":"0.2.0","description":"Host-pluggable file upload + URL resolution. Ships <FileUploadButton>, <FileChip>, useFileUpload(), useFileUrl() — all reading from a FilesAdapter the host wires via <FilesAdapterProvider>. Bundled localStorage demo adapter stores blobs as data URLs (small files only). Drop in your own adapter for Convex / S3 / GCS / R2. The slice itself has zero backend coupling, proving the storage-adapter pattern for the rest of the open-silong blocked-pending-adapter wave (cover, workspace-io, templates, …).","slicePath":"frontend/slices/files","convexPaths":[],"tags":["data","upload","files","storage","adapter","portable","notion-like"],"install":"npx rahman-resources add files","previewPath":"/preview/slices/files"},{"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.","slicePath":"frontend/slices/equation","convexPaths":[],"tags":["ui","notion","notion-like","equation","katex","latex","math","block","primitive","editor"],"install":"npx rahman-resources add equation","previewPath":"/preview/slices/equation"},{"slug":"code-block","title":"Code Block — Notion-style syntax-highlighted code primitive","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.","slicePath":"frontend/slices/code-block","convexPaths":[],"tags":["ui","notion","notion-like","code","syntax","highlight","highlight.js","block","primitive","editor"],"install":"npx rahman-resources add code-block","previewPath":"/preview/slices/code-block"},{"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.","slicePath":"frontend/slices/notifications","convexPaths":[],"tags":["ui","notion","notion-like","notifications","subscribe","notify","bell","popover","localstorage","primitive"],"install":"npx rahman-resources add notifications","previewPath":"/preview/slices/notifications"},{"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.).","slicePath":"frontend/slices/database-cell-selection","convexPaths":[],"tags":["ui","notion","notion-like","database","grid","cell","selection","drag-fill","spreadsheet","primitive","table"],"install":"npx rahman-resources add database-cell-selection","previewPath":"/preview/slices/database-cell-selection"},{"slug":"notion-database","title":"Notion Database — embedded DB surface (6 views, optional)","category":"ui","kind":"ui","version":"0.1.0","description":"Portable Notion-style database surface. Optional companion to notion-shell — install shell alone for pages + sidebar + block editor, add notion-database when you want embedded databases. Ships NotionDatabase (full DB UI w/ ViewTabs + ViewOptions + per-column menu), NotionProperty (value + schema editor), 10 property-cell types (text / number / checkbox / select / multi_select / status / date / url / email / phone), 6 built-in views (Table / Board / List / Gallery / Calendar / Feed), and pure helpers (applyView, groupBy, bucketByDate). Domain types live in notion-shell (single source of truth — Page.rowOfDatabaseId + rowProps reference them) and re-exported here for convenience. Lifted from notion-page-clone (Nosion) — CI-wave split (2026-05-21).","slicePath":"frontend/slices/notion-database","convexPaths":[],"tags":["ui","notion","notion-like","database","table","board","list","gallery","calendar","feed","kanban","views","filter","sort","property","primitive","optional","embeddable"],"install":"npx rahman-resources add notion-database","previewPath":"/preview/slices/notion-database"},{"slug":"notion-shell","title":"Notion Shell — page + sidebar + block editor primitives (pure, no database)","category":"ui","kind":"ui","version":"0.4.0","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.","slicePath":"frontend/slices/notion-shell","convexPaths":[],"tags":["ui","notion","shell","wrapper","sidebar","page","database","primitive","portable","slash-menu","decorator","wysiwyg","views","kanban","calendar","gallery","drag","cover","embed","image","notion-like"],"install":"npx rahman-resources add notion-shell","previewPath":"/preview/slices/notion-shell"}],"layouts":[{"slug":"personal-brand-os","title":"Personal Brand OS","category":"website-template","description":"Full-app personal site — public landing (hero, blog, portfolio, services, resources, contact) + admin dashboard (posts, leads, chatbot, comments). Inspired by saudivisuals.com + cescadesigns. Fill-in-the-blank with lorem ipsum.","source":"saudivisuals.com + cescadesigns","repoPath":"app/preview/personal-brand-os","primaryFile":"app/preview/personal-brand-os/public/page.tsx","tags":["template","personal-brand","blog","portfolio","admin","saas"]},{"slug":"agency-studio-os","title":"Agency Studio OS","category":"website-template","description":"Full-app B2B agency / studio site — public (home, services, work + project detail, about, contact) + admin (dashboard, projects pipeline, clients, services, leads, settings). Inspired by saudivisuals.com + cescadesigns.","source":"saudivisuals.com + cescadesigns","repoPath":"app/preview/agency-studio-os","primaryFile":"app/preview/agency-studio-os/public/page.tsx","tags":["template","agency","studio","portfolio","b2b","admin","saas"]},{"slug":"landing-hero-carousel","title":"Landing — Hero Carousel","category":"marketing","description":"Full-width image carousel hero with auto-fade + dot indicators. Originally CMS-driven via Convex. Best for visual brands.","source":"cescadesigns","repoPath":"cookbook/layouts/landing-hero-carousel","primaryFile":"cookbook/layouts/landing-hero-carousel/src/HeroSection.tsx","tags":["marketing","carousel","image","cms"]},{"slug":"landing-asymmetric-masonry","title":"Landing — Asymmetric Masonry","category":"marketing","description":"8-slot repeating asymmetric grid. Intersection-observer staggered scroll-reveal. Lifted from rahmanef.com portfolio.","source":"rahmanef.com","repoPath":"cookbook/layouts/landing-asymmetric-masonry","primaryFile":"cookbook/layouts/landing-asymmetric-masonry/src/PortfolioGrid.tsx","tags":["marketing","portfolio","masonry","scroll-reveal"]},{"slug":"landing-bento","title":"Landing — Bento Grid","category":"marketing","description":"Feature-grid marketing landing. Compose Card + Magnetic + KineticHeading. Modern SaaS feel.","source":"synthesized","repoPath":"cookbook/layouts/landing-bento","primaryFile":"README.md","tags":["marketing","bento","features"]},{"slug":"landing-kinetic-text","title":"Landing — Kinetic Text","category":"marketing","description":"Brand-forward landing. Letter-stagger headings + magnetic CTAs + marquee strips. Motion-heavy.","source":"rahmanef.com","repoPath":"cookbook/layouts/landing-kinetic-text","primaryFile":"README.md","tags":["marketing","motion","type"]},{"slug":"dashboard-three-column","title":"Dashboard — Three Column","category":"dashboard","description":"Kitab flagship. Left tree / main / right inspector. Resizable, collapsible, mobile drawer fallback. Used by Database, Tasks, Contacts.","source":"kitab-core","repoPath":"cookbook/layouts/dashboard-three-column","primaryFile":"template-base/frontend/shared/ui/layout/container/three-column/ThreeColumnLayout.tsx","tags":["dashboard","three-column","resizable","responsive"]},{"slug":"dashboard-ide","title":"Dashboard — IDE","category":"dashboard","description":"Activity bar + tabs + editor + bottom panel. Editor-first apps (notion, code, doc tools).","source":"synthesized","repoPath":"cookbook/layouts/dashboard-ide","primaryFile":"README.md","tags":["dashboard","ide","editor"]},{"slug":"dashboard-mobile-dock","title":"Dashboard — Mobile Dock","category":"dashboard","description":"Mobile-first auth app. MobileTopBar + content + MobileDashboardDock bottom nav. Native-app feel on mobile, sidebar on desktop.","source":"kitab-core","repoPath":"cookbook/layouts/dashboard-mobile-dock","primaryFile":"template-base/frontend/shared/ui/layout/dashboard/MobileDashboardShell.tsx","tags":["dashboard","mobile","pwa"]},{"slug":"cms-public-storefront","title":"CMS — Public Storefront","category":"cms","description":"E-commerce / blog public storefront. Convex read-only. Cart context + currency selector + i18n.","source":"kitab-core cms-lite","repoPath":"cookbook/layouts/cms-public-storefront","primaryFile":"README.md","tags":["cms","ecommerce","storefront"]},{"slug":"notion-page-clone-os","title":"Notion Page Clone OS — localStorage demo (pointer to open-silong for production)","category":"website-template","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","repoPath":"app/preview/notion-page-clone-os","primaryFile":"app/preview/notion-page-clone-os/public/page.tsx","tags":["template","notion","notes","blocks","katex","code","editor","indonesia"]},{"slug":"saas-marketing-os","title":"SaaS Marketing OS","category":"website-template","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","repoPath":"app/preview/saas-marketing-os","primaryFile":"app/preview/saas-marketing-os/public/page.tsx","tags":["template","saas","marketing","mdx","blog","changelog","admin"]},{"slug":"kreator-studio-os","title":"Kreator Studio OS","category":"website-template","description":"Multi-channel content planner + voice trainer + repurposing engine + carousel maker. Public newsletter site + admin (planner, voice, scripts, carousels, assets, performance, comments). Bahasa Indonesia, ID-first.","source":"synthesized","repoPath":"app/preview/kreator-studio-os","primaryFile":"app/preview/kreator-studio-os/public/page.tsx","tags":["template","creator","newsletter","content-planner","voice-trainer","indonesia"]},{"slug":"konsultan-os","title":"Konsultan OS","category":"website-template","description":"Consultancy workspace — public services landing + case studies + admin (CRM, proposals AI, kontrak ID-aware, projects, PajakAware billing, documents). Indonesian-tax aware (PPN/PPh).","source":"synthesized","repoPath":"app/preview/konsultan-os","primaryFile":"app/preview/konsultan-os/public/page.tsx","tags":["template","consultant","crm","proposals","billing","indonesia"]},{"slug":"wirausaha-os","title":"Wirausaha OS","category":"website-template","description":"Indonesian UKM operations hub — public storefront + 8-tab admin (multi-business registry, inventory, orders, customers/CRM, finance with AI laporan, staff). Bahasa Indonesia, mobile-first public.","source":"synthesized","repoPath":"app/preview/wirausaha-os","primaryFile":"app/preview/wirausaha-os/public/page.tsx","tags":["template","smb","ukm","multi-business","midtrans","qris","indonesia"]},{"slug":"riset-kit","title":"Riset Kit","category":"website-template","description":"Research workspace — public knowledge-base reader + admin (document library, AI reader, literature review, citations, notes). Bahasa Indonesia academic-style, vector-search ready.","source":"synthesized","repoPath":"app/preview/riset-kit","primaryFile":"app/preview/riset-kit/public/page.tsx","tags":["template","research","knowledge-base","vector-search","ai-reader","indonesia"]},{"slug":"hero-centered","title":"Hero — Centered","category":"marketing","description":"Single-column centered hero with eyebrow pill, headline, sub-copy, and dual CTA. Radial gradient backdrop.","source":"kitab","repoPath":"app/preview/hero-centered","primaryFile":"app/preview/hero-centered/page.tsx","tags":["block","hero","centered","marketing"]},{"slug":"hero-split","title":"Hero — Split (Text + Visual)","category":"marketing","description":"Two-column hero: left copy + feature list + CTAs, right visual slot. 9-cell mock grid placeholder for product shot.","source":"kitab","repoPath":"app/preview/hero-split","primaryFile":"app/preview/hero-split/page.tsx","tags":["block","hero","split","marketing","product"]},{"slug":"hero-bento-bg","title":"Hero — Bento Background","category":"marketing","description":"Bento mini-grid behind a centered headline. Radial mask focuses the eye on the copy while the grid hints at features.","source":"kitab","repoPath":"app/preview/hero-bento-bg","primaryFile":"app/preview/hero-bento-bg/page.tsx","tags":["block","hero","bento","marketing","decorative"]},{"slug":"hero-video-loop","title":"Hero — Video Loop (dark)","category":"marketing","description":"Dark-mode hero with conic-gradient animated backdrop (stand-in for video). Play CTA, headline, dual CTA.","source":"kitab","repoPath":"app/preview/hero-video-loop","primaryFile":"app/preview/hero-video-loop/page.tsx","tags":["block","hero","video","marketing","dark"]},{"slug":"hero-animated-text","title":"Hero — Animated Text","category":"marketing","description":"Rotating word inside the headline cycles every 2s with gradient text + fade-slide transition. Lightweight, no extra deps.","source":"kitab","repoPath":"app/preview/hero-animated-text","primaryFile":"app/preview/hero-animated-text/page.tsx","tags":["block","hero","motion","marketing","kinetic"]},{"slug":"pricing-three","title":"Pricing — Three Tier","category":"marketing","description":"Classic 3-tier card layout. Middle tier highlighted with Most Popular badge + soft shadow.","source":"kitab","repoPath":"app/preview/pricing-three","primaryFile":"app/preview/pricing-three/page.tsx","tags":["block","pricing","marketing","saas"]},{"slug":"pricing-four","title":"Pricing — Four Tier","category":"marketing","description":"Four-tier with Best Value badge on tier 3. Compact card chrome, 4-column grid that collapses gracefully.","source":"kitab","repoPath":"app/preview/pricing-four","primaryFile":"app/preview/pricing-four/page.tsx","tags":["block","pricing","marketing","saas"]},{"slug":"pricing-toggle","title":"Pricing — Monthly/Yearly Toggle","category":"marketing","description":"3-tier with a monthly/yearly pill toggle. Yearly price strikethroughs the monthly, -20% savings badge inside the toggle.","source":"kitab","repoPath":"app/preview/pricing-toggle","primaryFile":"app/preview/pricing-toggle/page.tsx","tags":["block","pricing","marketing","interactive"]},{"slug":"pricing-compare","title":"Pricing — Feature Comparison","category":"marketing","description":"Single comparison table: feature rows × plan columns. Check/Minus icons, header row with prices, sticky CTA row.","source":"kitab","repoPath":"app/preview/pricing-compare","primaryFile":"app/preview/pricing-compare/page.tsx","tags":["block","pricing","marketing","comparison","table"]},{"slug":"pricing-slider","title":"Pricing — Usage Slider","category":"marketing","description":"Range slider drives the price. Tier name and per-seat cost update live. Single-card layout, focus on the math.","source":"kitab","repoPath":"app/preview/pricing-slider","primaryFile":"app/preview/pricing-slider/page.tsx","tags":["block","pricing","marketing","interactive","usage"]},{"slug":"accordion-faq","title":"Accordion — Classic FAQ","category":"marketing","description":"Single-open FAQ accordion. ChevronDown rotates, content reveals below. Clean, compact, perfect for support pages.","source":"kitab","repoPath":"app/preview/accordion-faq","primaryFile":"app/preview/accordion-faq/page.tsx","tags":["block","accordion","faq","marketing"]},{"slug":"accordion-grouped","title":"Accordion — Grouped Sections","category":"marketing","description":"FAQ split into themed groups (Getting Started / Slices / Billing). Each group is its own card. Independent open state per item.","source":"kitab","repoPath":"app/preview/accordion-grouped","primaryFile":"app/preview/accordion-grouped/page.tsx","tags":["block","accordion","faq","marketing","grouped"]},{"slug":"accordion-sidebar","title":"Accordion — Sidebar Navigation","category":"marketing","description":"Docs-style: left nav switches sections, right pane shows the section's accordion. Two-axis navigation in one layout.","source":"kitab","repoPath":"app/preview/accordion-sidebar","primaryFile":"app/preview/accordion-sidebar/page.tsx","tags":["block","accordion","docs","sidebar","navigation"]},{"slug":"accordion-animated","title":"Accordion — Smooth Animated","category":"marketing","description":"Grid-row transition for true height animation, no janky calc. Each item is a rounded card with rotating plus → primary close icon.","source":"kitab","repoPath":"app/preview/accordion-animated","primaryFile":"app/preview/accordion-animated/page.tsx","tags":["block","accordion","marketing","motion"]},{"slug":"accordion-multi","title":"Accordion — Multi-open","category":"marketing","description":"All items can be open at once. Expand-all / Collapse-all toggle in header. Best for compare-style reading.","source":"kitab","repoPath":"app/preview/accordion-multi","primaryFile":"app/preview/accordion-multi/page.tsx","tags":["block","accordion","marketing","multi-open"]},{"slug":"blog-grid","title":"Blog — Card Grid","category":"cms","description":"3-column responsive card grid. Cover thumbnail (HSL gradient), title, excerpt, author·date·read meta. Default blog index shape.","source":"kitab","repoPath":"app/preview/blog-grid","primaryFile":"app/preview/blog-grid/page.tsx","tags":["block","blog","cms","grid"]},{"slug":"blog-list","title":"Blog — Dense List","category":"cms","description":"Single-column scannable list. Thumbnail left, meta + title + excerpt right. High density, low scroll.","source":"kitab","repoPath":"app/preview/blog-list","primaryFile":"app/preview/blog-list/page.tsx","tags":["block","blog","cms","list"]},{"slug":"blog-magazine","title":"Blog — Magazine Layout","category":"cms","description":"Editorial spread: large hero post (2/3 width) + secondary featured + tail of headlines. Issue-number header gives quarterly feel.","source":"kitab","repoPath":"app/preview/blog-magazine","primaryFile":"app/preview/blog-magazine/page.tsx","tags":["block","blog","cms","editorial","magazine"]},{"slug":"blog-masonry","title":"Blog — Masonry","category":"cms","description":"CSS columns-based masonry with varying card heights for organic rhythm. break-inside-avoid keeps each card intact.","source":"kitab","repoPath":"app/preview/blog-masonry","primaryFile":"app/preview/blog-masonry/page.tsx","tags":["block","blog","cms","masonry"]},{"slug":"blog-featured","title":"Blog — Featured Hero + Tail","category":"cms","description":"Full-bleed cover hero on the first post, then a tight 2-column grid for the rest. Cinematic open, fast scroll for the tail.","source":"kitab","repoPath":"app/preview/blog-featured","primaryFile":"app/preview/blog-featured/page.tsx","tags":["block","blog","cms","featured","hero"]}],"recipes":[],"rules":["NO Clerk — use @convex-dev/auth","shadcn-only UI","copy-first flow","stack: Next 16 + React 19 + Tailwind 4 + Convex self-hosted + TS strict","workspace isolation per Convex query","RBAC + audit log on every mutation","commit convex/_generated before deploy","audit-bp score ≥80 before deploy"]}