feat: rename package to osprotocol + add home page CTAs (#67)

Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>

Author: rbadillap

.claude/skills/osprotocol-docwriter/SKILL.md

@@ -36,7 +36,7 @@ If there is no corresponding `.ts` file, the page has no schema backing. Unless
 
 Read [conventions.md](references/conventions.md) for the full style guide. Key rules:
 
-- Import paths must be real and verifiable (`@osprotocol/schema/system/env`)
+- Import paths must be real and verifiable (`osprotocol/system/env`)
 - TypeScript interfaces must match the schema exactly — copy from source, don't paraphrase
 - Mermaid diagrams when they clarify flow or state, not for decoration
 - No "Coming soon", no generic bullet lists, no marketing language

.claude/skills/osprotocol-docwriter/references/conventions.md

@@ -50,7 +50,7 @@ No strict template. Follow conventions for tone and structure, but organize cont
 Always show the real import path first:
 
 ```ts
-import type { Timeout, TimeoutAction } from '@osprotocol/schema/runs/timeout'
+import type { Timeout, TimeoutAction } from 'osprotocol/runs/timeout'
 ```
 
 Verify the import path exists in `packages/schema/package.json` exports. If it doesn't, the path is wrong.

.claude/skills/osprotocol-docwriter/references/gold-standard.md

@@ -29,7 +29,7 @@ The flowchart shows the actual decision path: start → timer → running → ti
 ### 3. TypeScript API section is verifiable
 
 ```ts
-import type { Timeout, TimeoutAction } from '@osprotocol/schema/runs/timeout'
+import type { Timeout, TimeoutAction } from 'osprotocol/runs/timeout'
 ```
 
 Real import path. The types that follow are exact copies from the schema source — not summaries, not paraphrases. A developer can copy-paste this into their code.

.claude/skills/osprotocol-docwriter/references/inventory.md

@@ -59,7 +59,7 @@ Or check specific paths:
 grep -r "exports" packages/schema/package.json
 ```
 
-If a page shows `import type { X } from '@osprotocol/schema/foo/bar'` but that export path doesn't exist in `package.json`, the page is **stale**.
+If a page shows `import type { X } from 'osprotocol/foo/bar'` but that export path doesn't exist in `package.json`, the page is **stale**.
 
 ## Step 6: Check for broken links
 

.claude/skills/osprotocol-docwriter/references/templates.md

@@ -19,7 +19,7 @@ description: [One sentence: what it does and where it fits]
 ## TypeScript API
 
 \`\`\`ts
-import type { [Types] } from '@osprotocol/schema/[domain]/[file]'
+import type { [Types] } from 'osprotocol/[domain]/[file]'
 \`\`\`
 
 ### [TypeName]

AGENTS.md

@@ -40,5 +40,5 @@ A specification for orchestrating AI agents. OSP defines TypeScript interfaces 
 
 This is a monorepo managed with Turborepo and Bun:
 
-- `packages/schema/` — `@osprotocol/schema` TypeScript types (published to npm as `.ts` files)
+- `packages/schema/` — `osprotocol` TypeScript types (published to npm as `.ts` files)
 - `apps/web/` — Documentation site (Next.js + Fumadocs)

CLAUDE.md

@@ -60,7 +60,7 @@ This project uses [Changesets](https://github.com/changesets/changesets) for ver
 5. On merge to `main`, GitHub Actions creates a "Version Packages" PR
 6. On merge of that PR, GitHub Actions publishes to npm automatically
 
-The `@osprotocol/schema` package is published as a **types-only package** (`.ts` files directly, no compiled `.d.ts`). The `apps/web` package is excluded from publishing.
+The `osprotocol` package is published as a **types-only package** (`.ts` files directly, no compiled `.d.ts`). The `apps/web` package is excluded from publishing.
 
 ## Architecture
 
@@ -73,7 +73,7 @@ protocol/
 │   ├── content/docs/   # MDX documentation files
 │   ├── components/     # React components
 │   └── lib/            # Shared utilities (source.ts, metadata.ts)
-└── packages/schema/    # @osprotocol/schema - Protocol type definitions
+└── packages/schema/    # osprotocol - Protocol type definitions
     ├── system/         # System interfaces (env, fs, sandbox, settings, preferences, registry, installer, mcp-client)
     ├── context/        # Context facades (system context, embeddings, kv)
     ├── actions/        # Action facades (system actions, tools, mcp-servers)
@@ -85,16 +85,16 @@ protocol/
 
 ### Schema Package Exports
 
-The `@osprotocol/schema` package provides TypeScript types for the protocol. See `packages/schema/package.json` `exports` field for the full list. Key entry points:
+The `osprotocol` package provides TypeScript types for the protocol. See `packages/schema/package.json` `exports` field for the full list. Key entry points:
 
-- `@osprotocol/schema` - Main barrel export
-- `@osprotocol/schema/workflows` - Workflow patterns
-- `@osprotocol/schema/runs` - Run control
-- `@osprotocol/schema/system/*` - System interfaces (env, fs, sandbox, settings, preferences, registry, installer, mcp-client)
-- `@osprotocol/schema/context/*` - Context facades (system, embeddings, kv)
-- `@osprotocol/schema/actions/*` - Action facades (system, tools, mcp-servers)
-- `@osprotocol/schema/checks/*` - Verification (rules, judge, audit, screenshot)
-- `@osprotocol/schema/apps/schema` - Distribution manifest types
+- `osprotocol` - Main barrel export
+- `osprotocol/workflows` - Workflow patterns
+- `osprotocol/runs` - Run control
+- `osprotocol/system/*` - System interfaces (env, fs, sandbox, settings, preferences, registry, installer, mcp-client)
+- `osprotocol/context/*` - Context facades (system, embeddings, kv)
+- `osprotocol/actions/*` - Action facades (system, tools, mcp-servers)
+- `osprotocol/checks/*` - Verification (rules, judge, audit, screenshot)
+- `osprotocol/apps/schema` - Distribution manifest types
 
 ### Documentation Site
 

README.md

@@ -14,7 +14,7 @@
 <p align="center">
   <a href="https://osprotocol.dev/docs">Documentation</a> |
   <a href="https://osprotocol.dev/docs/architecture">Architecture</a> |
-  <a href="https://www.npmjs.com/package/@osprotocol/schema">npm</a>
+  <a href="https://www.npmjs.com/package/osprotocol">npm</a>
 </p>
 
 #### About

apps/web/app/(home)/page.tsx

@@ -3,6 +3,7 @@ import Link from 'next/link';
 import { Building, RefreshCw, Target } from 'lucide-react';
 import { createMetadata } from '@/lib/metadata';
 import WorldMap from '@/components/world-map';
+import { InstallButton } from '@/components/install-button';
 
 export async function generateMetadata(): Promise<Metadata> {
   const image = {
@@ -83,8 +84,19 @@ export default function HomePage() {
           <span className="text-foreground">REST</span> for APIs—but for AI agents.
         </p>
 
+        {/* CTAs */}
+        <div className="flex flex-col sm:flex-row items-center gap-4 mb-12 md:mb-16">
+          <Link
+            href="/docs"
+            className="inline-flex items-center justify-center px-6 py-2.5 text-sm font-medium rounded-md bg-primary text-primary-foreground hover:bg-primary/90 transition-colors"
+          >
+            Get Started
+          </Link>
+          <InstallButton />
+        </div>
+
         {/* Three Domains */}
