Skip to content

Conversation

@kylemclaren
Copy link
Collaborator

@kylemclaren kylemclaren commented Jan 8, 2026

Summary

  • Add build-time API documentation generator that fetches schema and SDK examples
  • Add React components for double-pane Stainless-style API documentation layout
  • Add code snippet selector with localStorage language persistence
  • Update sidebar to include API documentation pages
  • Add comprehensive CSS styling for API documentation

Changes

Build Infrastructure

  • Add tsx dev dependency for TypeScript script execution
  • Add scripts/generate-api-docs.ts that fetches API schema and SDK examples from remote sources
  • Integrate generate:api into dev/start/build commands
  • Ignore generated src/content/docs/api/ in .gitignore

Components

  • Add base API documentation components (EndpointCard, PropertyRow, etc.)
  • Add double-pane layout components (MethodPage, MethodHeader, PropertyTree, etc.)
  • Add SnippetSelector with cross-page language preference sync
  • Add shadcn/ui Card component
  • Add Elixir language support to CodeTabs

Configuration

  • Update sidebar with API documentation pages
  • Update LLMs text export to include generated API docs

Test plan

  • Run pnpm dev and verify API docs are generated
  • Navigate to /api and verify documentation renders
  • Test language selector persists preference across pages
  • Verify double-pane layout works on desktop and mobile

🤖 Generated with Claude Code

kylemclaren and others added 11 commits January 8, 2026 17:31
- Add tsx dev dependency for running TypeScript scripts
- Add generate:api script that fetches API schema and SDK examples
- Integrate generation into dev/start/build commands
- Ignore generated API docs in .gitignore (rebuilt on deploy)

Co-Authored-By: Claude Opus 4.5 <[email protected]>
TypeScript type definitions for API schema, endpoints, SDK examples,
and utility functions for fetching and merging API data.

Co-Authored-By: Claude Opus 4.5 <[email protected]>
Add Card component with variants: Card, CardHeader, CardTitle,
CardDescription, CardContent, CardFooter, CardAction.

Co-Authored-By: Claude Opus 4.5 <[email protected]>
Add foundational React components for API documentation:
- WebSocketBadge: Visual indicator for WebSocket endpoints
- PropertyRow: Display property name, type, and description
- EndpointHeader: Header with method and path
- ParameterList: List of endpoint parameters
- ResponseExample: Code block for response examples
- TypeReference: Display type information
- EndpointCard: Card container for endpoints
- SnippetTabs: Tabbed code snippets
- CodeSnippet: Syntax-highlighted code display

Co-Authored-By: Claude Opus 4.5 <[email protected]>
Add Stainless-style double-pane layout components:
- MethodPage/MethodPageLeft/MethodPageRight: Two-column layout
- MethodBadge: HTTP method badge with colors
- MethodHeader: Endpoint title with method and path
- PropertyTree: Expandable property documentation
- SDKSelector: Language selector for code examples
- CollapsibleSnippet: Expandable code block
- SnippetPanel: Code snippet container

Co-Authored-By: Claude Opus 4.5 <[email protected]>
- SnippetSelector: React component for selecting code language
- CodeSnippets.astro: Astro wrapper for multi-language code blocks
- Persists language preference to localStorage
- Syncs selection across all code snippets on page

Co-Authored-By: Claude Opus 4.5 <[email protected]>
Export all API documentation components (legacy and double-pane)
from the central React components index for easy importing.

Co-Authored-By: Claude Opus 4.5 <[email protected]>
Replace external API link with in-site API documentation pages:
Overview, Exec, Checkpoints, Services, Proxy, Policy, Type Definitions.

Co-Authored-By: Claude Opus 4.5 <[email protected]>
Update the LLMs full-text export to include the generated API
documentation pages instead of the removed rest.mdx.

Co-Authored-By: Claude Opus 4.5 <[email protected]>
Add comprehensive CSS for API documentation including:
- HTTP method colors (GET, POST, PUT, DELETE, PATCH, WebSocket)
- Double-pane layout with sticky code snippets
- Property tree styling
- Method badges and headers
- Snippet container styling
- Full-width page layout for API pages
- Stainless-style snippet component styling

Co-Authored-By: Claude Opus 4.5 <[email protected]>
@kylemclaren kylemclaren changed the title Add generated API documentation with double-pane layout Add generated API documentation Jan 8, 2026
@github-actions
Copy link

github-actions bot commented Jan 8, 2026

Preview Deployment

Name URL
Preview https://pr-59-superfly-sprites-docs.fly.dev

Commit: ce7d15e

@github-actions
Copy link

github-actions bot commented Jan 8, 2026

Lighthouse Results

URL Performance Accessibility Best Practices SEO
/ 🟢 99 🟢 100 🟢 100 🟢 92

@github-actions
Copy link

github-actions bot commented Jan 8, 2026

E2E Test Results

✅ Tests success

Ran against: https://pr-59-superfly-sprites-docs.fly.dev

- Remove unused imports
- Fix import ordering
- Apply formatting fixes
- Use optional chaining where appropriate
- Fix useEffect dependency issues with useCallback
- Remove non-null assertions

Co-Authored-By: Claude Opus 4.5 <[email protected]>
- Remove overflow:hidden from .method-page-right
- Remove overflow-y:auto and max-height from .code-snippets
- Move overflow-hidden to only the code blocks section
- Add explicit border-radius to header and code blocks

The dropdown was being clipped by multiple overflow containers.

Co-Authored-By: Claude Opus 4.5 <[email protected]>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants