- Sign in with the popup or sync your auth state with http://localhost:5173, explore an extension built with React Router for tabs and get a token from a tab-based content script using the new createClerkClient() function just for service workers.
-
The @clerk/chrome-extension v2.0 SDK now includes support for interacting with Clerk through a Background Service Worker.
-
v2.0 of the SDK introduces the new `createClerkClient()` helper function. This will also the Background Service Worker to initialize a new Clerk instance and attempt to refresh the user's session.
The button below will open a new tab and use a content script to send a message to a Background Servie Worker. Since you are signed in, you will end up seeing your session token displayed.
This new tab simluates a content page where you might want to access user information, or make a request to your backend server and include a user token in the request.
-
Make sure that you are signed into the extension. You can have the popup closed.
-
-
Token:
-
- {token &&
{token}
}
-
-
-
-
- )
-}
-
-
-
diff --git a/playground/browser-extension/src/utils/components.ts b/playground/browser-extension/src/utils/components.ts
deleted file mode 100644
index 9ad0df4269e..00000000000
--- a/playground/browser-extension/src/utils/components.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import { type ClassValue, clsx } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-
-export function cn(...inputs: ClassValue[]) {
- return twMerge(clsx(inputs));
-}
diff --git a/playground/browser-extension/tailwind.config.js b/playground/browser-extension/tailwind.config.js
deleted file mode 100644
index 564630220b7..00000000000
--- a/playground/browser-extension/tailwind.config.js
+++ /dev/null
@@ -1,6 +0,0 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
- content: ["./src/**/*.{tsx,html}"],
- darkMode: "media",
- prefix: "plasmo-"
-}
diff --git a/playground/browser-extension/tsconfig.json b/playground/browser-extension/tsconfig.json
deleted file mode 100644
index 6603b5b31d0..00000000000
--- a/playground/browser-extension/tsconfig.json
+++ /dev/null
@@ -1,20 +0,0 @@
-{
- "extends": "plasmo/templates/tsconfig.base",
- "exclude": [
- "node_modules"
- ],
- "include": [
- ".plasmo/index.d.ts",
- "./**/*.ts",
- "./**/*.tsx"
- ],
- "compilerOptions": {
- "jsx": "react-jsx",
- "paths": {
- "~*": [
- "./src/*"
- ]
- },
- "baseUrl": "."
- }
-}
diff --git a/playground/cra-js/.gitignore b/playground/cra-js/.gitignore
deleted file mode 100644
index 4d29575de80..00000000000
--- a/playground/cra-js/.gitignore
+++ /dev/null
@@ -1,23 +0,0 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-
-# dependencies
-/node_modules
-/.pnp
-.pnp.js
-
-# testing
-/coverage
-
-# production
-/build
-
-# misc
-.DS_Store
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
-
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
diff --git a/playground/cra-js/README.md b/playground/cra-js/README.md
deleted file mode 100644
index 552db95a646..00000000000
--- a/playground/cra-js/README.md
+++ /dev/null
@@ -1,70 +0,0 @@
-# Getting Started with Create React App
-
-This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
-
-## Available Scripts
-
-In the project directory, you can run:
-
-### `npm start`
-
-Runs the app in the development mode.\
-Open [http://localhost:3000](http://localhost:3000) to view it in your browser.
-
-The page will reload when you make changes.\
-You may also see any lint errors in the console.
-
-### `npm test`
-
-Launches the test runner in the interactive watch mode.\
-See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
-
-### `pnpm build`
-
-Builds the app for production to the `build` folder.\
-It correctly bundles React in production mode and optimizes the build for the best performance.
-
-The build is minified and the filenames include the hashes.\
-Your app is ready to be deployed!
-
-See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
-
-### `pnpm eject`
-
-**Note: this is a one-way operation. Once you `eject`, you can't go back!**
-
-If you aren't satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
-
-Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you're on your own.
-
-You don't have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn't feel obligated to use this feature. However we understand that this tool wouldn't be useful if you couldn't customize it when you are ready for it.
-
-## Learn More
-
-You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
-
-To learn React, check out the [React documentation](https://reactjs.org/).
-
-### Code Splitting
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting)
-
-### Analyzing the Bundle Size
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size)
-
-### Making a Progressive Web App
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app)
-
-### Advanced Configuration
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration)
-
-### Deployment
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment)
-
-### `pnpm build` fails to minify
-
-This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify)
diff --git a/playground/cra-js/package.json b/playground/cra-js/package.json
deleted file mode 100644
index 3770ecd2ad7..00000000000
--- a/playground/cra-js/package.json
+++ /dev/null
@@ -1,36 +0,0 @@
-{
- "name": "cra",
- "version": "0.1.0",
- "private": true,
- "dependencies": {
- "@clerk/react": "workspace:*",
- "@clerk/shared": "workspace:*",
- "@clerk/types": "workspace:*",
- "react": "^18.2.0",
- "react-dom": "^18.2.0",
- "react-scripts": "5.0.1",
- "web-vitals": "^2.1.4"
- },
- "scripts": {
- "start": "react-scripts start",
- "build": "react-scripts build",
- "eject": "react-scripts eject"
- },
- "eslintConfig": {
- "extends": [
- "react-app"
- ]
- },
- "browserslist": {
- "production": [
- ">0.2%",
- "not dead",
- "not op_mini all"
- ],
- "development": [
- "last 1 chrome version",
- "last 1 firefox version",
- "last 1 safari version"
- ]
- }
-}
diff --git a/playground/cra-js/public/favicon.ico b/playground/cra-js/public/favicon.ico
deleted file mode 100644
index a11777cc471..00000000000
Binary files a/playground/cra-js/public/favicon.ico and /dev/null differ
diff --git a/playground/cra-js/public/index.html b/playground/cra-js/public/index.html
deleted file mode 100644
index 2e9d8dbcc51..00000000000
--- a/playground/cra-js/public/index.html
+++ /dev/null
@@ -1,58 +0,0 @@
-
-
-
-
-
-
-
-
-
-
-
-
- React App
-
-
-
-
-
-
-
diff --git a/playground/cra-js/public/logo192.png b/playground/cra-js/public/logo192.png
deleted file mode 100644
index fc44b0a3796..00000000000
Binary files a/playground/cra-js/public/logo192.png and /dev/null differ
diff --git a/playground/cra-js/public/logo512.png b/playground/cra-js/public/logo512.png
deleted file mode 100644
index a4e47a6545b..00000000000
Binary files a/playground/cra-js/public/logo512.png and /dev/null differ
diff --git a/playground/cra-js/public/manifest.json b/playground/cra-js/public/manifest.json
deleted file mode 100644
index 080d6c77ac2..00000000000
--- a/playground/cra-js/public/manifest.json
+++ /dev/null
@@ -1,25 +0,0 @@
-{
- "short_name": "React App",
- "name": "Create React App Sample",
- "icons": [
- {
- "src": "favicon.ico",
- "sizes": "64x64 32x32 24x24 16x16",
- "type": "image/x-icon"
- },
- {
- "src": "logo192.png",
- "type": "image/png",
- "sizes": "192x192"
- },
- {
- "src": "logo512.png",
- "type": "image/png",
- "sizes": "512x512"
- }
- ],
- "start_url": ".",
- "display": "standalone",
- "theme_color": "#000000",
- "background_color": "#ffffff"
-}
diff --git a/playground/cra-js/public/robots.txt b/playground/cra-js/public/robots.txt
deleted file mode 100644
index e9e57dc4d41..00000000000
--- a/playground/cra-js/public/robots.txt
+++ /dev/null
@@ -1,3 +0,0 @@
-# https://www.robotstxt.org/robotstxt.html
-User-agent: *
-Disallow:
diff --git a/playground/cra-js/src/App.css b/playground/cra-js/src/App.css
deleted file mode 100644
index 74b5e053450..00000000000
--- a/playground/cra-js/src/App.css
+++ /dev/null
@@ -1,38 +0,0 @@
-.App {
- text-align: center;
-}
-
-.App-logo {
- height: 40vmin;
- pointer-events: none;
-}
-
-@media (prefers-reduced-motion: no-preference) {
- .App-logo {
- animation: App-logo-spin infinite 20s linear;
- }
-}
-
-.App-header {
- background-color: #282c34;
- min-height: 100vh;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- font-size: calc(10px + 2vmin);
- color: white;
-}
-
-.App-link {
- color: #61dafb;
-}
-
-@keyframes App-logo-spin {
- from {
- transform: rotate(0deg);
- }
- to {
- transform: rotate(360deg);
- }
-}
diff --git a/playground/cra-js/src/App.js b/playground/cra-js/src/App.js
deleted file mode 100644
index 33fc0b085ab..00000000000
--- a/playground/cra-js/src/App.js
+++ /dev/null
@@ -1,25 +0,0 @@
-import logo from './logo.svg';
-import './App.css';
-import { ClerkProvider, SignIn } from '@clerk/react';
-
-function App() {
- return (
-
-
-
-
-
- Edit src/App.js and save to reload.
-
-
-
-
-
- );
-}
-
-export default App;
diff --git a/playground/cra-js/src/index.css b/playground/cra-js/src/index.css
deleted file mode 100644
index 7323ae85c54..00000000000
--- a/playground/cra-js/src/index.css
+++ /dev/null
@@ -1,11 +0,0 @@
-body {
- margin: 0;
- font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
- 'Droid Sans', 'Helvetica Neue', sans-serif;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
-}
-
-code {
- font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
-}
diff --git a/playground/cra-js/src/index.js b/playground/cra-js/src/index.js
deleted file mode 100644
index 9168dc41355..00000000000
--- a/playground/cra-js/src/index.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import './index.css';
-import App from './App';
-import reportWebVitals from './reportWebVitals';
-
-const root = ReactDOM.createRoot(document.getElementById('root'));
-root.render(
-
-
- ,
-);
-
-// If you want to start measuring performance in your app, pass a function
-// to log results (for example: reportWebVitals(console.log))
-// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
-reportWebVitals();
diff --git a/playground/cra-js/src/logo.svg b/playground/cra-js/src/logo.svg
deleted file mode 100644
index 9dfc1c058ce..00000000000
--- a/playground/cra-js/src/logo.svg
+++ /dev/null
@@ -1 +0,0 @@
-
\ No newline at end of file
diff --git a/playground/cra-js/src/reportWebVitals.js b/playground/cra-js/src/reportWebVitals.js
deleted file mode 100644
index 5253d3ad9e6..00000000000
--- a/playground/cra-js/src/reportWebVitals.js
+++ /dev/null
@@ -1,13 +0,0 @@
-const reportWebVitals = onPerfEntry => {
- if (onPerfEntry && onPerfEntry instanceof Function) {
- import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
- getCLS(onPerfEntry);
- getFID(onPerfEntry);
- getFCP(onPerfEntry);
- getLCP(onPerfEntry);
- getTTFB(onPerfEntry);
- });
- }
-};
-
-export default reportWebVitals;
diff --git a/playground/expo/.env.example b/playground/expo/.env.example
deleted file mode 100644
index 0fe4594cfe1..00000000000
--- a/playground/expo/.env.example
+++ /dev/null
@@ -1 +0,0 @@
-EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_YWM123
\ No newline at end of file
diff --git a/playground/expo/.gitignore b/playground/expo/.gitignore
deleted file mode 100644
index 9bee08c5692..00000000000
--- a/playground/expo/.gitignore
+++ /dev/null
@@ -1,40 +0,0 @@
-# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
-
-# dependencies
-node_modules/
-
-# Expo
-.expo/
-dist/
-web-build/
-
-# Native
-*.orig.*
-*.jks
-*.p8
-*.p12
-*.key
-*.mobileprovision
-
-# Metro
-.metro-health-check*
-
-# debug
-npm-debug.*
-yarn-debug.*
-yarn-error.*
-
-# macOS
-.DS_Store
-*.pem
-
-# local env files
-.env*.local
-
-
-# typescript
-*.tsbuildinfo
-.env
-ios
-android
-app.json
\ No newline at end of file
diff --git a/playground/expo/App.tsx b/playground/expo/App.tsx
deleted file mode 100644
index efcf219bdf2..00000000000
--- a/playground/expo/App.tsx
+++ /dev/null
@@ -1,187 +0,0 @@
-import { ClerkProvider, Show, useAuth, useSignIn, useUser } from '@clerk/expo';
-import { passkeys } from '@clerk/expo/passkeys';
-import * as SecureStore from 'expo-secure-store';
-import React from 'react';
-import { StyleSheet, Text, TextInput, TouchableOpacity, View } from 'react-native';
-
-const tokenCache = {
- async getToken(key: string) {
- try {
- const item = await SecureStore.getItemAsync(key);
- if (item) {
- console.log(`${key} was used 🔐 \n`);
- } else {
- console.log('No values stored under key: ' + key);
- }
- return item;
- } catch (error) {
- console.error('SecureStore get item error: ', error);
- await SecureStore.deleteItemAsync(key);
- return null;
- }
- },
- async saveToken(key: string, value: string) {
- try {
- return SecureStore.setItemAsync(key, value);
- } catch (err) {
- console.log(err);
- }
- },
-};
-
-const ProtectedView = () => {
- const { user: clerkUser } = useUser();
- const auth = useAuth();
-
- const handleCreatePasskey = async () => {
- if (!clerkUser) {
- return;
- }
- try {
- return await clerkUser.createPasskey();
- } catch (e: any) {
- console.error(e.clerkError ? e.errors[0].longMessage : e.message);
- }
- };
-
- return (
-
-
- Create passkey
-
- {
- auth.signOut();
- }}
- >
- Sign out
-
- {clerkUser && (
-
-
- User with id {clerkUser.id} and Username{' '}
- {clerkUser.primaryEmailAddress?.toString()} is logged in{' '}
-
-
- )}
-
- );
-};
-
-const PublicView = () => {
- const { signIn, setActive, isLoaded } = useSignIn();
-
- const [emailAddress, setEmailAddress] = React.useState('');
- const [password, setPassword] = React.useState('');
-
- const handlePasswordSignIn = async () => {
- if (!isLoaded) {
- return;
- }
- try {
- const signInResponse = await signIn.create({
- identifier: emailAddress,
- password,
- });
- await setActive({ session: signInResponse.createdSessionId });
- } catch (err: any) {
- console.error(err.clerkError ? err.errors[0].longMessage : err);
- }
- };
-
- const handlePasskeySignIn = async () => {
- if (!isLoaded) {
- return;
- }
- try {
- const signInResponse = await signIn.authenticateWithPasskey({
- flow: 'discoverable',
- });
- await setActive({ session: signInResponse.createdSessionId });
- } catch (err: any) {
- console.error(`With code${err.code}, and message ${err.message}`);
- }
- };
-
- return (
-
-
- setEmailAddress(emailAddress)}
- />
-
-
-
- setPassword(password)}
- />
-
-
-
- Sign in
-
-
-
- Sign in with passkey
-
-
- );
-};
-
-export default function App() {
- const publishableKey = process.env.EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY!;
-
- return (
-
-
-
-
-
-
-
-
-
-
- );
-}
-
-const styles = StyleSheet.create({
- container: {
- flex: 1,
- backgroundColor: '#fff',
- alignItems: 'center',
- justifyContent: 'center',
- },
- protectedContainer: {
- gap: 12,
- flex: 1,
- justifyContent: 'center',
- backgroundColor: '#1D3D47',
- padding: 20,
- },
- publicContainer: {
- marginTop: 100,
- marginLeft: 10,
- gap: 15,
- },
- input: {
- // Add input styles
- },
- userInfo: {
- color: 'cyan',
- },
- italic: {
- fontStyle: 'italic',
- },
-});
diff --git a/playground/expo/README.md b/playground/expo/README.md
deleted file mode 100644
index c55113409ef..00000000000
--- a/playground/expo/README.md
+++ /dev/null
@@ -1,76 +0,0 @@
-# Running the Example Project with Clerk on Your iOS Simulator or Device
-
-## Prerequisites
-
-- Ensure you have Xcode installed and access to an Apple Developer Account.
-
-## Steps
-
-### Initiate project
-In the project root, run:
-
-```bash
- pnpm install
-```
-```bash
- cp app.json.example app.json
-```
-
-### Configure app.json
-
-Replace the following placeholder with your configs
-
-- ${YOUR_BUNDLE_IDENTIFIER}
-- ${PACKAGE_NAME}
-
-If you don't want to test passkeys remove the `associatedDomains` and `intentFilters`.
-
-
-### Set Up Environment Variables
-
-Add the `EXPO_PUBLIC_CLERK_PUBLISHABLE_KEY` to the `.env`.
-
-
-### Prebuild the Project
-
-```bash
- pnpm expo prebuild --clean
-```
-
-### Run the Project
-
-```bash
- pnpm run ios
-```
-
-Or
-
-```bash
- pnpm run android
-```
-
-### Troubleshooting
-
-If you get the following error `Error: TreeFS: Could not add directory node_modules`,
-terminate the ios or android emulator and run again `npm i`
-
-## Testing the Passkey Feature
-
-### Configure Associated Domains for iOS
-
-1. Log into your Clerk Dashboard, open the Native applications, and, for testing purposes, consider using a development instance.
-2. Set up your Associated Domains. To do this, you'll need:
- - An Apple Developer account
- - Your App ID Prefix and Bundle ID, available at Apple's Developer portal
-3. In `app.json`, replace the `associatedDomains` entry with the front-end API domain provided by Clerk (e.g., `coyote-6.clerk.accounts.dev`).
-4. Also update the `bundleIdentifier` in `app.json` to match your Bundle ID from the Apple Developer portal.
-
-### How to use the passkeys
-
-1. Go to your Clerk Dashboard and enable Passkeys in the Email, Phone, Username settings.
-2. Create a user in the Users tab on the dashboard, using email and password as the authentication attributes.
-3. Open the app on your device or simulator, sign in with the user you just created.
-4. After signing in, select the option to Create a Passkey and follow the prompts to register your passkey.
-5. Sign out, and on the login screen, choose the Sign in with Passkey option to test the feature.
-
-
diff --git a/playground/expo/app.json.example b/playground/expo/app.json.example
deleted file mode 100644
index 6135e8cc0b4..00000000000
--- a/playground/expo/app.json.example
+++ /dev/null
@@ -1,38 +0,0 @@
-{
- "expo": {
- "name": "clerk-expo-passkeys-example",
- "slug": "clerk-expo-passkeys-example",
- "version": "1.0.0",
- "orientation": "portrait",
- "userInterfaceStyle": "light",
- "splash": {
- "resizeMode": "contain",
- "backgroundColor": "#ffffff"
- },
- "ios": {
- "supportsTablet": true,
- "bundleIdentifier": "${YOUR_BUNDLE_IDENTIFIER}",
- "associatedDomains": ["applinks:${YOUR_DOMAIN}", "webcredentials:${YOUR_DOMAIN}"]
- },
- "android": {
- "adaptiveIcon": {
- "backgroundColor": "#ffffff",
- "compileSdkVersion": 35
- },
- "package": "${PACKAGE_NAME}",
- "intentFilters": [
- {
- "action": "VIEW",
- "autoVerify": true,
- "data": [
- {
- "scheme": "https",
- "host": "${YOUR_DOMAIN}"
- }
- ],
- "category": ["BROWSABLE", "DEFAULT"]
- }
- ]
- }
- }
-}
diff --git a/playground/expo/babel.config.js b/playground/expo/babel.config.js
deleted file mode 100644
index 9d89e131194..00000000000
--- a/playground/expo/babel.config.js
+++ /dev/null
@@ -1,6 +0,0 @@
-module.exports = function (api) {
- api.cache(true);
- return {
- presets: ['babel-preset-expo'],
- };
-};
diff --git a/playground/expo/metro.config.js b/playground/expo/metro.config.js
deleted file mode 100644
index e5b4587e5d0..00000000000
--- a/playground/expo/metro.config.js
+++ /dev/null
@@ -1,35 +0,0 @@
-// Learn more https://docs.expo.io/guides/customizing-metro
-const { getDefaultConfig } = require('expo/metro-config');
-const path = require('path');
-
-const config = getDefaultConfig(__dirname);
-
-// npm v7+ will install ../node_modules/react and ../node_modules/react-native because of peerDependencies.
-// To prevent the incompatible react-native between ./node_modules/react-native and ../node_modules/react-native,
-// excludes the one from the parent folder when bundling.
-config.resolver.blockList = [
- ...Array.from(config.resolver.blockList ?? []),
- new RegExp(path.resolve('..', 'node_modules', 'react')),
- new RegExp(path.resolve('..', 'node_modules', 'react-native')),
-];
-
-config.resolver.nodeModulesPaths = [
- path.resolve(__dirname, './node_modules'),
-
- path.resolve(__dirname, '../node_modules'),
-];
-
-config.resolver.extraNodeModules = {
- 'expo-passkeys': '..',
-};
-
-config.watchFolders = [path.resolve(__dirname, '..')];
-
-config.transformer.getTransformOptions = async () => ({
- transform: {
- experimentalImportSupport: false,
- inlineRequires: true,
- },
-});
-
-module.exports = config;
diff --git a/playground/expo/package.json b/playground/expo/package.json
deleted file mode 100644
index 639414318de..00000000000
--- a/playground/expo/package.json
+++ /dev/null
@@ -1,39 +0,0 @@
-{
- "name": "expo-passkeys-example",
- "version": "1.0.0",
- "private": true,
- "main": "expo/AppEntry.js",
- "scripts": {
- "android": "expo run:android",
- "ios": "expo run:ios",
- "start": "expo start",
- "web": "expo start --web",
- "expo:update": "pnpm expo install --fix"
- },
- "dependencies": {
- "@clerk/expo": "workspace:*",
- "@clerk/clerk-js": "workspace:*",
- "@clerk/react": "workspace:*",
- "@clerk/expo-passkeys": "workspace:*",
- "@clerk/shared": "workspace:*",
- "@clerk/types": "workspace:*",
- "@expo/metro-runtime": "~3.2.3",
- "@react-native-async-storage/async-storage": "1.23.1",
- "expo": "~51.0.39",
- "expo-auth-session": "^5.5.2",
- "expo-build-properties": "^0.12.5",
- "expo-secure-store": "^13.0.2",
- "expo-web-browser": "^13.0.3",
- "react": "18.3.1",
- "react-native": "~0.75.0",
- "react-native-web": "~0.19.10",
- "react-native-reanimated": "~3.15.0",
- "react-native-gesture-handler": "~2.18.1",
- "react-native-screens": "~3.34.0"
- },
- "devDependencies": {
- "@babel/core": "^7.20.0",
- "@types/react": "~18.2.45",
- "typescript": "~5.3.3"
- }
-}
diff --git a/playground/expo/tsconfig.json b/playground/expo/tsconfig.json
deleted file mode 100644
index f7fbd097941..00000000000
--- a/playground/expo/tsconfig.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
- "extends": "expo/tsconfig.base",
- "compilerOptions": {
- "strict": true,
- "paths": {
- "expo-passkeys": ["../src/index"],
- "expo-passkeys/*": ["../src/*"]
- }
- }
-}
diff --git a/playground/expo/webpack.config.js b/playground/expo/webpack.config.js
deleted file mode 100644
index 8c3a4228574..00000000000
--- a/playground/expo/webpack.config.js
+++ /dev/null
@@ -1,17 +0,0 @@
-const createConfigAsync = require('@expo/webpack-config');
-const path = require('path');
-
-module.exports = async (env, argv) => {
- const config = await createConfigAsync(
- {
- ...env,
- babel: {
- dangerouslyAddModulePathsToTranspile: ['expo-passkeys'],
- },
- },
- argv,
- );
- config.resolve.modules = [path.resolve(__dirname, './node_modules'), path.resolve(__dirname, '../node_modules')];
-
- return config;
-};
diff --git a/playground/express/.env.sample b/playground/express/.env.sample
deleted file mode 100644
index 6c916523188..00000000000
--- a/playground/express/.env.sample
+++ /dev/null
@@ -1,2 +0,0 @@
-CLERK_PUBLISHABLE_KEY=pk_test_*************
-CLERK_SECRET_KEY=sk_test_*************
diff --git a/playground/express/.gitignore b/playground/express/.gitignore
deleted file mode 100644
index 5280f758c35..00000000000
--- a/playground/express/.gitignore
+++ /dev/null
@@ -1,35 +0,0 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-
-# dependencies
-/node_modules
-/.pnp
-.pnp.js
-
-# testing
-/coverage
-
-# next.js
-/.next/
-/out/
-
-# production
-/build
-
-# misc
-.DS_Store
-*.pem
-
-# debug
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-.pnpm-debug.log*
-
-# local env files
-.env
-
-# vercel
-.vercel
-
-# typescript
-*.tsbuildinfo
diff --git a/playground/express/README.md b/playground/express/README.md
deleted file mode 100644
index fad18de14c2..00000000000
--- a/playground/express/README.md
+++ /dev/null
@@ -1,31 +0,0 @@
-## Setup development
-
-Execute in root folder:
-
-```bash
-pnpm i
-pnpm build
-```
-
-Execute in current folder:
-
-```bash
-touch .env # set PUBLISHABLE_KEY, SECRET_KEY and JWT_KEY from Clerk Dashboard API keys
-npm i
-```
-
-If you need to test local package changes, use pkglab to publish packages locally.
-
-## Getting Started
-
-First, run the development server:
-
-```bash
-npm start
-```
-
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
-
-## Reload changes from packages/\* package
-
-Apply change in packages/\* project folder and run `pnpm build`. Then restart Express server by killing the current and executing `npm start` and the change should be visible.
diff --git a/playground/express/package.json b/playground/express/package.json
deleted file mode 100644
index ff99d9e6ab0..00000000000
--- a/playground/express/package.json
+++ /dev/null
@@ -1,27 +0,0 @@
-{
- "name": "@playground/express",
- "version": "0.1.0",
- "private": true,
- "scripts": {
- "start": "ts-node ./src/server.ts"
- },
- "author": "",
- "license": "ISC",
- "dependencies": {
- "@clerk/backend": "workspace:*",
- "@clerk/express": "workspace:*",
- "@clerk/shared": "workspace:*",
- "@clerk/types": "workspace:*",
- "dotenv": "^16.0.3",
- "ejs": "^3.1.6",
- "express": "^4.21.0",
- "ts-node": "^10.9.1"
- },
- "devDependencies": {
- "@types/express": "^4.17.21",
- "@types/node": "^18.17",
- "eslint": "8.24.0",
- "tslib": "^2.5.0",
- "typescript": "4.8.4"
- }
-}
diff --git a/playground/express/src/loadEnv.ts b/playground/express/src/loadEnv.ts
deleted file mode 100644
index 5b5d1facc93..00000000000
--- a/playground/express/src/loadEnv.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import * as dotenv from 'dotenv';
-dotenv.config();
diff --git a/playground/express/src/routes/index.ts b/playground/express/src/routes/index.ts
deleted file mode 100644
index 899775555c6..00000000000
--- a/playground/express/src/routes/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export { privateRoutes } from './private';
-export { publicRoutes } from './public';
diff --git a/playground/express/src/routes/private.ts b/playground/express/src/routes/private.ts
deleted file mode 100644
index 8164041a223..00000000000
--- a/playground/express/src/routes/private.ts
+++ /dev/null
@@ -1,39 +0,0 @@
-import { getAuth, requireAuth, UnauthorizedError, ForbiddenError } from '@clerk/express';
-import {
- Router,
- Request as ExpressRequest,
- Response as ExpressResponse,
- NextFunction
-} from 'express';
-
-const router = Router();
-
-router.use(requireAuth);
-
-router.get('/me', async (req: ExpressRequest, res: ExpressResponse) => {
- return res.json({ auth: getAuth(req) });
-});
-
-router.get('/admin-only', async (req: ExpressRequest, res: ExpressResponse, next: NextFunction) => {
- const auth = getAuth(req);
-
- if (!auth.has({ role: 'admin' })) {
- return next(new ForbiddenError());
- }
-
- return res.json({ message: 'Hello admin!', auth });
-})
-
-router.use((err: Error, _req: ExpressRequest, res: ExpressResponse, next: NextFunction) => {
- if (err instanceof UnauthorizedError) {
- return res.status(401).json({ error: 'Unauthorized' });
- }
-
- if (err instanceof ForbiddenError) {
- return res.status(403).json({ error: 'Forbidden' });
- }
-
- return next(err)
-})
-
-export const privateRoutes = router;
diff --git a/playground/express/src/routes/public.ts b/playground/express/src/routes/public.ts
deleted file mode 100644
index fe4c62486ac..00000000000
--- a/playground/express/src/routes/public.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Router, RequestHandler} from 'express';
-
-const router = Router();
-
-router.get('/public', async (_req, reply) => {
- return reply.json({ hello: 'world' });
-});
-
-const homeHandler: RequestHandler = function (_req, res) {
- return res.render('home.ejs', {
- publishableKey: process.env.CLERK_PUBLISHABLE_KEY,
- domain: process.env.CLERK_DOMAIN,
- isSatellite: process.env.CLERK_IS_SATELLITE,
- signInUrl: process.env.CLERK_SIGN_IN_URL,
- });
-};
-
-router.get('/home', homeHandler);
-router.get('/', homeHandler);
-
-export const publicRoutes = router;
diff --git a/playground/express/src/server.ts b/playground/express/src/server.ts
deleted file mode 100644
index c9efee78acc..00000000000
--- a/playground/express/src/server.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import type { Application, Request, Response, NextFunction } from 'express';
-
-import { clerkMiddleware } from '@clerk/express';
-import * as express from 'express';
-import { privateRoutes, publicRoutes } from './routes';
-
-import './loadEnv';
-
-const port = process.env.PORT || 3000;
-const app: Application = express();
-
-app.set('view engine', 'ejs');
-app.set('views', 'src/views');
-
-app.use(clerkMiddleware());
-
-app.use(publicRoutes);
-app.use(privateRoutes);
-
-app.use((err: Error, _req: Request, res: Response, _next: NextFunction) => {
- console.error(err.stack);
- res.status(401).send('Unauthenticated!');
-});
-
-app.listen(port, () => {
- console.log(`Example app listening at http://localhost:${port}`);
-});
diff --git a/playground/express/src/views/home.ejs b/playground/express/src/views/home.ejs
deleted file mode 100644
index 7fe10c1bcc7..00000000000
--- a/playground/express/src/views/home.ejs
+++ /dev/null
@@ -1,18 +0,0 @@
-
-
-
-
-
-
-
-
-
-
diff --git a/playground/express/tsconfig.json b/playground/express/tsconfig.json
deleted file mode 100644
index 064ad8da546..00000000000
--- a/playground/express/tsconfig.json
+++ /dev/null
@@ -1,8 +0,0 @@
-{
- "compilerOptions": {
- "baseUrl": "",
- "moduleResolution": "NodeNext"
- },
- "exclude": ["node_modules", "tmp", "dist"],
- "extends": "../../tsconfig.json"
-}
diff --git a/playground/fastify/.env.sample b/playground/fastify/.env.sample
deleted file mode 100644
index 1886a694541..00000000000
--- a/playground/fastify/.env.sample
+++ /dev/null
@@ -1,4 +0,0 @@
-CLERK_PUBLISHABLE_KEY=
-CLERK_SECRET_KEY=
-PUBLIC_CLERK_SIGN_IN_URL=/sign-in
-FRONTEND_API_URL=
diff --git a/playground/fastify/.gitignore b/playground/fastify/.gitignore
deleted file mode 100644
index 5280f758c35..00000000000
--- a/playground/fastify/.gitignore
+++ /dev/null
@@ -1,35 +0,0 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-
-# dependencies
-/node_modules
-/.pnp
-.pnp.js
-
-# testing
-/coverage
-
-# next.js
-/.next/
-/out/
-
-# production
-/build
-
-# misc
-.DS_Store
-*.pem
-
-# debug
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-.pnpm-debug.log*
-
-# local env files
-.env
-
-# vercel
-.vercel
-
-# typescript
-*.tsbuildinfo
diff --git a/playground/fastify/README.md b/playground/fastify/README.md
deleted file mode 100644
index 248dac4e79a..00000000000
--- a/playground/fastify/README.md
+++ /dev/null
@@ -1,26 +0,0 @@
-# playground-fastify
-
-Use this example app to test `@clerk/fastify`.
-
-## Usage
-
-1. Install dependencies
-
-```shell
-npm install
-```
-
-1. Use [`@clerk/dev-cli`](https://github.com/clerk/javascript/tree/main/packages/dev-cli) to build all repository packages and install the local version into this playground.
-
-1. Start the server:
-
-```shell
-pnpm start
-```
-
-You can visit these routes:
-
-- `/`
-- `/sign-in`
-- `/me` (requires sign-in)
-- `/private` (requires sign-in)
\ No newline at end of file
diff --git a/playground/fastify/package.json b/playground/fastify/package.json
deleted file mode 100644
index 800c5457569..00000000000
--- a/playground/fastify/package.json
+++ /dev/null
@@ -1,25 +0,0 @@
-{
- "name": "@playground/fastify",
- "version": "0.1.0",
- "private": true,
- "scripts": {
- "start": "ts-node ./src/server.ts"
- },
- "dependencies": {
- "@clerk/backend": "workspace:*",
- "@clerk/fastify": "workspace:*",
- "@clerk/shared": "workspace:*",
- "@clerk/types": "workspace:*",
- "@fastify/view": "^10.0.1",
- "dotenv": "^16.4.5",
- "ejs": "^3.1.10",
- "fastify": "^5.0.0",
- "ts-node": "^10.9.2"
- },
- "devDependencies": {
- "@types/ejs": "^3.1.5",
- "@types/node": "^20.14.8",
- "tslib": "^2.7.0",
- "typescript": "5.0.4"
- }
-}
diff --git a/playground/fastify/src/loadEnv.ts b/playground/fastify/src/loadEnv.ts
deleted file mode 100644
index a4e52bbebb9..00000000000
--- a/playground/fastify/src/loadEnv.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-import * as dotenv from 'dotenv';
-dotenv.config({ path: ['.env.local', '.env.production', '.env'] });
diff --git a/playground/fastify/src/routes/index.ts b/playground/fastify/src/routes/index.ts
deleted file mode 100644
index 9db6a0dd54d..00000000000
--- a/playground/fastify/src/routes/index.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export * from './private';
-export * from './public';
diff --git a/playground/fastify/src/routes/private.ts b/playground/fastify/src/routes/private.ts
deleted file mode 100644
index d2bbeb94013..00000000000
--- a/playground/fastify/src/routes/private.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import type { FastifyReply, FastifyRequest, FastifyInstance } from 'fastify';
-import { clerkPlugin, getAuth } from '@clerk/fastify';
-
-export const privateRoutes = async (fastify: FastifyInstance, _opts: any) => {
- fastify.register(clerkPlugin);
-
- fastify.get('/me', async (req, _reply) => {
- return { auth: getAuth(req) };
- });
-
- fastify.get('/private', async (req: FastifyRequest, reply: FastifyReply) => {
- const auth = getAuth(req);
-
- if (!auth.userId) {
- return reply.code(403).send();
- }
-
- return { hello: 'world', auth };
- });
-};
diff --git a/playground/fastify/src/routes/public.ts b/playground/fastify/src/routes/public.ts
deleted file mode 100644
index cfefc2246e8..00000000000
--- a/playground/fastify/src/routes/public.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import type { FastifyInstance } from 'fastify';
-
-export const publicRoutes = async (fastify: FastifyInstance, _opts: any) => {
- fastify.get('/', async (_req, _reply) => {
- return { hello: 'world' };
- });
-
- fastify.get('/sign-in', async (_req, reply) => {
- return reply.viewAsync('/src/templates/sign-in.ejs', {
- CLERK_PUBLISHABLE_KEY: process.env.CLERK_PUBLISHABLE_KEY,
- PUBLIC_CLERK_SIGN_IN_URL: process.env.PUBLIC_CLERK_SIGN_IN_URL,
- FRONTEND_API_URL: process.env.FRONTEND_API_URL,
- });
- });
-};
diff --git a/playground/fastify/src/server.ts b/playground/fastify/src/server.ts
deleted file mode 100644
index 59a0f8d26a6..00000000000
--- a/playground/fastify/src/server.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import './loadEnv';
-
-import Fastify from 'fastify';
-import type { FastifyInstance } from 'fastify';
-import { privateRoutes, publicRoutes } from './routes';
-import FastifyView from '@fastify/view';
-import * as ejs from 'ejs';
-
-const server: FastifyInstance = Fastify({ logger: true });
-
-// ejs view engine to render templates
-server.register(FastifyView, { engine: { ejs } });
-
-// private routes (with clerkPlugin)
-server.register(privateRoutes);
-
-// public routes (without clerkPlugin)
-server.register(publicRoutes);
-
-const start = async () => {
- try {
- await server.listen({ port: 3000 });
- } catch (err) {
- server.log.error(err);
- process.exit(1);
- }
-};
-start();
diff --git a/playground/fastify/src/templates/sign-in.ejs b/playground/fastify/src/templates/sign-in.ejs
deleted file mode 100644
index f1e1be4eb30..00000000000
--- a/playground/fastify/src/templates/sign-in.ejs
+++ /dev/null
@@ -1,24 +0,0 @@
-
-
-
-
-
-
-
-
-
-
diff --git a/playground/fastify/tsconfig.json b/playground/fastify/tsconfig.json
deleted file mode 100644
index 6702ef852d4..00000000000
--- a/playground/fastify/tsconfig.json
+++ /dev/null
@@ -1,7 +0,0 @@
-{
- "compilerOptions": {
- "baseUrl": ""
- },
- "exclude": ["node_modules", "tmp", "dist"],
- "extends": "../../tsconfig.json"
-}
diff --git a/playground/nextjs/.env.example b/playground/nextjs/.env.example
deleted file mode 100644
index 923c9b7e0a7..00000000000
--- a/playground/nextjs/.env.example
+++ /dev/null
@@ -1,6 +0,0 @@
-NEXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_test_
-CLERK_SECRET_KEY=sk_test_
-NEXT_PUBLIC_CLERK_SIGN_IN_URL=/sign-in
-NEXT_PUBLIC_CLERK_SIGN_UP_URL=/sign-up
-NEXT_PUBLIC_CLERK_AFTER_SIGN_IN_URL=/
-NEXT_PUBLIC_CLERK_AFTER_SIGN_UP_URL=/
\ No newline at end of file
diff --git a/playground/nextjs/.gitignore b/playground/nextjs/.gitignore
deleted file mode 100644
index c87c9b392c0..00000000000
--- a/playground/nextjs/.gitignore
+++ /dev/null
@@ -1,36 +0,0 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-
-# dependencies
-/node_modules
-/.pnp
-.pnp.js
-
-# testing
-/coverage
-
-# next.js
-/.next/
-/out/
-
-# production
-/build
-
-# misc
-.DS_Store
-*.pem
-
-# debug
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-.pnpm-debug.log*
-
-# local env files
-.env*.local
-
-# vercel
-.vercel
-
-# typescript
-*.tsbuildinfo
-next-env.d.ts
diff --git a/playground/nextjs/.vscode/settings.json b/playground/nextjs/.vscode/settings.json
deleted file mode 100644
index d0679104bda..00000000000
--- a/playground/nextjs/.vscode/settings.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
- "typescript.tsdk": "node_modules/typescript/lib",
- "typescript.enablePromptUseWorkspaceTsdk": true
-}
\ No newline at end of file
diff --git a/playground/nextjs/README.md b/playground/nextjs/README.md
deleted file mode 100644
index 30b04287633..00000000000
--- a/playground/nextjs/README.md
+++ /dev/null
@@ -1,50 +0,0 @@
-This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
-
-## Setup
-
-At repository level:
-
-```bash
-pnpm build
-```
-
-At current directory level:
-
-```bash
-npm i
-```
-
-## Run development server
-
-```bash
-pnpm dev
-# or
-yarn dev
-```
-
-This starts your app in development mode, rebuilding assets on file changes.
-
-## Getting Started
-
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
-
-You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
-
-[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
-
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
-
-## Learn More
-
-To learn more about Next.js, take a look at the following resources:
-
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
-
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
-
-## Deploy on Vercel
-
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
-
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
diff --git a/playground/nextjs/app/api/route.ts b/playground/nextjs/app/api/route.ts
deleted file mode 100644
index e8c1f790c8c..00000000000
--- a/playground/nextjs/app/api/route.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { NextResponse } from 'next/server';
-
-export async function GET() {
- return NextResponse.json({});
-}
-
-export const revalidate = 50;
diff --git a/playground/nextjs/app/app-dir/client-component.tsx b/playground/nextjs/app/app-dir/client-component.tsx
deleted file mode 100644
index cc286b6ebb1..00000000000
--- a/playground/nextjs/app/app-dir/client-component.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-'use client';
-
-import React from 'react';
-import { isClerkAPIResponseError, isEmailLinkError, isKnownError, isMetamaskError } from '@clerk/nextjs/errors';
-
-export const ClientComponent = () => {
- React.useEffect(() => {
- console.log({ isClerkAPIResponseError, isEmailLinkError, isKnownError, isMetamaskError });
- });
- return
Client Component
;
-};
diff --git a/playground/nextjs/app/app-dir/client/page.tsx b/playground/nextjs/app/app-dir/client/page.tsx
deleted file mode 100644
index a3853dfefcd..00000000000
--- a/playground/nextjs/app/app-dir/client/page.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-'use client';
-import { Show } from '@clerk/nextjs';
-
-export default function Page() {
- return (
-