Shared memory and context tools for agentic work.
Code Rooms
import { motion } from "framer-motion";
const STEP_INSTALL = `# First follow the signed native 1.6.3 installation guide linked below.
export M1ND_BINARY="$HOME/.local/share/m1nd/versions/1.6.3/m1nd-mcp"
"$M1ND_BINARY" --version`;
const STEP_CONFIG = `# Check the selected binary reports native 1.6.3. From the repo, in a POSIX shell:
export M1ND_RUNTIME_DIR="$(pwd -P)/.m1nd"
# A person runs this once for an empty runtime:
npx -y @maxkle1nz/m1nd@1.6.3 init --birth . --binary "$M1ND_BINARY"
# Replace claude with your host; complete the printed setup steps.
npx -y @maxkle1nz/m1nd@1.6.3 hosts plan --host claude --project . --binary "$M1ND_BINARY"
npx -y @maxkle1nz/m1nd@1.6.3 hosts apply --host claude --project . --binary "$M1ND_BINARY" --yes`;
const STEP_QUERY = `Ask your connected agent:
Use m1nd to orient on this repository.
Find where configuration is loaded.
Show real source locations and what still needs checking.
Do not edit files.`;
const PLAYBOOK = [
{
rule: "Orient before investigating",
tool: "north",
detail: "Check repository binding, task context, prior memory, and gaps before relying on retrieval.",
color: "#00f5ff",
},
rule: "Measure blast radius before every edit",
tool: "impact",
detail: "Returns direct and indirect callers sorted by coupling risk. Use it before touching any file.",
color: "#ff6b00",
rule: "Load context in one call, not many",
tool: "surgical_context_v2",
detail: "Pulls the target file plus its connected callers and callees in a single graph query.",
color: "#00ff88",
rule: "Ask by intent, not by filename",
tool: "seek",
detail: "Finds code by structural meaning. 'Where is shutdown guarded against cancel?' No filenames needed.",
color: "#ffb700",
];
function CodeBlock({ code, lang = "bash" }: { code: string; lang?: string }) {
const lines = code.split("\n");
return (
<div
className="rounded-lg border overflow-hidden font-mono text-[11px] leading-5"
style={{ borderColor: "#00f5ff14", background: "#05050f" }}
>
className="flex items-center gap-2 px-3 py-1.5 border-b"
style={{ borderColor: "#00f5ff10", background: "#080818" }}
<div className="flex gap-1">
<div className="w-2 h-2 rounded-full bg-red-500/40" />
<div className="w-2 h-2 rounded-full bg-yellow-500/40" />
<div className="w-2 h-2 rounded-full bg-green-500/40" />
</div>
<span className="text-[10px] text-muted-foreground/30 ml-1">{lang}</span>
<div className="p-4 space-y-0.5 overflow-x-auto">
{lines.map((line, i) => {
const isComment = line.trim().startsWith("#") || line.trim().startsWith("//");
const isKey = /^ "[\w-]+"/.test(line);
key={i}
style={{
color: isComment ? "#3a4a5c" : isKey ? "#00ff88" : "#e2e8f0",
minHeight: line === "" ? "0.75rem" : undefined,
}}
{line || "\u00a0"}
);
})}
}
export function InstallSection() {
const steps = [
num: "01",
label: "Install",
title: "Install and check the runtime",
desc: "Follow the signed installation guide below to pin native 1.6.3. The updater follows the registry channel even with a pinned wrapper, so this recipe selects the verified binary explicitly.",
code: STEP_INSTALL,
lang: "bash",
num: "02",
label: "Configure",
title: "Prepare and connect",
desc: "For native 1.6.3, a person prepares the graph. Add the same absolute M1ND_RUNTIME_DIR to the generated host environment; hosts apply does not add it. Check the birth receipt and finish printed setup before reconnecting.",
code: STEP_CONFIG,
num: "03",
label: "Ask",
title: "Check a real source location",
desc: "Start read-only. A useful result has the correct repository binding and source you can inspect. A reverify verdict asks for evidence; a wrong binding needs recovery.",
code: STEP_QUERY,
lang: "agent prompt",
<section id="install" className="py-24 border-b border-border/20 relative">
className="absolute inset-0 pointer-events-none"
style={{ background: "radial-gradient(ellipse at 50% 0%, rgba(0,255,136,0.04), transparent 60%)" }}
/>
<div className="container mx-auto px-4 lg:px-6 relative z-10">
<motion.div
className="text-center mb-16"
initial={{ opacity: 0, y: 16 }}
whileInView={{ opacity: 1, y: 0 }}
viewport={{ once: true }}
transition={{ duration: 0.7 }}
<div className="inline-block font-mono text-xs text-green-400/60 tracking-widest uppercase border border-green-400/20 rounded px-3 py-1 mb-5">
installation
<h2 className="text-3xl md:text-5xl font-bold font-sans tracking-tight mb-4">
Start with one useful answer.
</h2>
<p className="text-muted-foreground font-mono max-w-xl mx-auto text-sm">
Published setup first. Source-preview features are versioned.{" "}
<span className="text-green-400/80">Read the current quick start before upgrading.</span>
</p>
</motion.div>
transition={{ duration: 0.5 }}
className="mb-10 rounded-xl border border-primary/15 px-5 py-4 font-mono text-xs text-muted-foreground/70"
style={{ background: "rgba(0,245,255,0.03)" }}
Host recipes include <span style={{ color: "#00f5ff" }}>Claude Code</span>,{" "}
<span style={{ color: "#00f5ff" }}>Codex</span>, <span style={{ color: "#00f5ff" }}>Cursor</span>,{" "}
<span style={{ color: "#00f5ff" }}>Windsurf</span>, <span style={{ color: "#00f5ff" }}>GitHub Copilot</span>,{" "}
<span style={{ color: "#00f5ff" }}>Zed</span>, <span style={{ color: "#00f5ff" }}>Continue</span>,{" "}
<span style={{ color: "#00ff88" }}>Antigravity</span> and more. <code style={{ color: "#00f5ff" }}>m1nd hosts plan</code> shows each host’s configuration and hook support.{" "}
<a
href="https://github.com/maxkle1nz/m1nd/blob/main/docs/HOST-INTEGRATION-MATRIX.md"
target="_blank"
rel="noreferrer"
className="underline underline-offset-2"
style={{ color: "#00f5ff" }}
see the full host-integration matrix ↗
</a>. <a href="https://github.com/maxkle1nz/m1nd/blob/main/docs/INSTALL-1.6.3.md" target="_blank" rel="noreferrer" className="underline underline-offset-2">Install the signed native 1.6.3 artifact ↗</a>.
<div className="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-20">
{steps.map((step, i) => (
key={step.num}
initial={{ opacity: 0, y: 20 }}
transition={{ duration: 0.5, delay: i * 0.1 }}
className="flex flex-col gap-4"
<div className="flex items-center gap-3">
<span
className="text-[10px] font-mono font-bold px-2 py-1 rounded"
background: "#00ff8810",
border: "1px solid #00ff8825",
{step.num}
</span>
<span className="font-mono text-xs text-muted-foreground/50 tracking-widest uppercase">
{step.label}
<div>
<h3 className="font-sans font-semibold text-base mb-1">{step.title}</h3>
<p className="text-sm text-muted-foreground leading-relaxed">{step.desc}</p>
<div className="flex-1">
<CodeBlock code={step.code} lang={step.lang} />
))}
<div className="border border-border/20 rounded-2xl overflow-hidden">
className="px-6 py-4 border-b border-border/20"
style={{ background: "rgba(0,245,255,0.02)" }}
className="w-1.5 h-1.5 rounded-full"
style={{ background: "#00f5ff", boxShadow: "0 0 6px #00f5ff" }}
<span className="font-mono text-xs tracking-widest uppercase text-primary/60">
agent playbook · how m1nd expects to be used
<div className="grid grid-cols-1 md:grid-cols-2 gap-0">
{PLAYBOOK.map((item, i) => (
initial={{ opacity: 0 }}
whileInView={{ opacity: 1 }}
transition={{ duration: 0.4, delay: i * 0.07 }}
className="p-6 border-b border-r border-border/15 last:border-b-0"
borderColor: "rgba(255,255,255,0.06)",
<div className="flex items-start gap-4">
className="mt-1 w-1 h-12 rounded-full flex-shrink-0"
style={{ background: `linear-gradient(to bottom, ${item.color}60, transparent)` }}
<div className="flex items-center gap-2 mb-1.5 flex-wrap">
<span className="text-sm font-semibold">{item.rule}</span>
<code
className="text-[11px] font-mono px-2 py-0.5 rounded mb-2 inline-block"
background: `${item.color}10`,
color: item.color,
border: `1px solid ${item.color}25`,
{item.tool}
</code>
<p className="text-sm text-muted-foreground leading-relaxed">{item.detail}</p>
className="px-6 py-5 border-t border-border/20 flex flex-col sm:flex-row items-start sm:items-center gap-4"
style={{ background: "rgba(255,183,0,0.02)" }}
<div className="flex items-center gap-2 mb-1">
className="text-[10px] font-mono px-2 py-0.5 rounded"
style={{ background: "#ffb70010", color: "#ffb700", border: "1px solid #ffb70025" }}
help
<span className="text-xs font-mono text-muted-foreground/50">in-context guidance</span>
<p className="text-sm text-muted-foreground">
m1nd ships a full in-context help system. If your agent is ever uncertain which tool to call,{" "}
<code className="text-amber-400/80 font-mono text-xs">help</code> returns the right next step with examples, including use-case-specific guidance for whatever the agent is trying to do.
<div className="flex-shrink-0">
className="font-mono text-[10px] px-3 py-2 rounded border leading-5"
background: "#ffb70008",
borderColor: "#ffb70020",
color: "#3a4a5c",
<span style={{ color: "#7a8faa" }}>{"{"}</span>
<br />
<span style={{ color: "#ffb700" }}>{" \"tool\""}</span>
<span style={{ color: "#7a8faa" }}>: </span>
<span style={{ color: "#00ff88" }}>{'"help"'}</span>
<span style={{ color: "#7a8faa" }}>,</span>
<span style={{ color: "#ffb700" }}>{" \"arguments\""}</span>
<span style={{ color: "#7a8faa" }}>: {"{"}</span>
<span style={{ color: "#7a8faa" }}>{" \"agent_id\""}: </span>
<span style={{ color: "#00f5ff" }}>{'"atlas"'}</span>
<span style={{ color: "#7a8faa" }}>{" }"}</span>
<span style={{ color: "#7a8faa" }}>{"}"}</span>
</section>