-        <div className="grid grid-cols-1 md:grid-cols-3 gap-6 md:gap-8 w-full max-w-4xl mb-12 md:mb-16">
+        <div className="grid grid-cols-1 md:grid-cols-3 gap-6 md:gap-8 w-full max-w-4xl">
           {domains.map((domain) => (
             <Link
               key={domain.title}
@@ -98,14 +110,6 @@ export default function HomePage() {
             </Link>
           ))}
         </div>
-
-        {/* CTA */}
-        <Link
-          href="/docs"
-          className="inline-flex items-center justify-center px-6 py-2.5 text-sm font-medium border border-border rounded-md bg-transparent hover:bg-accent hover:text-accent-foreground transition-colors active:scale-[0.97] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
-        >
-          View Documentation →
-        </Link>
       </div>
     </div>
   );

apps/web/components/install-button.tsx

@@ -0,0 +1,29 @@
+"use client"
+
+import * as React from "react"
+import { Check, Copy } from "lucide-react"
+
+export function InstallButton() {
+  const [copied, setCopied] = React.useState(false)
+  const command = "npm i osprotocol"
+
+  const copyToClipboard = async () => {
+    await navigator.clipboard.writeText(command)
+    setCopied(true)
+    setTimeout(() => setCopied(false), 2000)
+  }
+
+  return (
+    <button
+      onClick={copyToClipboard}
+      className="inline-flex items-center gap-2 px-4 py-2.5 text-sm font-mono border border-border rounded-md bg-transparent hover:bg-accent transition-colors"
+    >
+      <span>{command}</span>
+      {copied ? (
+        <Check className="size-4 text-green-500" />
+      ) : (
+        <Copy className="size-4 text-muted-foreground" />
+      )}
+    </button>
+  )
+}