{ "$schema": "https://ui.shadcn.com/schema/registry-item.json", "name": "template-orbit", "title": "Orbit: AI agent platform", "author": "Ballmac ", "description": "A dark, four-page site for an AI agent platform: a hero that plays a live agent run, tools, an eval chart, traces, security, pricing with a usage calculator, a changelog and sign-in.", "dependencies": [ "lucide-react", "motion@^12", "recharts@^3" ], "registryDependencies": [ "utils", "https://ui.ballmac.com/r/accordion.json", "https://ui.ballmac.com/r/aurora-background.json", "https://ui.ballmac.com/r/blur-fade.json", "https://ui.ballmac.com/r/changelog-feed.json", "https://ui.ballmac.com/r/chart.json", "https://ui.ballmac.com/r/copy-button.json", "https://ui.ballmac.com/r/marquee.json", "https://ui.ballmac.com/r/number-ticker.json", "https://ui.ballmac.com/r/segmented-control.json", "https://ui.ballmac.com/r/slider.json" ], "files": [ { "path": "registry/ballmac/components/templates/orbit/orbit-fonts.ts", "content": "// Ballmac UI: Orbit template fonts. https://ui.ballmac.com/templates/template-orbit\nimport { Instrument_Sans, JetBrains_Mono } from \"next/font/google\"\n\nexport const orbitSans = Instrument_Sans({ variable: \"--orbit-sans\", subsets: [\"latin\"], display: \"swap\", preload: false })\nexport const orbitMono = JetBrains_Mono({ variable: \"--orbit-mono\", subsets: [\"latin\"], display: \"swap\", preload: false })\n", "type": "registry:component", "target": "@components/ballmac/templates/orbit/orbit-fonts.ts" }, { "path": "registry/ballmac/components/templates/orbit/orbit-theme.tsx", "content": "// Ballmac UI: Orbit template shell. https://ui.ballmac.com/templates/template-orbit\n\"use client\"\n\nimport * as React from \"react\"\nimport { ArrowUpRight, Menu, X } from \"lucide-react\"\n\nimport { cn } from \"@/lib/utils\"\n\nimport { orbitMono, orbitSans } from \"@/components/ballmac/templates/orbit/orbit-fonts\"\n\ntype OrbitPage = \"home\" | \"pricing\" | \"changelog\" | \"login\"\n\n/** Where each page lives. Defaults match the routes the template installs. */\ntype OrbitHrefs = Record\n\nconst defaultHrefs: OrbitHrefs = { home: \"/orbit\", pricing: \"/orbit/pricing\", changelog: \"/orbit/changelog\", login: \"/orbit/login\" }\n\n/** Orbit's palette: deep ink with a violet light. Every value is a standard Ballmac token, so blocks inside follow it. */\nconst orbitVars = {\n \"--background\": \"oklch(0.135 0.026 275)\",\n \"--foreground\": \"oklch(0.965 0.01 275)\",\n \"--card\": \"oklch(0.172 0.03 275)\",\n \"--card-foreground\": \"oklch(0.965 0.01 275)\",\n \"--popover\": \"oklch(0.19 0.032 275)\",\n \"--popover-foreground\": \"oklch(0.965 0.01 275)\",\n \"--primary\": \"oklch(0.965 0.01 275)\",\n \"--primary-foreground\": \"oklch(0.18 0.03 275)\",\n \"--secondary\": \"oklch(0.24 0.035 275)\",\n \"--secondary-foreground\": \"oklch(0.965 0.01 275)\",\n \"--muted\": \"oklch(0.22 0.034 275)\",\n \"--muted-foreground\": \"oklch(0.73 0.03 275)\",\n \"--accent\": \"oklch(0.26 0.04 275)\",\n \"--accent-foreground\": \"oklch(0.965 0.01 275)\",\n \"--border\": \"oklch(1 0 0 / 9%)\",\n \"--input\": \"oklch(1 0 0 / 13%)\",\n \"--ring\": \"oklch(0.7 0.19 285)\",\n \"--surface\": \"oklch(0.155 0.028 275)\",\n \"--destructive\": \"oklch(0.7 0.19 22)\",\n \"--chart-1\": \"oklch(0.72 0.19 285)\",\n \"--chart-2\": \"oklch(0.82 0.14 185)\",\n \"--chart-3\": \"oklch(0.84 0.14 85)\",\n \"--chart-4\": \"oklch(0.74 0.19 350)\",\n \"--chart-5\": \"oklch(0.72 0.14 245)\",\n \"--radius\": \"0.9rem\",\n} as React.CSSProperties\n\nfunction OrbitMark({ className }: { className?: string }) {\n return (\n \n \n \n \n \n )\n}\n\nconst nav: { key: OrbitPage; label: string }[] = [\n { key: \"pricing\", label: \"Pricing\" },\n { key: \"changelog\", label: \"Changelog\" },\n]\n\ntype OrbitShellProps = React.ComponentProps<\"div\"> & {\n /** The page being shown, so its nav link is marked current. */\n page: OrbitPage\n /** Override where pages live (used by previews). */\n hrefs?: Partial\n /** Hide the header and footer (the sign-in page draws its own frame). */\n bare?: boolean\n}\n\n/** Orbit's frame: the dark theme, fonts, floating header and footer. Wrap every Orbit page in it. */\nfunction OrbitShell({ page, hrefs: hrefOverrides, bare, className, children, style, ...props }: OrbitShellProps) {\n const hrefs = { ...defaultHrefs, ...hrefOverrides }\n const [open, setOpen] = React.useState(false)\n return (\n \n {!bare && (\n
\n
\n \n \n Orbit\n \n \n
\n \n \n Start free\n \n setOpen((v) => !v)}\n className=\"text-muted-foreground hover:text-foreground focus-visible:ring-ring/50 inline-flex size-9 items-center justify-center rounded-lg outline-none focus-visible:ring-[3px] md:hidden\"\n >\n {open ? : }\n \n
\n
\n {open && (\n \n )}\n
\n )}\n {children}\n {!bare && (\n
\n
\n
\n \n Orbit\n \n

The platform for building, testing and running AI agents in production.

\n

\n All systems operational\n

\n
\n {[\n { title: \"Product\", links: [\"Agents\", \"Tools\", \"Evals\", \"Traces\", \"Security\"] },\n { title: \"Developers\", links: [\"Documentation\", \"API reference\", \"SDKs\", \"Status\", \"Changelog\"] },\n { title: \"Company\", links: [\"About\", \"Customers\", \"Careers\", \"Contact\", \"Brand\"] },\n ].map((c) => (\n
\n

{c.title}

\n
    \n {c.links.map((l) => (\n
  • \n \n {l}\n \n
    • \n ))}\n
\n
\n ))}\n
\n

© 2026 Orbit Labs, Inc. SOC 2 Type II · GDPR · HIPAA-ready

\n
\n )}\n \n )\n}\n\nexport { OrbitMark, OrbitShell, defaultHrefs as orbitDefaultHrefs, type OrbitHrefs, type OrbitPage, type OrbitShellProps }\n", "type": "registry:component", "target": "@components/ballmac/templates/orbit/orbit-theme.tsx" }, { "path": "registry/ballmac/components/templates/orbit/orbit-agent-run.tsx", "content": "// Ballmac UI: Orbit agent run. https://ui.ballmac.com/templates/template-orbit\n\"use client\"\n\nimport * as React from \"react\"\nimport { Check, CircleDashed, Loader2, RotateCcw, ShieldCheck } from \"lucide-react\"\nimport { useReducedMotion } from \"motion/react\"\n\nimport { cn } from \"@/lib/utils\"\n\ntype Step = { id: string; kind: \"plan\" | \"tool\" | \"approval\" | \"reply\"; label: string; detail: string; ms: number; tokens: number }\n\nconst task = \"Reconcile last week’s refunds and send finance a summary.\"\n\nconst steps: Step[] = [\n { id: \"plan\", kind: \"plan\", label: \"Plan\", detail: \"3 steps · pull refunds, match to orders, draft summary\", ms: 640, tokens: 412 },\n { id: \"refunds\", kind: \"tool\", label: \"stripe.refunds.list\", detail: \"214 refunds · $18,420.50\", ms: 820, tokens: 96 },\n { id: \"orders\", kind: \"tool\", label: \"warehouse.query\", detail: \"208 matched · 6 need review\", ms: 1180, tokens: 268 },\n { id: \"approval\", kind: \"approval\", label: \"Needs approval\", detail: \"Send email to finance@acme.co\", ms: 1500, tokens: 0 },\n { id: \"reply\", kind: \"reply\", label: \"Summary sent\", detail: \"Draft delivered · 6 flagged refunds attached\", ms: 520, tokens: 534 },\n]\n\nconst STEP_DELAY = 1150\n\nfunction formatMs(ms: number) {\n return ms >= 1000 ? `${(ms / 1000).toFixed(1)} s` : `${ms} ms`\n}\n\n/** A scripted agent run that plays when it scrolls into view: plan, tool calls, an approval and a reply, with a live trace and cost. */\nfunction OrbitAgentRun({ className }: { className?: string }) {\n const reduce = useReducedMotion()\n const ref = React.useRef(null)\n const [done, setDone] = React.useState(0)\n const [run, setRun] = React.useState(0)\n const [started, setStarted] = React.useState(false)\n\n // Start once the card is on screen.\n React.useEffect(() => {\n const el = ref.current\n if (!el) return\n const io = new IntersectionObserver(\n ([e]) => {\n if (e.isIntersecting) {\n setStarted(true)\n io.disconnect()\n }\n },\n { threshold: 0.35 }\n )\n io.observe(el)\n return () => io.disconnect()\n }, [])\n\n // Step through the script. Reduced motion jumps straight to the end.\n React.useEffect(() => {\n if (!started) return\n if (reduce) {\n const t = setTimeout(() => setDone(steps.length), 0)\n return () => clearTimeout(t)\n }\n if (done >= steps.length) return\n const t = setTimeout(() => setDone((d) => d + 1), done === 0 ? 700 : STEP_DELAY)\n return () => clearTimeout(t)\n }, [started, done, reduce, run])\n\n const finished = done >= steps.length\n const elapsed = steps.slice(0, done).reduce((n, s) => n + s.ms, 0)\n const tokens = steps.slice(0, done).reduce((n, s) => n + s.tokens, 0)\n const cost = tokens * 0.0000042\n\n function replay() {\n setDone(0)\n setRun((r) => r + 1)\n }\n\n return (\n
\n
\n
\n \n \n \n \n \n \n run_8f3k2 · refund-reconciler\n \n
\n \n {finished ? : }\n {finished ? \"Completed\" : started ? \"Running\" : \"Queued\"}\n \n
\n\n
\n
\n
{task}
\n
    \n {steps.map((s, i) => {\n const state = i < done ? \"done\" : i === done && started && !finished ? \"active\" : \"waiting\"\n return (\n \n \n {state === \"done\" ? (\n s.kind === \"approval\" ? : \n ) : state === \"active\" ? (\n \n ) : (\n \n )}\n {state === \"done\" ? \"Done\" : state === \"active\" ? \"In progress\" : \"Waiting\"}\n \n
    \n

    \n {s.label}\n

    \n

    {state === \"waiting\" ? \"Waiting\" : s.detail}

    \n
    \n {state === \"done\" && s.ms > 0 && (\n \n {formatMs(s.ms)}\n \n )}\n \n )\n })}\n
\n
\n\n
\n

Trace

\n
\n {steps.map((s, i) => {\n const before = steps.slice(0, i).reduce((n, x) => n + x.ms, 0)\n const total = steps.reduce((n, x) => n + x.ms, 0)\n const visible = i < done\n return (\n
\n \n {s.kind === \"tool\" ? s.label.split(\".\")[0] : s.kind}\n \n
\n \n
\n
\n )\n })}\n
\n\n
\n {[\n { label: \"Elapsed\", value: formatMs(elapsed) },\n { label: \"Tokens\", value: tokens.toLocaleString(\"en-US\") },\n { label: \"Cost\", value: `$${cost.toFixed(3)}` },\n ].map((m) => (\n
\n
{m.label}
\n
\n {m.value}\n
\n
\n ))}\n
\n\n
\n

\n {finished ? \"Every step is stored. Replay it, diff it, turn it into an eval.\" : \"Watching the run live.\"}\n

\n \n Replay\n \n
\n
\n
\n
\n )\n}\n\nexport { OrbitAgentRun }\n", "type": "registry:component", "target": "@components/ballmac/templates/orbit/orbit-agent-run.tsx" }, { "path": "registry/ballmac/components/templates/orbit/orbit-home.tsx", "content": "// Ballmac UI: Orbit home page. https://ui.ballmac.com/templates/template-orbit\n\"use client\"\n\nimport * as React from \"react\"\nimport { ArrowRight, Check, FileCheck2, Fingerprint, GitBranch, KeyRound, Lock, Network, ScrollText, Server } from \"lucide-react\"\nimport { CartesianGrid, Line, LineChart, XAxis, YAxis } from \"recharts\"\n\nimport { AuroraBackground } from \"@/components/ballmac/aurora-background\"\nimport { BlurFade } from \"@/components/ballmac/blur-fade\"\nimport { ChartContainer, ChartLegend, ChartLegendContent, ChartTooltip, ChartTooltipContent, type ChartConfig } from \"@/components/ballmac/chart\"\nimport { CopyButton } from \"@/components/ballmac/copy-button\"\nimport { Marquee } from \"@/components/ballmac/marquee\"\nimport { NumberTicker } from \"@/components/ballmac/number-ticker\"\nimport { OrbitAgentRun } from \"@/components/ballmac/templates/orbit/orbit-agent-run\"\nimport { OrbitShell, type OrbitHrefs } from \"@/components/ballmac/templates/orbit/orbit-theme\"\nimport { cn } from \"@/lib/utils\"\n\nconst mono = { fontFamily: \"var(--orbit-mono)\" } as const\nconst display = \"font-semibold tracking-[-0.045em] text-balance\"\n\nconst customers = [\"Brightwell\", \"Lattice\", \"Fieldly\", \"Halcyon\", \"Parallel\", \"Ridgeline\", \"Tessera\", \"Quanta\", \"Meridian\"]\n\nconst tools = [\n { name: \"stripe\", calls: \"1.2M\", scope: \"Refunds, invoices\" },\n { name: \"slack\", calls: \"860k\", scope: \"Post, read threads\" },\n { name: \"github\", calls: \"540k\", scope: \"PRs, issues, checks\" },\n { name: \"postgres\", calls: \"2.1M\", scope: \"Read-only queries\" },\n { name: \"gmail\", calls: \"310k\", scope: \"Drafts, send with approval\" },\n { name: \"browser\", calls: \"190k\", scope: \"Click, type, extract\" },\n]\n\nconst evalData = [\n { build: \"#1\", baseline: 61, orbit: 62 },\n { build: \"#2\", baseline: 63, orbit: 68 },\n { build: \"#3\", baseline: 62, orbit: 74 },\n { build: \"#4\", baseline: 64, orbit: 79 },\n { build: \"#5\", baseline: 63, orbit: 83 },\n { build: \"#6\", baseline: 65, orbit: 86 },\n { build: \"#7\", baseline: 64, orbit: 91 },\n { build: \"#8\", baseline: 66, orbit: 94 },\n]\nconst evalConfig = { orbit: { label: \"With Orbit evals\", color: \"var(--chart-1)\" }, baseline: { label: \"Shipping on vibes\", color: \"var(--chart-4)\" } } satisfies ChartConfig\n\nconst security = [\n { icon: Fingerprint, title: \"SSO and SCIM\", text: \"Okta, Entra ID and Google. Roles map to agents, tools and environments.\" },\n { icon: KeyRound, title: \"Scoped credentials\", text: \"Agents never see secrets. Tools get short-lived, least-privilege tokens.\" },\n { icon: Lock, title: \"Approvals\", text: \"Require a human for anything that spends, sends or deletes.\" },\n { icon: ScrollText, title: \"Audit log\", text: \"Every prompt, tool call and decision, streamed to your SIEM.\" },\n { icon: Server, title: \"Your cloud\", text: \"Run the data plane in your own VPC. Nothing leaves it.\" },\n { icon: FileCheck2, title: \"Certified\", text: \"SOC 2 Type II, ISO 27001, GDPR, and HIPAA-ready.\" },\n]\n\ntype OrbitHomeProps = React.ComponentProps<\"div\"> & { hrefs?: Partial }\n\nfunction SectionIntro({ eyebrow, title, children }: { eyebrow: string; title: string; children: React.ReactNode }) {\n return (\n
\n

{eyebrow}

\n

{title}

\n

{children}

\n
\n )\n}\n\n/** The Orbit home page: a live agent run, tools, evals, traces, security and a closing call to action. */\nfunction OrbitHome({ hrefs, ...props }: OrbitHomeProps) {\n return (\n \n
\n {/* Hero */}\n
\n \n
\n \n New\n Computer use is generally available\n \n \n

\n Agents that finish the job.\n

\n

\n Build, test and run AI agents with the tools, evals and guardrails a production team needs. Ship the first one this afternoon.\n

\n
\n \n Start building \n \n
\n $ npm i @orbit/sdk\n \n
\n
\n
\n \n \n \n
\n\n {/* Customers */}\n
\n

Powering agents at 1,800 teams, from startups to the Fortune 100

\n \n {customers.map((c) => (\n {c}\n ))}\n \n
\n\n {/* Tools */}\n
\n \n Connect any API, database or browser as a typed tool. Orbit handles auth, retries, rate limits and sandboxing, so the agent only decides what to do.\n \n
    \n {tools.map((t) => (\n
  • \n
    \n {t.name}\n \n
    \n

    {t.scope}

    \n

    {t.calls} calls / mo

    \n
    • \n ))}\n
\n
\n\n {/* Evals */}\n
\n
\n
\n Task success rate\n Last 8 builds, 400 cases\n
\n \n \n \n \n `${v}%`} />\n `${v}%`} />} />\n \n \n } />\n \n \n
\n
\n \n Turn any trace into a test case. Run the suite on every commit, compare models side by side, and block the merge when success drops.\n \n
    \n {[\"Replay production runs against a new prompt\", \"LLM and code graders, with human review\", \"GitHub check that fails the build on regressions\"].map((x) => (\n
  • {x}
    • \n ))}\n
\n
\n
\n\n {/* Traces */}\n
\n \n Each run is a tree you can read: prompts, tool inputs, outputs, cost and latency. Branch from any step and rerun it.\n \n
\n
run_8f3k2 · 5 spans · 4.7 s
\n
    \n {[\n { depth: 0, name: \"refund-reconciler\", ms: \"4.7 s\", w: 100, tone: \"bg-chart-2\" },\n { depth: 1, name: \"plan\", ms: \"640 ms\", w: 14, tone: \"bg-chart-2\" },\n { depth: 1, name: \"stripe.refunds.list\", ms: \"820 ms\", w: 18, tone: \"bg-chart-1\" },\n { depth: 1, name: \"warehouse.query\", ms: \"1.2 s\", w: 25, tone: \"bg-chart-1\" },\n { depth: 1, name: \"gmail.send_draft\", ms: \"1.5 s\", w: 32, tone: \"bg-chart-3\" },\n ].map((r, i) => (\n
  • \n {r.name}\n
    • \n ))}\n
\n
\n
\n\n {/* Stats */}\n
\n
\n {[\n { v: 4.2, suffix: \"B\", label: \"Tool calls a month\", decimals: 1 },\n { v: 99.99, suffix: \"%\", label: \"Uptime, last 12 months\", decimals: 2 },\n { v: 1.4, suffix: \" s\", label: \"p95 time to first action\", decimals: 1 },\n { v: 38, suffix: \"\", label: \"Regions, including yours\", decimals: 0 },\n ].map((s) => (\n
\n
\n {s.suffix}\n
\n
{s.label}
\n
\n ))}\n
\n
\n\n {/* Security */}\n
\n \n The controls your CISO asks for are on by default, not an enterprise upsell.\n \n
    \n {security.map((s) => (\n
  • \n \n

    {s.title}

    \n

    {s.text}

    \n
    • \n ))}\n
\n
\n\n {/* Quote */}\n
\n
\n

\n “We moved 40 percent of tier-one support to agents in a quarter, and the eval suite is the reason nobody was scared to ship it.”\n

\n
\n PN\n Priya NairVP Engineering, Fieldly\n
\n
\n
\n\n {/* CTA */}\n
\n
\n \n

Your first agent is ten minutes away.

\n

Free for your first 10,000 runs. No credit card, no sales call.

\n \n
\n
\n
\n \n )\n}\n\nexport { OrbitHome, type OrbitHomeProps }\n", "type": "registry:component", "target": "@components/ballmac/templates/orbit/orbit-home.tsx" }, { "path": "registry/ballmac/components/templates/orbit/orbit-pricing.tsx", "content": "// Ballmac UI: Orbit pricing page. https://ui.ballmac.com/templates/template-orbit\n\"use client\"\n\nimport * as React from \"react\"\nimport { Check } from \"lucide-react\"\n\nimport { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from \"@/components/ballmac/accordion\"\nimport { SegmentedControl, SegmentedControlItem } from \"@/components/ballmac/segmented-control\"\nimport { Slider } from \"@/components/ballmac/slider\"\nimport { OrbitShell, type OrbitHrefs } from \"@/components/ballmac/templates/orbit/orbit-theme\"\nimport { cn } from \"@/lib/utils\"\n\nconst mono = { fontFamily: \"var(--orbit-mono)\" } as const\nconst money = new Intl.NumberFormat(\"en-US\", { style: \"currency\", currency: \"USD\", maximumFractionDigits: 0 })\nconst moneyCents = new Intl.NumberFormat(\"en-US\", { style: \"currency\", currency: \"USD\", minimumFractionDigits: 2 })\nconst count = new Intl.NumberFormat(\"en-US\")\n\ntype Billing = \"monthly\" | \"yearly\"\n\nconst plans = [\n { id: \"hobby\", name: \"Hobby\", price: 0, blurb: \"For side projects and learning.\", cta: \"Start free\", runs: \"10,000 runs included\", features: [\"3 agents\", \"Community tools\", \"7-day trace history\", \"Email support\"] },\n { id: \"team\", name: \"Team\", price: 49, blurb: \"For teams shipping agents to customers.\", cta: \"Start 14-day trial\", runs: \"250,000 runs included\", features: [\"Unlimited agents\", \"Evals and GitHub checks\", \"90-day trace history\", \"Approvals and audit log\", \"Priority support\"], featured: true },\n { id: \"scale\", name: \"Scale\", price: null, blurb: \"For regulated and high-volume workloads.\", cta: \"Talk to sales\", runs: \"Volume pricing\", features: [\"Your VPC or on-prem data plane\", \"SSO, SCIM and custom roles\", \"1-year trace retention\", \"99.99% uptime SLA\", \"Dedicated engineer\"] },\n] as const\n\nconst faqs = [\n { q: \"What counts as a run?\", a: \"One end-to-end execution of an agent, from the first prompt to the final reply, however many tool calls or model turns it takes. Retries of the same run are free.\" },\n { q: \"Do I pay for model tokens?\", a: \"Bring your own keys and pay your model provider directly, or use Orbit’s pooled capacity at cost plus 8 percent. Either way the bill shows tokens per run.\" },\n { q: \"What happens when I pass my included runs?\", a: \"Nothing breaks. Extra runs are billed at the rate in the calculator, and you can set a hard monthly cap so a loop can never surprise you.\" },\n { q: \"Can I self-host?\", a: \"The Scale plan runs the data plane in your own cloud or on-prem. The control plane stays hosted, and no prompts, tool data or secrets ever leave your network.\" },\n { q: \"Is there a discount for startups or nonprofits?\", a: \"Yes. Startups under two years old get 50 percent off Team for a year, and verified nonprofits get 40 percent off for good.\" },\n]\n\nfunction Calculator({ billing }: { billing: Billing }) {\n const [runs, setRuns] = React.useState(400_000)\n const seats = 5\n const included = 250_000\n const extra = Math.max(0, runs - included)\n const seatPrice = billing === \"yearly\" ? 39 : 49\n const base = seats * seatPrice\n // Overage gets cheaper in steps: $2.00 per thousand to 1M, then $1.40.\n const tier1 = Math.min(extra, 750_000)\n const tier2 = Math.max(0, extra - 750_000)\n const overage = (tier1 / 1000) * 2 + (tier2 / 1000) * 1.4\n const total = base + overage\n return (\n
\n
\n
\n

Estimate your bill

\n

Team plan for {seats} seats. Drag to see how overage scales.

\n
\n
\n \n {count.format(runs)}\n
\n setRuns(v[0] ?? runs)} formatValue={(v) => `${count.format(v)} runs`} />\n
50k2M
\n
\n
\n
\n
\n
{seats} seats × {money.format(seatPrice)}
{money.format(base)}
\n
{count.format(included)} runs included
$0
\n
{count.format(extra)} extra runs
{moneyCents.format(overage)}
\n
Estimated per month
{money.format(total)}
\n
\n

Model tokens are billed by your provider. Set a hard cap in settings.

\n
\n
\n
\n )\n}\n\ntype OrbitPricingProps = React.ComponentProps<\"div\"> & { hrefs?: Partial }\n\n/** Orbit pricing: three plans with a monthly and yearly switch, a usage calculator and common questions. */\nfunction OrbitPricing({ hrefs, ...props }: OrbitPricingProps) {\n const [billing, setBilling] = React.useState(\"yearly\")\n return (\n \n
\n
\n

Pricing

\n

Pay for runs, not for hope.

\n

Start free, then grow into seats and volume. Every plan includes traces, tools and the full SDK.

\n setBilling(v as Billing)} className=\"mt-9\">\n Monthly\n Yearly · save 20%\n \n
\n\n
\n {plans.map((p) => {\n const price = p.price === null ? null : p.price === 0 ? 0 : billing === \"yearly\" ? Math.round(p.price * 0.8) : p.price\n return (\n
\n {\"featured\" in p && p.featured && Most popular}\n

{p.name}

\n

{p.blurb}

\n

\n {price === null ? Custom : (\n <>\n {money.format(price)}\n {price === 0 ? \"forever\" : \"per seat / month\"}\n \n )}\n

\n

{p.runs}

\n {p.cta}\n
    \n {p.features.map((f) => (\n
  • {f}
    • \n ))}\n
\n
\n )\n })}\n
\n\n \n\n
\n

Questions, answered

\n \n {faqs.map((f) => (\n \n {f.q}\n {f.a}\n \n ))}\n \n
\n
\n \n )\n}\n\nexport { OrbitPricing, type OrbitPricingProps }\n", "type": "registry:component", "target": "@components/ballmac/templates/orbit/orbit-pricing.tsx" }, { "path": "registry/ballmac/components/templates/orbit/orbit-changelog.tsx", "content": "// Ballmac UI: Orbit changelog page. https://ui.ballmac.com/templates/template-orbit\nimport * as React from \"react\"\nimport { Rss } from \"lucide-react\"\n\nimport { ChangelogFeed, type ChangelogEntry } from \"@/components/ballmac/changelog-feed\"\nimport { OrbitShell, type OrbitHrefs } from \"@/components/ballmac/templates/orbit/orbit-theme\"\n\nconst entries: ChangelogEntry[] = [\n {\n id: \"2-4\",\n version: \"2.4\",\n date: \"2026-09-24\",\n title: \"Computer use is generally available\",\n summary: \"Agents can now see a screen, click, type and extract data from any web app, inside a sandboxed browser you control.\",\n changes: [\n { type: \"new\", text: \"Browser tool with screenshots, DOM snapshots and a full action trace.\" },\n { type: \"new\", text: \"Session recording: replay what the agent saw, frame by frame.\" },\n { type: \"improved\", text: \"Approvals can now be routed to Slack channels by risk level.\" },\n { type: \"fixed\", text: \"Long-running runs no longer lose their cost counter after a deploy.\" },\n ],\n },\n {\n id: \"2-3\",\n version: \"2.3\",\n date: \"2026-08-27\",\n title: \"Evals as GitHub checks\",\n summary: \"Every pull request can now run your eval suite and block the merge when success rate drops.\",\n changes: [\n { type: \"new\", text: \"GitHub app with per-case results and a diff against main.\" },\n { type: \"new\", text: \"Model comparison view: run one dataset against three models.\" },\n { type: \"improved\", text: \"LLM graders accept a rubric and return a rationale you can edit.\" },\n { type: \"removed\", text: \"The v1 evaluation endpoints, deprecated in March.\" },\n ],\n },\n {\n id: \"2-2\",\n version: \"2.2\",\n date: \"2026-07-30\",\n title: \"Bring your own cloud\",\n summary: \"Run the data plane in your VPC. Prompts, tool data and secrets never leave your network.\",\n changes: [\n { type: \"new\", text: \"Terraform module for AWS, GCP and Azure.\" },\n { type: \"improved\", text: \"Traces load 3x faster for runs over 500 spans.\" },\n { type: \"fixed\", text: \"Tool retries respected the wrong backoff when the API returned Retry-After.\" },\n ],\n },\n {\n id: \"2-1\",\n version: \"2.1\",\n date: \"2026-06-26\",\n title: \"Branch any trace\",\n changes: [\n { type: \"new\", text: \"Branch a run from any step, edit the input and compare outcomes.\" },\n { type: \"improved\", text: \"SDK streams partial tool results to your UI.\" },\n { type: \"fixed\", text: \"Python SDK now cancels in-flight tool calls on Ctrl+C.\" },\n ],\n },\n]\n\ntype OrbitChangelogProps = React.ComponentProps<\"div\"> & { hrefs?: Partial }\n\n/** Orbit changelog: a filterable release feed under a calm header. */\nfunction OrbitChangelog({ hrefs, ...props }: OrbitChangelogProps) {\n return (\n \n
\n

Changelog

\n
\n

What we shipped.

\n \n RSS\n \n
\n

New releases land every month. Breaking changes are announced 90 days ahead.

\n \n
\n \n )\n}\n\nexport { OrbitChangelog, type OrbitChangelogProps }\n", "type": "registry:component", "target": "@components/ballmac/templates/orbit/orbit-changelog.tsx" }, { "path": "registry/ballmac/components/templates/orbit/orbit-login.tsx", "content": "// Ballmac UI: Orbit sign-in page. https://ui.ballmac.com/templates/template-orbit\n\"use client\"\n\nimport * as React from \"react\"\nimport { ArrowRight, Check } from \"lucide-react\"\n\nimport { OrbitMark, OrbitShell, type OrbitHrefs } from \"@/components/ballmac/templates/orbit/orbit-theme\"\n\nconst mono = { fontFamily: \"var(--orbit-mono)\" } as const\n\ntype OrbitLoginProps = React.ComponentProps<\"div\"> & { hrefs?: Partial }\n\n/** Orbit sign-in: a focused form beside a live-looking trace. */\nfunction OrbitLogin({ hrefs, ...props }: OrbitLoginProps) {\n const [sent, setSent] = React.useState(false)\n const [email, setEmail] = React.useState(\"\")\n const home = hrefs?.home ?? \"/orbit\"\n return (\n \n
\n
\n Orbit\n
\n {sent ? (\n
\n \n

Check your inbox

\n

We sent a sign-in link to {email}. It works for 15 minutes.

\n \n
\n ) : (\n <>\n

Welcome back

\n

Sign in to your Orbit workspace.

\n \n
or with email
\n {\n e.preventDefault()\n if (email.trim()) setSent(true)\n }}\n >\n \n setEmail(e.target.value)}\n placeholder=\"you@company.com\"\n className=\"bg-card/60 focus-visible:ring-ring/50 placeholder:text-muted-foreground mt-2 h-11 w-full rounded-xl border px-3.5 text-sm outline-none focus-visible:ring-[3px]\"\n />\n \n \n

