Skip to content

Sunpeak-AI/sunpeak

Repository files navigation

sunpeak

npm version npm downloads CI License TypeScript React

The MCP App framework.

Quickstart, build, test, and ship your ChatGPT App locally!

Demo (Hosted) ~ Demo (Video) ~ Discord (NEW) ~ Documentation ~ GitHub

Quickstart

New Projects

Requirements: Node (20+), pnpm (10+)

pnpm dlx sunpeak new

To add sunpeak to an existing project, refer to the documentation.

Overview

sunpeak is an npm package consisting of:

  1. The sunpeak library (./src). An npm package for running & testing MCP Apps. This standalone library contains:
    1. Runtime APIs - Strongly typed, multi-platform APIs for interacting with the ChatGPT runtime, architected to support future platforms (Gemini, Claude).
    2. ChatGPT simulator - React component replicating ChatGPT's runtime.
    3. MCP server - Mock data MCP server for testing local Resources in the real ChatGPT.
  2. The sunpeak framework (./template). An end-to-end framework MCP Apps, from quickstart to shipped. This templated npm package includes:
    1. Project scaffold - Complete development setup with build, test, and mcp tooling.
    2. UI components - Production-ready components following ChatGPT design guidelines and using OpenAI apps-sdk-ui React components.
    3. CLI utility (./bin) - Commands for working with the sunpeak framework.

Note that the sunpeak library can be used without the framework.

Example Component

import { Card } from '../card';

export function MCPResource() {
  return (
    <Card
      image="https://images.unsplash.com/photo-1520950237264-dfe336995c34"
      imageAlt="Lady Bird Lake"
      header="Lady Bird Lake"
      metadata="⭐ 4.5 • Austin, TX"
      button1={{ children: 'Visit', isPrimary: true, onClick: () => {} }}
      button2={{ children: 'Learn More', onClick: () => {} }}
    >
      Scenic lake perfect for kayaking, paddleboarding, and trails.
    </Card>
  );
}

Contributing

We welcome your contributions!

For development quickstart on this package, see DEVELOPMENT.md.

Resources