ORPC Playground
8 |9 | You can visit the 10 | {' '} 11 | Scalar API Reference 12 | {' '} 13 | page. 14 |
15 |16 |
18 |
19 |
20 | 
21 |
22 |
7 |
12 |
14 |
--------------------------------------------------------------------------------
/playgrounds/astro/src/playground-client.ts:
--------------------------------------------------------------------------------
1 | import { client as orpc } from './lib/orpc'
2 | import { safe } from '@orpc/client'
3 |
4 | const token = await orpc.auth.signin({
5 | email: 'john@doe.com',
6 | password: '123456',
7 | })
8 |
9 | const [error, planet, isDefined] = await safe(orpc.planet.update({ id: 1, name: 'Earth', description: 'The planet Earth' }))
10 |
11 | if (error) {
12 | if (isDefined) {
13 | const id = error.data.id
14 | // ^ type-safe
15 | }
16 |
17 | console.log('ERROR', error)
18 | }
19 | else {
20 | console.log('PLANET', planet)
21 | }
22 |
--------------------------------------------------------------------------------
/playgrounds/astro/src/polyfill.ts:
--------------------------------------------------------------------------------
1 | import { File } from 'node:buffer'
2 |
3 | /**
4 | * This file aims to polyfill missing APIs in Node.js 18 that oRPC depends on.
5 | *
6 | * Since Stackblitz runs on Node.js 18, these polyfills ensure oRPC works in that environment.
7 | * If you're running oRPC locally, please use Node.js 20 or later for full compatibility.
8 | */
9 |
10 | /**
11 | * Note: Stackblitz provides an emulated Node.js environment with inherent limitations.
12 | * If you encounter issues, please test on a local setup with Node.js 20 or later before reporting them.
13 | */
14 |
15 | /**
16 | * The `oz.file()` schema depends on the `File` API.
17 | * If you're not using `oz.file()`, you can safely remove this polyfill.
18 | */
19 | if (typeof globalThis.File === 'undefined') {
20 | globalThis.File = File as any
21 | }
22 |
--------------------------------------------------------------------------------
/playgrounds/astro/src/router/index.ts:
--------------------------------------------------------------------------------
1 | import { me, signin, signup } from './auth'
2 | import { createPlanet, findPlanet, listPlanets, updatePlanet } from './planet'
3 | import { sse } from './sse'
4 |
5 | export const router = {
6 | auth: {
7 | signup,
8 | signin,
9 | me,
10 | },
11 |
12 | planet: {
13 | list: listPlanets,
14 | create: createPlanet,
15 | find: findPlanet,
16 | update: updatePlanet,
17 | },
18 |
19 | sse,
20 | }
21 |
--------------------------------------------------------------------------------
/playgrounds/astro/src/router/sse.ts:
--------------------------------------------------------------------------------
1 | import { eventIterator, os } from '@orpc/server'
2 | import { z } from 'zod'
3 |
4 | const MAX_EVENTS = 5
5 |
6 | export const sse = os
7 | .route({
8 | method: 'GET',
9 | path: '/sse',
10 | tags: ['SSE'],
11 | summary: 'Server-Sent Events',
12 | })
13 | .output(eventIterator(z.object({ time: z.date() })))
14 | .handler(async function* () {
15 | let count = 0
16 |
17 | while (count < MAX_EVENTS) {
18 | count++
19 | yield { time: new Date() }
20 | await new Promise(resolve => setTimeout(resolve, 1000))
21 | }
22 | })
23 |
--------------------------------------------------------------------------------
/playgrounds/astro/src/schemas/auth.ts:
--------------------------------------------------------------------------------
1 | import { z } from 'zod'
2 |
3 | export const CredentialSchema = z.object({
4 | email: z.string().email(),
5 | password: z.string(),
6 | })
7 |
8 | export const TokenSchema = z.object({
9 | token: z.string(),
10 | })
11 |
--------------------------------------------------------------------------------
/playgrounds/astro/src/shared/query.ts:
--------------------------------------------------------------------------------
1 | import { QueryClient } from '@tanstack/react-query'
2 |
3 | export const queryClient = new QueryClient()
4 |
--------------------------------------------------------------------------------
/playgrounds/astro/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "astro/tsconfigs/strict",
3 | "compilerOptions": {
4 | "jsx": "react-jsx",
5 | "jsxImportSource": "react"
6 | },
7 | "include": [
8 | ".astro/types.d.ts",
9 | "**/*"
10 | ],
11 | "exclude": [
12 | "dist"
13 | ]
14 | }
15 |
--------------------------------------------------------------------------------
/playgrounds/browser-extension/.gitignore:
--------------------------------------------------------------------------------
1 | # Logs
2 | logs
3 | *.log
4 | npm-debug.log*
5 | yarn-debug.log*
6 | yarn-error.log*
7 | pnpm-debug.log*
8 | lerna-debug.log*
9 |
10 | node_modules
11 | .output
12 | stats.html
13 | stats-*.json
14 | .wxt
15 | web-ext.config.ts
16 |
17 | # Editor directories and files
18 | .idea
19 | .DS_Store
20 | *.suo
21 | *.ntvs*
22 | *.njsproj
23 | *.sln
24 | *.sw?
25 |
--------------------------------------------------------------------------------
/playgrounds/browser-extension/.vscode/settings.json:
--------------------------------------------------------------------------------
1 | {
2 | "editor.formatOnSave": true
3 | }
4 |
--------------------------------------------------------------------------------
/playgrounds/browser-extension/README.md:
--------------------------------------------------------------------------------
1 | # ORPC Playground
2 |
3 | This is a playground for [oRPC](https://orpc.unnoq.com) and [WXT](https://wxt.dev/)
4 |
5 | ## Getting Started
6 |
7 | First, run the development server:
8 |
9 | ```bash
10 | npm run dev
11 | ```
12 |
13 | ## Sponsors
14 |
15 | ORPC Playground
8 | You can visit the 9 | Scalar API Reference 10 | page. 11 |12 |
14 |
16 |
17 |
18 |
19 |
7 |
9 |
11 |
13 | )
14 | }
15 |
--------------------------------------------------------------------------------
/playgrounds/browser-extension/entrypoints/popup/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | ORPC Playground
8 |9 |
11 |
19 |
20 |
21 |
22 |
16 |
17 |
18 |
19 |
7 |
9 |
11 |
13 | )
14 | }
15 |
16 | export default App
17 |
--------------------------------------------------------------------------------
/playgrounds/electron/src/renderer/src/lib/orpc.ts:
--------------------------------------------------------------------------------
1 | import type { router } from '../../../main/router'
2 | import type { RouterClient } from '@orpc/server'
3 | import { createORPCClient } from '@orpc/client'
4 | import { experimental_RPCLink as RPCLink } from '@orpc/client/message-port'
5 | import { createTanstackQueryUtils } from '@orpc/tanstack-query'
6 |
7 | const { port1: clientPort, port2: serverPort } = new MessageChannel()
8 |
9 | window.postMessage('start-orpc-client', '*', [serverPort])
10 |
11 | const link = new RPCLink({
12 | port: clientPort,
13 | })
14 |
15 | clientPort.start()
16 |
17 | export const client: RouterClientORPC Playground
8 |9 |
11 |
18 |
19 |
20 |
21 |
19 |
20 |
21 |
22 |
6 |
11 | )
12 | }
13 |
--------------------------------------------------------------------------------
/playgrounds/next/src/app/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/unnoq/orpc/34e2f0a7e695c4cba67104540aeafe57e2ef9907/playgrounds/next/src/app/favicon.ico
--------------------------------------------------------------------------------
/playgrounds/next/src/app/layout.tsx:
--------------------------------------------------------------------------------
1 | import '../lib/orpc.server'
2 |
3 | import type { Metadata } from 'next'
4 | import { Providers } from './providers'
5 |
6 | export const metadata: Metadata = {
7 | title: 'ORPC Playground',
8 | description: 'End-to-end typesafe APIs builder, Developer-first simplicity',
9 | }
10 |
11 | export default function RootLayout({
12 | children,
13 | }: Readonly<{
14 | children: React.ReactNode
15 | }>) {
16 | return (
17 |
18 |
19 | 7 | Error: 8 | {error.message} 9 |
10 |Loading...
3 | }
4 |
--------------------------------------------------------------------------------
/playgrounds/next/src/app/orpc-server-action.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { useServerAction } from '@orpc/react/hooks'
4 | import { getting } from './actions'
5 | import { onSuccess } from '@orpc/client'
6 | import { getIssueMessage, parseFormData } from '@orpc/react'
7 |
8 | export function OrpcServerAction() {
9 | const state = useServerAction(getting, {
10 | interceptors: [
11 | onSuccess((message) => {
12 | alert(message)
13 | }),
14 | ],
15 | })
16 |
17 | return (
18 |
23 | )
24 | }
25 |
--------------------------------------------------------------------------------
/playgrounds/next/src/app/providers.tsx:
--------------------------------------------------------------------------------
1 | 'use client'
2 |
3 | import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
4 | import { useState } from 'react'
5 |
6 | export function Providers(props: { children: React.ReactNode }) {
7 | const [queryClient] = useState(() => new QueryClient())
8 |
9 | return (
10 |
19 |
20 |
21 |
22 |
3 |
12 |
15 |
16 |
--------------------------------------------------------------------------------
/playgrounds/nuxt/lib/orpc.ts:
--------------------------------------------------------------------------------
1 | import type { RouterClient } from '@orpc/server'
2 | import type { router } from '~/server/router'
3 | import { createORPCClient } from '@orpc/client'
4 | import { RPCLink } from '@orpc/client/fetch'
5 | import { createTanstackQueryUtils } from '@orpc/tanstack-query'
6 |
7 | const rpcLink = new RPCLink({
8 | url: `${typeof window !== 'undefined' ? window.location.origin : 'http://localhost:3000'}/rpc`,
9 | headers: () => ({
10 | Authorization: 'Bearer default-token',
11 | }),
12 | })
13 |
14 | export const client: RouterClientORPC Playground
4 |5 | You can visit the 6 | {' '} 7 | Scalar API Reference 8 | {' '} 9 | page. 10 |
11 |12 |
19 |
20 |
21 |
22 |
{children}
16 | {scripts}
17 |
18 |
19 | )}
20 | />
21 | ))
22 |
--------------------------------------------------------------------------------
/playgrounds/solid-start/src/global.d.ts:
--------------------------------------------------------------------------------
1 | /// 16 |
18 |
19 |
20 |
21 |
22 |
%sveltekit.body%
11 |
12 |
13 |
--------------------------------------------------------------------------------
/playgrounds/svelte-kit/src/lib/index.ts:
--------------------------------------------------------------------------------
1 | // place files you want to import through the `$lib` alias in this folder.
2 |
--------------------------------------------------------------------------------
/playgrounds/svelte-kit/src/lib/orpc.ts:
--------------------------------------------------------------------------------
1 | import type { RouterClient } from '@orpc/server'
2 | import type { router } from '../router'
3 | import { createORPCClient } from '@orpc/client'
4 | import { RPCLink } from '@orpc/client/fetch'
5 | import { createTanstackQueryUtils } from '@orpc/tanstack-query'
6 |
7 | const rpcLink = new RPCLink({
8 | url: `${typeof window !== 'undefined' ? window.location.origin : 'http://localhost:3000'}/rpc`,
9 | headers: () => ({
10 | Authorization: 'Bearer default-token',
11 | }),
12 | })
13 |
14 | export const client: RouterClient
11 |
20 |
22 |
24 | ORPC Playground
12 |13 | You can visit the 14 | {' '} 15 | Scalar API Reference 16 | {' '} 17 | page. 18 |
19 |20 |
22 |
19 |
20 |
21 |
22 |
12 |
19 |
21 |
23 | )
24 | }
25 |
--------------------------------------------------------------------------------
/playgrounds/tanstack-start/src/schemas/auth.ts:
--------------------------------------------------------------------------------
1 | import { z } from 'zod'
2 |
3 | export const CredentialSchema = z.object({
4 | email: z.string().email(),
5 | password: z.string(),
6 | })
7 |
8 | export const TokenSchema = z.object({
9 | token: z.string(),
10 | })
11 |
--------------------------------------------------------------------------------
/playgrounds/tanstack-start/src/ssr.tsx:
--------------------------------------------------------------------------------
1 | /// ORPC Playground
13 | You can visit the 14 | {' '} 15 | Redirect to Scalar API Reference 16 | {' '} 17 | page. 18 |19 |
21 |