New to Orbit? Signing in creates your workspace. By continuing you agree to the Terms and Privacy Policy.

\n \n )}\n
\n
\n\n
\n \n )\n}\n\nexport { OrbitLogin, type OrbitLoginProps }\n", "type": "registry:component", "target": "@components/ballmac/templates/orbit/orbit-login.tsx" }, { "path": "registry/ballmac/app/orbit/page.tsx", "content": "// Ballmac UI: Orbit template route. https://ui.ballmac.com/templates/template-orbit\nimport type { Metadata } from \"next\"\n\nimport { OrbitHome } from \"@/components/ballmac/templates/orbit/orbit-home\"\n\nexport const metadata: Metadata = {\n title: \"Orbit: Agents that finish the job\",\n description: \"Build, test and run AI agents with tools, evals and guardrails.\",\n}\n\nexport default function Page() {\n return \n}\n", "type": "registry:page", "target": "app/orbit/page.tsx" }, { "path": "registry/ballmac/app/orbit/pricing/page.tsx", "content": "// Ballmac UI: Orbit template route. https://ui.ballmac.com/templates/template-orbit\nimport type { Metadata } from \"next\"\n\nimport { OrbitPricing } from \"@/components/ballmac/templates/orbit/orbit-pricing\"\n\nexport const metadata: Metadata = {\n title: \"Orbit pricing\",\n description: \"Pay for runs, not for hope. Start free and grow into seats and volume.\",\n}\n\nexport default function Page() {\n return \n}\n", "type": "registry:page", "target": "app/orbit/pricing/page.tsx" }, { "path": "registry/ballmac/app/orbit/changelog/page.tsx", "content": "// Ballmac UI: Orbit template route. https://ui.ballmac.com/templates/template-orbit\nimport type { Metadata } from \"next\"\n\nimport { OrbitChangelog } from \"@/components/ballmac/templates/orbit/orbit-changelog\"\n\nexport const metadata: Metadata = {\n title: \"Orbit changelog\",\n description: \"Everything we shipped, month by month.\",\n}\n\nexport default function Page() {\n return \n}\n", "type": "registry:page", "target": "app/orbit/changelog/page.tsx" }, { "path": "registry/ballmac/app/orbit/login/page.tsx", "content": "// Ballmac UI: Orbit template route. https://ui.ballmac.com/templates/template-orbit\nimport type { Metadata } from \"next\"\n\nimport { OrbitLogin } from \"@/components/ballmac/templates/orbit/orbit-login\"\n\nexport const metadata: Metadata = {\n title: \"Sign in to Orbit\",\n description: \"Sign in to your Orbit workspace.\",\n}\n\nexport default function Page() {\n return \n}\n", "type": "registry:page", "target": "app/orbit/login/page.tsx" } ], "meta": { "schema": 1, "tier": "free", "tags": [ "template", "ai", "agents", "saas", "dark", "landing page", "pricing", "changelog" ], "version": "1.0.0", "updated": "2026-10-01", "ai": { "summary": "Installs a four-page dark site for an AI product. Change the palette in orbit-theme.tsx (orbitVars), the copy in each page file, and the agent-run script (steps) in orbit-agent-run.tsx.", "whenToUse": [ "Marketing sites for AI agents, LLM tooling or developer platforms", "A dark, high-contrast brand with a live product demo in the hero" ], "whenNotToUse": [ "Light, editorial brands (a Northwind-style template)", "Mac app landing pages (a Ledger-style template)" ], "composesWith": [ "pricing-3", "changelog-1", "faq-2" ], "a11y": [], "customization": [ "Edit orbitVars for the palette", "Edit steps in OrbitAgentRun to script your own demo run", "Swap fonts in orbit-fonts.ts" ] }, "examples": [ "template-orbit-demo", "template-orbit-pricing", "template-orbit-changelog", "template-orbit-login" ], "url": "https://ui.ballmac.com/components/template-orbit" }, "docs": "Pages are at /orbit, /orbit/pricing, /orbit/changelog and /orbit/login. The palette lives in orbit-theme.tsx (orbitVars); fonts load through next/font in orbit-fonts.ts.", "categories": [ "templates" ], "type": "registry:block" }