@usecontextlayer/sdk 0.14.0 → 0.14.2

package/README.md

@@ -1,6 +1,6 @@
 # @usecontextlayer/sdk
 
-ContextLayer integration for React Router apps: the shared document Layout and Tools/Viewer capabilities. In local development, tool calls execute through the ContextLayer platform using the manifest-selected viewer or app Owner's assigned Composio Platform connections.
+ContextLayer integration for React Router apps: the shared document Layout and Tools capability. In local development, tool calls execute through the ContextLayer platform using the manifest-selected viewer or app Owner's assigned Composio Platform connections.
 
 Create an app with `npx @usecontextlayer/cli init my-app`. The CLI installs this package and configures a development-only Cloudflare Worker and native service binding. Use the generated app's normal `pnpm dev` command. First-party `@usecontextlayer/*` packages are exempt from pnpm's release-age policy in generated projects.
 
@@ -10,19 +10,21 @@ Run `ctx login` to save your ContextLayer login. Declare `work-email` as a viewe
 
 For an organization-owned app's owner-mode requirement, authorize and list the account under the organization before assigning it. The connection commands' `--help` owns organization selection. The member completes OAuth for that Owner, and the platform uses the same organization's Composio identity when executing the requirement.
 
-When `pnpm dev` starts, `contextlayer(env)` from `@usecontextlayer/sdk/vite` configures the Cloudflare Vite plugin and calls the CLI-owned `getLocalToolsBindings` helper. This Node helper reads the AppID from Git origin, validates `public/slate.json`, and obtains a current access token using the same saved login as the CLI. The AppID, platform URL, auth issuer, access token, and manifest startup snapshot enter the existing local auxiliary Worker, which exports Tools and Viewer entrypoints. The refresh token stays in `~/.contextlayer/auth.json`; the Composio project key stays on the platform. Restart `pnpm dev` when the access token expires or the manifest changes.
+When `pnpm dev` starts, `contextlayer(env)` from `@usecontextlayer/sdk/vite` configures the Cloudflare Vite plugin and calls the CLI-owned `getLocalToolsBindings` helper. This Node helper reads the AppID from Git origin, validates `public/slate.json`, and obtains a current access token using the same saved login as the CLI. The AppID, typed CLI credential, and parsed manifest startup snapshot become native props on the Tools service binding. Only the platform URL enters the auxiliary Worker’s environment. The Worker re-exports the same Tools implementation used by dispatcher. The refresh token stays in `~/.contextlayer/auth.json`; the Composio project key stays on the platform. Restart `pnpm dev` when the access token expires or the manifest changes.
 
 ## App Layout
 
-The generated `app/root.tsx` re-exports the SDK's document Layout and root loader:
+The generated `app/root.tsx` re-exports the SDK's document Layout:
 
 ```tsx
-export { Layout, loader } from "@usecontextlayer/sdk/react"
+export { Layout } from "@usecontextlayer/sdk/react"
 ```
 
-The Layout owns the HTML document, React Router's metadata, links, scripts, scroll restoration, and the shared ContextLayer header. The app owns its routes, root component, error boundary, stylesheet, and font links. The thin, full-width header expands an inline settings panel, moving the app content down. Connection controls are not implemented yet.
+The Layout owns the HTML document, React Router's metadata, links, scripts, scroll restoration, and the shared ContextLayer header. The app owns its routes, root component, error boundary, stylesheet, and font links. The thin, full-width header has separate wordmark, connected-services, and viewer sections. The entire connected-services section toggles its inline connection tray, moving the app content down. The wordmark and identity are plain content; anonymous viewers see “Not signed in” without services controls. The tray lists required services and saved accounts, with account controls for Owners the viewer can manage.
 
-The header and settings panel render into a native ShadowRoot through a React portal after hydration. Vite processes `@usecontextlayer/sdk/styles.css?inline` into a stylesheet string, which is inserted only into that ShadowRoot; apps must not import the SDK stylesheet globally. The shadcn Base UI Collapsible owns the single header trigger, open state, accessibility, and panel lifecycle; its content remains in normal document flow. The lowercase wordmark uses the existing Fugaz One font through the browser's Font Loading API. The app's Tailwind and shadcn base-nova configuration are independent of these chrome styles. Chrome rendering lives in the SDK rather than being copied into each app or injected into HTML by the dispatcher.
+The header and tray are served by platform in a cross-origin iframe on slate.usecontextlayer.com. Platform owns their styles, Fugaz One font, and data loading. Layout receives only a height message and resizes the frame to keep the expanding tray in document flow. The app's Tailwind/shadcn setup is independent; there is no SDK stylesheet export or chrome root loader.
+
+The frame authenticates directly with the native web session. Its cookie always uses Secure, HttpOnly, and SameSite=None, in every environment. When browser third-party-cookie policy permits delivery, the existing web login authenticates the header automatically, without a separate sign-in or frame cookie. Web logout revokes subsequent frame authentication. The surrounding authored page receives neither credentials nor chrome data. S4 remains incomplete pending deployed private-app acceptance.
 
 ## A loader that reads Gmail
 
@@ -44,24 +46,9 @@ export async function loader({ context }: LoaderFunctionArgs) {
 
 Calls return `{ data, logId }`. Validate the tool-specific `data` in your loader. The complete [Gmail example](examples/gmail.tsx) validates the response with Zod and renders a message list. Copy it to `app/routes/home.tsx` in a generated app and assign your Gmail connection to `work-email`.
 
-## Current viewer
-
-Read the safe profile in a loader through the request-scoped Viewer capability:
-
-```ts
-import { viewerContext } from "@usecontextlayer/sdk"
-import type { LoaderFunctionArgs } from "react-router"
-
-export async function loader({ context }: LoaderFunctionArgs) {
-  return context.get(viewerContext).getCurrentUser()
-}
-```
-
-The result is `{ id, name, image }` with nullable image, or `null` for an anonymous viewer. Local Viewer sends the saved CLI access token directly to web's `/api/me`; hosted Viewer sends the existing viewer cookie to that same endpoint. `CTX_AUTH_ISSUER` determines web's origin. Web verifies identity; the capability validates its response with Zod. The app receives only profile data through RPC. No access token, session cookie, refresh token, or platform profile proxy is exposed. The SDK root loader reads this profile once and Layout consumes the root route data to show the avatar and name in the always-visible header. Anonymous viewers see “Not signed in”. The installed local loader has been verified through the native development Worker. Hosted WfP verification remains pending.
-
 ## Runtime ownership
 
-The package root exports the `Tools` and `Viewer` interfaces, `User` profile type, and `toolsContext`/`viewerContext`. `@usecontextlayer/sdk/react` exports the shared React Router document `Layout` and profile `loader`; `@usecontextlayer/sdk/styles.css` exports the chrome stylesheet for Vite to process and render inside the ShadowRoot. `@usecontextlayer/sdk/local` exports the local `Tools` and `Viewer` Worker entrypoints. `@usecontextlayer/sdk/worker` exports `createApp`, which creates the React Router request handler and supplies `toolsContext` and `viewerContext` from local bindings or production request props. The native default `viewerContext` returns null for anonymous viewers. `@usecontextlayer/sdk/vite` owns the `contextlayer` integration. The CLI package owns the Node startup helper and saved-login handling. The generated application supplies its virtual server-build import, mode, and development flag through thin Worker wiring, and composes Vite plugins. The Cloudflare Vite plugin runs the auxiliary Worker only in development; production bundles exclude it and its service binding.
+The package root exports the `Tools` interface and `toolsContext`. `@usecontextlayer/sdk/react` exports the shared document Layout, which mounts platform’s chrome iframe. `@usecontextlayer/sdk/local` bundles and re-exports the shared `Tools` Worker entrypoint, also used by dispatcher. `@usecontextlayer/sdk/worker` exports `createApp`, which creates the React Router request handler and supplies Tools from local bindings or production request props. `@usecontextlayer/sdk/vite` owns the `contextlayer` integration. The CLI package owns the Node startup helper and saved-login handling. The generated application supplies its virtual server-build import, mode, and development flag through thin Worker wiring. The Cloudflare Vite plugin runs the auxiliary Worker only in development; production bundles exclude it and its service binding. Profile and connection reads belong to the trusted chrome frame; the SDK exposes no Viewer or Connections capability.
 
 In hosted apps, the dispatcher supplies `ctx.props.tools` as a request-scoped RPC handle. Its methods call the same platform execution API using the viewer session; the app cannot read the underlying viewer credential. That session authenticates the caller, while the deployed manifest's mode selects the viewer or app Owner's assignment for the app and slug. For viewer-mode requirements, a viewer using the same account as the CLI uses the same saved assignment. Owner-mode requirements use the app Owner's configured account. Local access-token bindings are not included in production builds.
 
@@ -81,6 +68,14 @@ export default defineConfig((env) => ({
 }))
 ```
 
-This integration supplies the Cloudflare plugin; do not add a second instance. It uses the generated `workers/local-tools/wrangler.jsonc` to start the local Tools Worker and provides its development-only Tools and Viewer service bindings. At development startup, the CLI reads the app's Git origin, saved ContextLayer login, and validated manifest snapshot. The restart prerequisites are described under [Local login and assignment](#local-login-and-assignment). Production builds exclude local credentials and the auxiliary Worker.
+This integration supplies the Cloudflare plugin; do not add a second instance. It uses the generated `workers/local-tools/wrangler.jsonc` to start the local Tools Worker and provides its development-only Tools service binding. At development startup, the CLI reads the app's Git origin, saved ContextLayer login, and validated manifest snapshot. The restart prerequisites are described under [Local login and assignment](#local-login-and-assignment). Production builds exclude local credentials and the auxiliary Worker.
+
+The app retains its routes, `public/slate.json`, and thin Worker/configuration files. `@usecontextlayer/sdk/worker` owns the React Router request handler and capability context setup.
+
+## App requirements and saved assignments
+
+The platform frame loader reads the browser viewer's profile and requirement/assignment rows through the shared app-connection listing operation. Signed-in viewers can inspect their required services and select accounts through each row's controls. The connected-services status counts missing assignments; it does not validate provider status. Anonymous frames show “Not signed in” without a connection status or tray. These data stay in the frame.
+
+The canonical manifest and viewer/owner requirements live in `@usecontextlayer/shared/slate`. The neutral requirement/assignment response in `@usecontextlayer/shared/app-connections` is shared by platform and CLI. Selecting an account saves the assignment and React Router revalidates the tray automatically. Connect account opens authorization in a new tab; refresh the app page afterward to select the new account. Changes made elsewhere appear on the next frame load. The tray does not refresh the app's route data. The local Vite integration exposes the AppID, platform URL, and validated manifest snapshot as non-secret browser configuration; credentials remain behind the Tools service binding. Tools uses that same manifest startup snapshot. Restart development after editing requirements.
 
-The app retains its routes, `public/slate.json`, and thin Worker/configuration files. `@usecontextlayer/sdk/worker` owns the React Router request handler and Tools/Viewer context setup.
+`createApp` returns the exported `App` type from `@usecontextlayer/sdk/worker`, derived from Cloudflare's native `ExportedHandler` fetch contract. The SDK owns its local binding and request-props types. This gives the generated Worker a portable public declaration under the Cloudflare scaffold's composite TypeScript configuration.

package/dist/index.d.ts

@@ -1,2 +1,10 @@
-import { a as Viewer, i as User, n as toolsContext, r as viewerContext, t as Tools } from "./index-DbuYj6qS.js";
-export { Tools, type User, type Viewer, toolsContext, viewerContext };
+//#region index.d.ts
+export interface Tools {
+  call(slug: string, toolSlug: string, args: Record<string, unknown>): Promise<{
+    data: unknown;
+    logId: string;
+  }>;
+}
+export declare const toolsContext: import("react-router").RouterContext<Tools>;
+//#endregion
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","names":[],"sources":["../index.ts"],"mappings":";iBAEiB;EAChB,KACC,cACA,kBACA,MAAM,0BACJ;IAAU;IAAe;;;qBAGhB,qCAAY,cAAA"}

package/dist/index.js

@@ -1,8 +1,7 @@
 import { createContext } from "react-router";
 //#region index.ts
 const toolsContext = createContext();
-const viewerContext = createContext({ getCurrentUser: async () => null });
 //#endregion
-export { toolsContext, viewerContext };
+export { toolsContext };
 
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../index.ts"],"sourcesContent":["import { createContext } from \"react-router\"\nimport type { Viewer } from \"@/viewer\"\n\nexport type { User, Viewer } from \"@/viewer\"\n\nexport interface Tools {\n\tcall(\n\t\tslug: string,\n\t\ttoolSlug: string,\n\t\targs: Record<string, unknown>,\n\t): Promise<{ data: unknown; logId: string }>\n}\n\nexport const toolsContext = createContext<Tools>()\nexport const viewerContext = createContext<Viewer>({ getCurrentUser: async () => null })\n"],"mappings":";;AAaA,MAAa,eAAe,cAAqB;AACjD,MAAa,gBAAgB,cAAsB,EAAE,gBAAgB,YAAY,KAAK,CAAC"}
+{"version":3,"file":"index.js","names":[],"sources":["../index.ts"],"sourcesContent":["import { createContext } from \"react-router\"\n\nexport interface Tools {\n\tcall(\n\t\tslug: string,\n\t\ttoolSlug: string,\n\t\targs: Record<string, unknown>,\n\t): Promise<{ data: unknown; logId: string }>\n}\n\nexport const toolsContext = createContext<Tools>()\n"],"mappings":";;AAUA,MAAa,eAAe,cAAqB"}

package/dist/local.d.ts

@@ -1,37 +1,42 @@
-import { a as Viewer$1, t as Tools$1 } from "./index-DbuYj6qS.js";
-import { WorkerEntrypoint } from "cloudflare:workers";
 import { z } from "zod";
-//#region env.d.ts
-declare const schema: z.ZodObject<{
-  CTX_ACCESS_TOKEN: z.ZodString;
-  CTX_APP_ID: z.ZodUUID;
-  CTX_APP_MANIFEST: z.ZodPipe<z.ZodString, z.ZodTransform<{
-    connections: Record<string, {
-      mode: "owner" | "viewer";
-      toolkit: string;
+import { WorkerEntrypoint } from "cloudflare:workers";
+//#region ../shared/dist/slate.d.mts
+declare const slateSchema: z.ZodObject<{
+  connections: z.ZodRecord<z.ZodString, z.ZodObject<{
+    mode: z.ZodEnum<{
+      owner: "owner";
+      viewer: "viewer";
     }>;
-    secrets: Record<string, {
-      mode: "owner" | "viewer";
+    toolkit: z.ZodString;
+  }, z.core.$strict>>;
+  secrets: z.ZodDefault<z.ZodRecord<z.ZodString, z.ZodObject<{
+    mode: z.ZodEnum<{
+      owner: "owner";
+      viewer: "viewer";
     }>;
-  }, string>>;
-  CTX_AUTH_ISSUER: z.ZodURL;
-  CTX_PLATFORM_URL: z.ZodURL;
-}, z.core.$strip>;
-type Bindings = z.input<typeof schema>;
+  }, z.core.$strict>>>;
+}, z.core.$strict>;
+type Slate = z.infer<typeof slateSchema>;
+//#endregion
 //#endregion
-//#region local.d.ts
-export declare class Tools extends WorkerEntrypoint<Bindings> implements Tools$1 {
+//#region ../shared/dist/tools-worker.d.mts
+//#region lib/tools-worker.d.ts
+interface ToolsProps {
+  appId: string;
+  credential: {
+    token: string;
+    type: "access-token" | "session";
+  };
+  manifest?: Slate;
+}
+export declare class Tools extends WorkerEntrypoint<{
+  CTX_PLATFORM_URL: string;
+}, ToolsProps> {
   call(slug: string, toolSlug: string, args: Record<string, unknown>): Promise<{
     data: Record<string, unknown>;
     logId: string;
   }>;
 }
-export declare class Viewer extends WorkerEntrypoint<Bindings> implements Viewer$1 {
-  getCurrentUser(): Promise<{
-    id: string;
-    image: string | null;
-    name: string;
-  } | null>;
-}
+//#endregion
 //#endregion
 //# sourceMappingURL=local.d.ts.map

package/dist/local.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"local.d.ts","names":[],"sources":["../env.ts","../local.ts"],"mappings":";;;;cAGM,QAAM,EAAA;;;;;;;;;;;;;;GAMV,EAAA,KAAA;KACU,WAAW,EAAE,aAAa;;;qBCEzB,cAAc,iBAAiB,qBAAqB;EAC1D,KAAK,cAAc,kBAAkB,MAAM,0BAAuB;;;;;qBAyB5D,eAAe,iBAAiB,qBAAqB;EAC3D,kBAAc"}
+{"version":3,"file":"local.d.ts","names":[],"sources":["../../shared/dist/slate.d.mts","../../shared/dist/tools-worker.d.mts"],"mappings":";;;cAqBqB,aAAa,EAAE;EAClC,aAAa,EAAE,UAAU,EAAE,WAAW,EAAE;IACtC,MAAM,EAAE;MACN;MACA;;IAEF,SAAS,EAAE;KACV,EAAE,KAAK;EACV,SAAS,EAAE,WAAW,EAAE,UAAU,EAAE,WAAW,EAAE;IAC/C,MAAM,EAAE;MACN;MACA;;KAED,EAAE,KAAK;GACT,EAAE,KAAK;KACE,QAAQ,EAAE,aAAa;;;;;UCjClB;EACf;EACA;IACE;IACA;;EAEF,WAAW;;qBAEQ,cAAc;EACjC;GACC;EACD,KAAK,cAAc,kBAAkB,MAAM,0BAA0B;IACnE,MAAM;IACN"}

package/dist/local.js

@@ -1,36 +1,6 @@
-import { WorkerEntrypoint } from "cloudflare:workers";
 import { z } from "zod";
-//#region ../shared/dist/slate.mjs
-const credentialModeSchema = z.enum(["viewer", "owner"]);
-const connectionRequirementSchema = z.strictObject({
-	mode: credentialModeSchema,
-	toolkit: z.string().min(1)
-});
-const secretNameSchema = z.string().regex(/^[A-Z_][A-Z0-9_]*$/);
-const secretRequirementSchema = z.strictObject({ mode: credentialModeSchema });
-const slateSchema = z.strictObject({
-	connections: z.record(z.string().min(1), connectionRequirementSchema),
-	secrets: z.record(secretNameSchema, secretRequirementSchema).default({})
-});
-//#endregion
-//#region env.ts
-const schema = z.object({
-	CTX_ACCESS_TOKEN: z.string().min(1),
-	CTX_APP_ID: z.uuid(),
-	CTX_APP_MANIFEST: z.string().transform((value) => slateSchema.parse(JSON.parse(value))),
-	CTX_AUTH_ISSUER: z.url(),
-	CTX_PLATFORM_URL: z.url()
-});
-const parseEnv = (bindings) => schema.parse(bindings);
-//#endregion
-//#region viewer.ts
-const userSchema = z.object({
-	id: z.string().min(1),
-	image: z.string().nullable(),
-	name: z.string()
-});
-//#endregion
-//#region local.ts
+import { WorkerEntrypoint } from "cloudflare:workers";
+//#region ../shared/dist/tools-worker.mjs
 const execution = z.object({
 	data: z.record(z.string(), z.unknown()),
 	error: z.string().nullable(),
@@ -38,17 +8,17 @@ const execution = z.object({
 });
 var Tools = class extends WorkerEntrypoint {
 	async call(slug, toolSlug, args) {
-		const env = parseEnv(this.env);
-		const response = await fetch(new URL(`/api/apps/${env.CTX_APP_ID}/tools/call`, env.CTX_PLATFORM_URL), {
+		const { appId, credential, manifest } = this.ctx.props;
+		const response = await fetch(new URL(`/api/apps/${appId}/tools/call`, this.env.CTX_PLATFORM_URL), {
 			body: JSON.stringify({
 				arguments: args,
-				manifest: env.CTX_APP_MANIFEST,
+				manifest,
 				slug,
 				tool: toolSlug
 			}),
 			headers: {
-				authorization: `Bearer ${env.CTX_ACCESS_TOKEN}`,
-				"content-type": "application/json"
+				"content-type": "application/json",
+				...credential.type === "access-token" ? { authorization: `Bearer ${credential.token}` } : { cookie: `ctx-viewer-auth=${credential.token}` }
 			},
 			method: "POST"
 		});
@@ -61,16 +31,7 @@ var Tools = class extends WorkerEntrypoint {
 		};
 	}
 };
-var Viewer = class extends WorkerEntrypoint {
-	async getCurrentUser() {
-		const env = parseEnv(this.env);
-		const response = await fetch(new URL("/api/me", env.CTX_AUTH_ISSUER), { headers: { authorization: `Bearer ${env.CTX_ACCESS_TOKEN}` } });
-		if (response.status === 401) return null;
-		if (!response.ok) throw new Error(`Identity request failed: HTTP ${response.status}`);
-		return userSchema.parse(await response.json());
-	}
-};
 //#endregion
-export { Tools, Viewer };
+export { Tools };
 
 //# sourceMappingURL=local.js.map

package/dist/local.js.map

@@ -1 +1 @@
-{"version":3,"file":"local.js","names":[],"sources":["../../shared/dist/slate.mjs","../env.ts","../viewer.ts","../local.ts"],"sourcesContent":["import { z } from \"zod\";\n\n//#region lib/slate.ts\nconst credentialModeSchema = z.enum([\"viewer\", \"owner\"]);\nconst connectionRequirementSchema = z.strictObject({\n\tmode: credentialModeSchema,\n\ttoolkit: z.string().min(1)\n});\nconst secretNameSchema = z.string().regex(/^[A-Z_][A-Z0-9_]*$/);\nconst secretRequirementSchema = z.strictObject({ mode: credentialModeSchema });\nconst slateSchema = z.strictObject({\n\tconnections: z.record(z.string().min(1), connectionRequirementSchema),\n\tsecrets: z.record(secretNameSchema, secretRequirementSchema).default({})\n});\n\n//#endregion\nexport { connectionRequirementSchema, credentialModeSchema, secretNameSchema, secretRequirementSchema, slateSchema };","import { slateSchema } from \"@usecontextlayer/shared/slate\"\nimport { z } from \"zod\"\n\nconst schema = z.object({\n\tCTX_ACCESS_TOKEN: z.string().min(1),\n\tCTX_APP_ID: z.uuid(),\n\tCTX_APP_MANIFEST: z.string().transform((value) => slateSchema.parse(JSON.parse(value))),\n\tCTX_AUTH_ISSUER: z.url(),\n\tCTX_PLATFORM_URL: z.url(),\n})\nexport type Bindings = z.input<typeof schema>\nexport const parseEnv = (bindings: Bindings) => schema.parse(bindings)\n","import { z } from \"zod\"\n\nexport const userSchema = z.object({\n\tid: z.string().min(1),\n\timage: z.string().nullable(),\n\tname: z.string(),\n})\n\nexport type User = z.infer<typeof userSchema>\n\nexport interface Viewer {\n\tgetCurrentUser(): Promise<User | null>\n}\n","import { WorkerEntrypoint } from \"cloudflare:workers\"\nimport { z } from \"zod\"\nimport { type Bindings, parseEnv } from \"@/env\"\nimport type { Tools as ToolsContract } from \"@/index\"\nimport { userSchema, type Viewer as ViewerContract } from \"@/viewer\"\n\nconst execution = z.object({\n\tdata: z.record(z.string(), z.unknown()),\n\terror: z.string().nullable(),\n\tlogId: z.string(),\n})\n\nexport class Tools extends WorkerEntrypoint<Bindings> implements ToolsContract {\n\tasync call(slug: string, toolSlug: string, args: Record<string, unknown>) {\n\t\tconst env = parseEnv(this.env)\n\t\tconst response = await fetch(\n\t\t\tnew URL(`/api/apps/${env.CTX_APP_ID}/tools/call`, env.CTX_PLATFORM_URL),\n\t\t\t{\n\t\t\t\tbody: JSON.stringify({\n\t\t\t\t\targuments: args,\n\t\t\t\t\tmanifest: env.CTX_APP_MANIFEST,\n\t\t\t\t\tslug,\n\t\t\t\t\ttool: toolSlug,\n\t\t\t\t}),\n\t\t\t\theaders: {\n\t\t\t\t\tauthorization: `Bearer ${env.CTX_ACCESS_TOKEN}`,\n\t\t\t\t\t\"content-type\": \"application/json\",\n\t\t\t\t},\n\t\t\t\tmethod: \"POST\",\n\t\t\t},\n\t\t)\n\t\tif (!response.ok) throw new Error(`Tool call failed: HTTP ${response.status}`)\n\t\tconst result = execution.parse(await response.json())\n\t\tif (result.error !== null) throw new Error(`${result.error} (log: ${result.logId})`)\n\t\treturn { data: result.data, logId: result.logId }\n\t}\n}\n\nexport class Viewer extends WorkerEntrypoint<Bindings> implements ViewerContract {\n\tasync getCurrentUser() {\n\t\tconst env = parseEnv(this.env)\n\t\tconst response = await fetch(new URL(\"/api/me\", env.CTX_AUTH_ISSUER), {\n\t\t\theaders: { authorization: `Bearer ${env.CTX_ACCESS_TOKEN}` },\n\t\t})\n\t\tif (response.status === 401) return null\n\t\tif (!response.ok) throw new Error(`Identity request failed: HTTP ${response.status}`)\n\t\treturn userSchema.parse(await response.json())\n\t}\n}\n"],"mappings":";;;AAGA,MAAM,uBAAuB,EAAE,KAAK,CAAC,UAAU,OAAO,CAAC;AACvD,MAAM,8BAA8B,EAAE,aAAa;CAClD,MAAM;CACN,SAAS,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC;AAC1B,CAAC;AACD,MAAM,mBAAmB,EAAE,OAAO,CAAC,CAAC,MAAM,oBAAoB;AAC9D,MAAM,0BAA0B,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAC7E,MAAM,cAAc,EAAE,aAAa;CAClC,aAAa,EAAE,OAAO,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC,GAAG,2BAA2B;CACpE,SAAS,EAAE,OAAO,kBAAkB,uBAAuB,CAAC,CAAC,QAAQ,CAAC,CAAC;AACxE,CAAC;;;ACVD,MAAM,SAAS,EAAE,OAAO;CACvB,kBAAkB,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC;CAClC,YAAY,EAAE,KAAK;CACnB,kBAAkB,EAAE,OAAO,CAAC,CAAC,WAAW,UAAU,YAAY,MAAM,KAAK,MAAM,KAAK,CAAC,CAAC;CACtF,iBAAiB,EAAE,IAAI;CACvB,kBAAkB,EAAE,IAAI;AACzB,CAAC;AAED,MAAa,YAAY,aAAuB,OAAO,MAAM,QAAQ;;;ACTrE,MAAa,aAAa,EAAE,OAAO;CAClC,IAAI,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC;CACpB,OAAO,EAAE,OAAO,CAAC,CAAC,SAAS;CAC3B,MAAM,EAAE,OAAO;AAChB,CAAC;;;ACAD,MAAM,YAAY,EAAE,OAAO;CAC1B,MAAM,EAAE,OAAO,EAAE,OAAO,GAAG,EAAE,QAAQ,CAAC;CACtC,OAAO,EAAE,OAAO,CAAC,CAAC,SAAS;CAC3B,OAAO,EAAE,OAAO;AACjB,CAAC;AAED,IAAa,QAAb,cAA2B,iBAAoD;CAC9E,MAAM,KAAK,MAAc,UAAkB,MAA+B;EACzE,MAAM,MAAM,SAAS,KAAK,GAAG;EAC7B,MAAM,WAAW,MAAM,MACtB,IAAI,IAAI,aAAa,IAAI,WAAW,cAAc,IAAI,gBAAgB,GACtE;GACC,MAAM,KAAK,UAAU;IACpB,WAAW;IACX,UAAU,IAAI;IACd;IACA,MAAM;GACP,CAAC;GACD,SAAS;IACR,eAAe,UAAU,IAAI;IAC7B,gBAAgB;GACjB;GACA,QAAQ;EACT,CACD;EACA,IAAI,CAAC,SAAS,IAAI,MAAM,IAAI,MAAM,0BAA0B,SAAS,QAAQ;EAC7E,MAAM,SAAS,UAAU,MAAM,MAAM,SAAS,KAAK,CAAC;EACpD,IAAI,OAAO,UAAU,MAAM,MAAM,IAAI,MAAM,GAAG,OAAO,MAAM,SAAS,OAAO,MAAM,EAAE;EACnF,OAAO;GAAE,MAAM,OAAO;GAAM,OAAO,OAAO;EAAM;CACjD;AACD;AAEA,IAAa,SAAb,cAA4B,iBAAqD;CAChF,MAAM,iBAAiB;EACtB,MAAM,MAAM,SAAS,KAAK,GAAG;EAC7B,MAAM,WAAW,MAAM,MAAM,IAAI,IAAI,WAAW,IAAI,eAAe,GAAG,EACrE,SAAS,EAAE,eAAe,UAAU,IAAI,mBAAmB,EAC5D,CAAC;EACD,IAAI,SAAS,WAAW,KAAK,OAAO;EACpC,IAAI,CAAC,SAAS,IAAI,MAAM,IAAI,MAAM,iCAAiC,SAAS,QAAQ;EACpF,OAAO,WAAW,MAAM,MAAM,SAAS,KAAK,CAAC;CAC9C;AACD"}
+{"version":3,"file":"local.js","names":[],"sources":["../../shared/dist/tools-worker.mjs"],"sourcesContent":["import { z } from \"zod\";\nimport { WorkerEntrypoint } from \"cloudflare:workers\";\n\n//#region lib/tools-worker.ts\nconst execution = z.object({\n\tdata: z.record(z.string(), z.unknown()),\n\terror: z.string().nullable(),\n\tlogId: z.string()\n});\nvar Tools = class extends WorkerEntrypoint {\n\tasync call(slug, toolSlug, args) {\n\t\tconst { appId, credential, manifest } = this.ctx.props;\n\t\tconst response = await fetch(new URL(`/api/apps/${appId}/tools/call`, this.env.CTX_PLATFORM_URL), {\n\t\t\tbody: JSON.stringify({\n\t\t\t\targuments: args,\n\t\t\t\tmanifest,\n\t\t\t\tslug,\n\t\t\t\ttool: toolSlug\n\t\t\t}),\n\t\t\theaders: {\n\t\t\t\t\"content-type\": \"application/json\",\n\t\t\t\t...credential.type === \"access-token\" ? { authorization: `Bearer ${credential.token}` } : { cookie: `ctx-viewer-auth=${credential.token}` }\n\t\t\t},\n\t\t\tmethod: \"POST\"\n\t\t});\n\t\tif (!response.ok) throw new Error(`Tool call failed: HTTP ${response.status}`);\n\t\tconst result = execution.parse(await response.json());\n\t\tif (result.error !== null) throw new Error(`${result.error} (log: ${result.logId})`);\n\t\treturn {\n\t\t\tdata: result.data,\n\t\t\tlogId: result.logId\n\t\t};\n\t}\n};\n\n//#endregion\nexport { Tools };"],"mappings":";;;AAIA,MAAM,YAAY,EAAE,OAAO;CAC1B,MAAM,EAAE,OAAO,EAAE,OAAO,GAAG,EAAE,QAAQ,CAAC;CACtC,OAAO,EAAE,OAAO,CAAC,CAAC,SAAS;CAC3B,OAAO,EAAE,OAAO;AACjB,CAAC;AACD,IAAI,QAAQ,cAAc,iBAAiB;CAC1C,MAAM,KAAK,MAAM,UAAU,MAAM;EAChC,MAAM,EAAE,OAAO,YAAY,aAAa,KAAK,IAAI;EACjD,MAAM,WAAW,MAAM,MAAM,IAAI,IAAI,aAAa,MAAM,cAAc,KAAK,IAAI,gBAAgB,GAAG;GACjG,MAAM,KAAK,UAAU;IACpB,WAAW;IACX;IACA;IACA,MAAM;GACP,CAAC;GACD,SAAS;IACR,gBAAgB;IAChB,GAAG,WAAW,SAAS,iBAAiB,EAAE,eAAe,UAAU,WAAW,QAAQ,IAAI,EAAE,QAAQ,mBAAmB,WAAW,QAAQ;GAC3I;GACA,QAAQ;EACT,CAAC;EACD,IAAI,CAAC,SAAS,IAAI,MAAM,IAAI,MAAM,0BAA0B,SAAS,QAAQ;EAC7E,MAAM,SAAS,UAAU,MAAM,MAAM,SAAS,KAAK,CAAC;EACpD,IAAI,OAAO,UAAU,MAAM,MAAM,IAAI,MAAM,GAAG,OAAO,MAAM,SAAS,OAAO,MAAM,EAAE;EACnF,OAAO;GACN,MAAM,OAAO;GACb,OAAO,OAAO;EACf;CACD;AACD"}

package/dist/react.d.ts

@@ -1,13 +1,5 @@
-import { LoaderFunctionArgs } from "react-router";
 import { ReactNode } from "react";
 //#region react.d.ts
-export declare function loader({ context }: LoaderFunctionArgs): Promise<{
-  user: {
-    id: string;
-    image: string | null;
-    name: string;
-  } | null;
-}>;
 export declare function Layout({ children }: {
   children: ReactNode;
 }): import("react").JSX.Element;

package/dist/react.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"react.d.ts","names":[],"sources":["../react.tsx"],"mappings":";;;wBAsBsB,SAAS,WAAW,qBAAkB;;;;;;;wBAyF5C,SAAS;EAAc,UAAU;oBAAW,IAAA"}
+{"version":3,"file":"react.d.ts","names":[],"sources":["../react.tsx"],"mappings":";;wBA6CgB,SAAS;EAAc,UAAU;oBAAW,IAAA"}

package/dist/react.js

@@ -1,173 +1,59 @@
-import { viewerContext } from "./index.js";
-import { Links, Meta, Scripts, ScrollRestoration, useRouteLoaderData } from "react-router";
-import logoFont from "@fontsource/fugaz-one/files/fugaz-one-latin-400-normal.woff2?url";
-import chromeStyles from "@usecontextlayer/sdk/styles.css?inline";
-import { useCallback, useEffect, useState } from "react";
-import { createPortal } from "react-dom";
-import { Avatar } from "@base-ui/react/avatar";
-import { cn } from "cn";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Button } from "@base-ui/react/button";
-import { cva } from "class-variance-authority";
-import { Collapsible } from "@base-ui/react/collapsible";
-//#region components/ui/avatar.tsx
-function Avatar$1({ className, size = "default", ...props }) {
-	return /* @__PURE__ */ jsx(Avatar.Root, {
-		"data-slot": "avatar",
-		"data-size": size,
-		className: cn("group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten", className),
-		...props
-	});
-}
-function AvatarImage({ className, ...props }) {
-	return /* @__PURE__ */ jsx(Avatar.Image, {
-		"data-slot": "avatar-image",
-		className: cn("aspect-square size-full rounded-full object-cover", className),
-		...props
-	});
-}
-function AvatarFallback({ className, ...props }) {
-	return /* @__PURE__ */ jsx(Avatar.Fallback, {
-		"data-slot": "avatar-fallback",
-		className: cn("flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs", className),
-		...props
-	});
-}
-//#endregion
-//#region components/ui/button.tsx
-const buttonVariants = cva("group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
-	defaultVariants: {
-		size: "default",
-		variant: "default"
-	},
-	variants: {
-		size: {
-			default: "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
-			icon: "size-8",
-			"icon-lg": "size-9",
-			"icon-sm": "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
-			"icon-xs": "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
-			lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
-			sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
-			xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3"
-		},
-		variant: {
-			default: "bg-primary text-primary-foreground hover:bg-primary/80",
-			destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
-			ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
-			link: "text-primary underline-offset-4 hover:underline",
-			outline: "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
-			secondary: "bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground"
-		}
-	}
+import { Links, Meta, Scripts, ScrollRestoration } from "react-router";
+import { z } from "zod";
+import { useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region ../shared/dist/chrome.mjs
+const chromePath = "/dashboard/chrome";
+const chromeHeightSchema = z.object({
+	height: z.number().finite().nonnegative(),
+	type: z.literal("ctx:chrome:height")
 });
-function Button$1({ className, variant = "default", size = "default", ...props }) {
-	return /* @__PURE__ */ jsx(Button, {
-		"data-slot": "button",
-		className: cn(buttonVariants({
-			className,
-			size,
-			variant
-		})),
-		...props
-	});
-}
 //#endregion
-//#region components/ui/collapsible.tsx
-function Collapsible$1({ ...props }) {
-	return /* @__PURE__ */ jsx(Collapsible.Root, {
-		"data-slot": "collapsible",
-		...props
-	});
-}
-function CollapsibleTrigger({ ...props }) {
-	return /* @__PURE__ */ jsx(Collapsible.Trigger, {
-		"data-slot": "collapsible-trigger",
-		...props
-	});
-}
-function CollapsibleContent({ ...props }) {
-	return /* @__PURE__ */ jsx(Collapsible.Panel, {
-		"data-slot": "collapsible-content",
-		...props
-	});
-}
+//#region browser-env.ts
+const browserEnv = z.object({
+	CTX_APP_ID: z.uuid().optional(),
+	CTX_APP_MANIFEST: z.string().optional(),
+	CTX_PLATFORM_URL: z.url().default("https://slate.usecontextlayer.com")
+}).parse({
+	CTX_APP_ID: import.meta.env.CTX_APP_ID,
+	CTX_APP_MANIFEST: import.meta.env.CTX_APP_MANIFEST,
+	CTX_PLATFORM_URL: import.meta.env.CTX_PLATFORM_URL
+});
 //#endregion
 //#region react.tsx
-async function loader({ context }) {
-	return { user: await context.get(viewerContext).getCurrentUser() };
-}
-function Chrome({ user }) {
-	const [shadowRoot, setShadowRoot] = useState(null);
-	const attach = useCallback((host) => {
-		if (host) setShadowRoot(host.shadowRoot ?? host.attachShadow({ mode: "open" }));
-	}, []);
+function Chrome() {
+	const frame = useRef(null);
+	const [src, setSrc] = useState();
+	const [height, setHeight] = useState(30);
 	useEffect(() => {
-		const font = new FontFace("ContextLayer Logo", `url("${logoFont}")`, {
-			display: "swap",
-			weight: "400"
-		});
-		document.fonts.add(font);
-		font.load();
-		return () => {
-			document.fonts.delete(font);
-		};
+		const target = browserEnv.CTX_APP_ID ?? window.location.hostname;
+		const url = new URL(`${chromePath}/apps/${encodeURIComponent(target)}`, browserEnv.CTX_PLATFORM_URL);
+		url.searchParams.set("parentOrigin", window.location.origin);
+		if (browserEnv.CTX_APP_MANIFEST) url.searchParams.set("manifest", browserEnv.CTX_APP_MANIFEST);
+		function resize(event) {
+			if (event.origin !== url.origin || event.source !== frame.current?.contentWindow) return;
+			const message = chromeHeightSchema.safeParse(event.data);
+			if (message.success) setHeight(message.data.height);
+		}
+		window.addEventListener("message", resize);
+		setSrc(url.href);
+		return () => window.removeEventListener("message", resize);
 	}, []);
-	return /* @__PURE__ */ jsx("header", {
-		ref: attach,
-		children: shadowRoot && createPortal(/* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("style", { children: chromeStyles }), /* @__PURE__ */ jsxs(Collapsible$1, {
-			className: "group/chrome",
-			children: [/* @__PURE__ */ jsxs(CollapsibleTrigger, {
-				"aria-label": user ? `Toggle ContextLayer settings for ${user.name}` : "Toggle ContextLayer settings",
-				render: /* @__PURE__ */ jsx(Button$1, {
-					variant: "ghost",
-					className: "h-auto w-full justify-between gap-0 rounded-none border-x-0 border-t-0 border-b-slate-200 bg-slate-100 p-0 text-slate-600 hover:bg-slate-200 hover:text-slate-600 aria-expanded:bg-slate-100 aria-expanded:hover:bg-slate-200"
-				}),
-				children: [/* @__PURE__ */ jsx("span", {
-					className: "shrink-0 px-4 py-[6.5px] font-logo text-[13px]/4 font-normal text-slate-500",
-					children: "contextlayer"
-				}), /* @__PURE__ */ jsxs("span", {
-					className: "flex min-w-0 self-stretch",
-					children: [/* @__PURE__ */ jsxs("span", {
-						className: "flex shrink-0 items-center px-3 text-[13px]/4 font-normal text-slate-400",
-						children: [/* @__PURE__ */ jsx("span", {
-							className: "group-data-open/chrome:hidden",
-							children: "click to open"
-						}), /* @__PURE__ */ jsx("span", {
-							className: "hidden group-data-open/chrome:inline",
-							children: "click to close"
-						})]
-					}), /* @__PURE__ */ jsx("span", {
-						className: "flex min-w-0 items-center gap-2 border-l border-slate-200 py-[3px] pr-3 pl-[3px] text-[13px]/4 font-normal",
-						children: user ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsxs(Avatar$1, {
-							className: "size-[23px] rounded-[3px] after:rounded-[3px]",
-							children: [/* @__PURE__ */ jsx(AvatarImage, {
-								className: "rounded-[3px]",
-								src: user.image ?? void 0,
-								alt: ""
-							}), /* @__PURE__ */ jsx(AvatarFallback, {
-								className: "rounded-[3px] text-[13px]",
-								children: user.name.slice(0, 1)
-							})]
-						}), /* @__PURE__ */ jsx("span", {
-							className: "max-w-40 truncate",
-							title: user.name,
-							children: user.name
-						})] }) : /* @__PURE__ */ jsx("span", {
-							className: "truncate pl-[9px]",
-							children: "Not signed in"
-						})
-					})]
-				})]
-			}), /* @__PURE__ */ jsx(CollapsibleContent, {
-				className: "h-(--collapsible-panel-height) overflow-hidden bg-slate-100 transition-[height] duration-200 ease-out data-ending-style:h-0 data-starting-style:h-0 motion-reduce:transition-none",
-				children: /* @__PURE__ */ jsx("div", { className: "min-h-40 border-b border-slate-200" })
-			})]
-		})] }), shadowRoot)
+	return /* @__PURE__ */ jsx("iframe", {
+		ref: frame,
+		src,
+		title: "ContextLayer",
+		style: {
+			backgroundColor: "oklch(96.8% 0.007 247.896)",
+			border: 0,
+			borderBottom: "1px solid oklch(92.9% 0.013 255.508)",
+			display: "block",
+			height,
+			width: "100%"
+		}
 	});
 }
 function Layout({ children }) {
-	const data = useRouteLoaderData("root");
 	return /* @__PURE__ */ jsxs("html", {
 		lang: "en",
 		children: [/* @__PURE__ */ jsxs("head", { children: [
@@ -179,7 +65,7 @@ function Layout({ children }) {
 			/* @__PURE__ */ jsx(Meta, {}),
 			/* @__PURE__ */ jsx(Links, {})
 		] }), /* @__PURE__ */ jsxs("body", { children: [
-			/* @__PURE__ */ jsx(Chrome, { user: data?.user ?? null }),
+			/* @__PURE__ */ jsx(Chrome, {}),
 			children,
 			/* @__PURE__ */ jsx(ScrollRestoration, {}),
 			/* @__PURE__ */ jsx(Scripts, {})
@@ -187,6 +73,6 @@ function Layout({ children }) {
 	});
 }
 //#endregion
-export { Layout, loader };
+export { Layout };
 
 //# sourceMappingURL=react.js.map

package/dist/react.js.map

@@ -1 +1 @@
-{"version":3,"file":"react.js","names":["Avatar","AvatarPrimitive","Button","ButtonPrimitive","Collapsible","CollapsiblePrimitive","Collapsible","Button","Avatar"],"sources":["../components/ui/avatar.tsx","../components/ui/button.tsx","../components/ui/collapsible.tsx","../react.tsx"],"sourcesContent":["import { Avatar as AvatarPrimitive } from \"@base-ui/react/avatar\"\nimport { cn } from \"cn\"\nimport type * as React from \"react\"\n\nfunction Avatar({\n\tclassName,\n\tsize = \"default\",\n\t...props\n}: AvatarPrimitive.Root.Props & {\n\tsize?: \"default\" | \"sm\" | \"lg\"\n}) {\n\treturn (\n\t\t<AvatarPrimitive.Root\n\t\t\tdata-slot=\"avatar\"\n\t\t\tdata-size={size}\n\t\t\tclassName={cn(\n\t\t\t\t\"group/avatar relative flex size-8 shrink-0 rounded-full select-none after:absolute after:inset-0 after:rounded-full after:border after:border-border after:mix-blend-darken data-[size=lg]:size-10 data-[size=sm]:size-6 dark:after:mix-blend-lighten\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction AvatarImage({ className, ...props }: AvatarPrimitive.Image.Props) {\n\treturn (\n\t\t<AvatarPrimitive.Image\n\t\t\tdata-slot=\"avatar-image\"\n\t\t\tclassName={cn(\"aspect-square size-full rounded-full object-cover\", className)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction AvatarFallback({ className, ...props }: AvatarPrimitive.Fallback.Props) {\n\treturn (\n\t\t<AvatarPrimitive.Fallback\n\t\t\tdata-slot=\"avatar-fallback\"\n\t\t\tclassName={cn(\n\t\t\t\t\"flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction AvatarBadge({ className, ...props }: React.ComponentProps<\"span\">) {\n\treturn (\n\t\t<span\n\t\t\tdata-slot=\"avatar-badge\"\n\t\t\tclassName={cn(\n\t\t\t\t\"absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground bg-blend-color ring-2 ring-background select-none\",\n\t\t\t\t\"group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden\",\n\t\t\t\t\"group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2\",\n\t\t\t\t\"group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction AvatarGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"avatar-group\"\n\t\t\tclassName={cn(\n\t\t\t\t\"group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction AvatarGroupCount({ className, ...props }: React.ComponentProps<\"div\">) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"avatar-group-count\"\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport { Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage }\n","import { Button as ButtonPrimitive } from \"@base-ui/react/button\"\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\n\nconst buttonVariants = cva(\n\t\"group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t{\n\t\tdefaultVariants: {\n\t\t\tsize: \"default\",\n\t\t\tvariant: \"default\",\n\t\t},\n\t\tvariants: {\n\t\t\tsize: {\n\t\t\t\tdefault:\n\t\t\t\t\t\"h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n\t\t\t\ticon: \"size-8\",\n\t\t\t\t\"icon-lg\": \"size-9\",\n\t\t\t\t\"icon-sm\":\n\t\t\t\t\t\"size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg\",\n\t\t\t\t\"icon-xs\":\n\t\t\t\t\t\"size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3\",\n\t\t\t\tlg: \"h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2\",\n\t\t\t\tsm: \"h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5\",\n\t\t\t\txs: \"h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3\",\n\t\t\t},\n\t\t\tvariant: {\n\t\t\t\tdefault: \"bg-primary text-primary-foreground hover:bg-primary/80\",\n\t\t\t\tdestructive:\n\t\t\t\t\t\"bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40\",\n\t\t\t\tghost:\n\t\t\t\t\t\"hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50\",\n\t\t\t\tlink: \"text-primary underline-offset-4 hover:underline\",\n\t\t\t\toutline:\n\t\t\t\t\t\"border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50\",\n\t\t\t\tsecondary:\n\t\t\t\t\t\"bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground\",\n\t\t\t},\n\t\t},\n\t},\n)\n\nfunction Button({\n\tclassName,\n\tvariant = \"default\",\n\tsize = \"default\",\n\t...props\n}: ButtonPrimitive.Props & VariantProps<typeof buttonVariants>) {\n\treturn (\n\t\t<ButtonPrimitive\n\t\t\tdata-slot=\"button\"\n\t\t\tclassName={cn(buttonVariants({ className, size, variant }))}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport { Button, buttonVariants }\n","import { Collapsible as CollapsiblePrimitive } from \"@base-ui/react/collapsible\"\n\nfunction Collapsible({ ...props }: CollapsiblePrimitive.Root.Props) {\n\treturn (\n\t\t<CollapsiblePrimitive.Root\n\t\t\tdata-slot=\"collapsible\"\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction CollapsibleTrigger({ ...props }: CollapsiblePrimitive.Trigger.Props) {\n\treturn (\n\t\t<CollapsiblePrimitive.Trigger\n\t\t\tdata-slot=\"collapsible-trigger\"\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nfunction CollapsibleContent({ ...props }: CollapsiblePrimitive.Panel.Props) {\n\treturn (\n\t\t<CollapsiblePrimitive.Panel\n\t\t\tdata-slot=\"collapsible-content\"\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport { Collapsible, CollapsibleContent, CollapsibleTrigger }\n","import logoFont from \"@fontsource/fugaz-one/files/fugaz-one-latin-400-normal.woff2?url\"\nimport chromeStyles from \"@usecontextlayer/sdk/styles.css?inline\"\nimport { type ReactNode, useCallback, useEffect, useState } from \"react\"\nimport { createPortal } from \"react-dom\"\nimport {\n\tLinks,\n\ttype LoaderFunctionArgs,\n\tMeta,\n\tScripts,\n\tScrollRestoration,\n\tuseRouteLoaderData,\n} from \"react-router\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"@/components/ui/avatar\"\nimport { Button } from \"@/components/ui/button\"\nimport {\n\tCollapsible,\n\tCollapsibleContent,\n\tCollapsibleTrigger,\n} from \"@/components/ui/collapsible\"\nimport { viewerContext } from \"@/index\"\nimport type { User } from \"@/viewer\"\n\nexport async function loader({ context }: LoaderFunctionArgs) {\n\treturn { user: await context.get(viewerContext).getCurrentUser() }\n}\n\nfunction Chrome({ user }: { user: User | null }) {\n\tconst [shadowRoot, setShadowRoot] = useState<ShadowRoot | null>(null)\n\tconst attach = useCallback((host: HTMLElement | null) => {\n\t\tif (host) setShadowRoot(host.shadowRoot ?? host.attachShadow({ mode: \"open\" }))\n\t}, [])\n\n\tuseEffect(() => {\n\t\tconst font = new FontFace(\"ContextLayer Logo\", `url(\"${logoFont}\")`, {\n\t\t\tdisplay: \"swap\",\n\t\t\tweight: \"400\",\n\t\t})\n\t\tdocument.fonts.add(font)\n\t\tvoid font.load()\n\t\treturn () => {\n\t\t\tdocument.fonts.delete(font)\n\t\t}\n\t}, [])\n\n\treturn (\n\t\t<header ref={attach}>\n\t\t\t{shadowRoot &&\n\t\t\t\tcreatePortal(\n\t\t\t\t\t<>\n\t\t\t\t\t\t<style>{chromeStyles}</style>\n\t\t\t\t\t\t<Collapsible className=\"group/chrome\">\n\t\t\t\t\t\t\t<CollapsibleTrigger\n\t\t\t\t\t\t\t\taria-label={\n\t\t\t\t\t\t\t\t\tuser\n\t\t\t\t\t\t\t\t\t\t? `Toggle ContextLayer settings for ${user.name}`\n\t\t\t\t\t\t\t\t\t\t: \"Toggle ContextLayer settings\"\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\trender={\n\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\t\t\t\t\tclassName=\"h-auto w-full justify-between gap-0 rounded-none border-x-0 border-t-0 border-b-slate-200 bg-slate-100 p-0 text-slate-600 hover:bg-slate-200 hover:text-slate-600 aria-expanded:bg-slate-100 aria-expanded:hover:bg-slate-200\"\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span className=\"shrink-0 px-4 py-[6.5px] font-logo text-[13px]/4 font-normal text-slate-500\">\n\t\t\t\t\t\t\t\t\tcontextlayer\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t<span className=\"flex min-w-0 self-stretch\">\n\t\t\t\t\t\t\t\t\t<span className=\"flex shrink-0 items-center px-3 text-[13px]/4 font-normal text-slate-400\">\n\t\t\t\t\t\t\t\t\t\t<span className=\"group-data-open/chrome:hidden\">click to open</span>\n\t\t\t\t\t\t\t\t\t\t<span className=\"hidden group-data-open/chrome:inline\">\n\t\t\t\t\t\t\t\t\t\t\tclick to close\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t<span className=\"flex min-w-0 items-center gap-2 border-l border-slate-200 py-[3px] pr-3 pl-[3px] text-[13px]/4 font-normal\">\n\t\t\t\t\t\t\t\t\t\t{user ? (\n\t\t\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t\t\t<Avatar className=\"size-[23px] rounded-[3px] after:rounded-[3px]\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<AvatarImage\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"rounded-[3px]\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tsrc={user.image ?? undefined}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t\t<AvatarFallback className=\"rounded-[3px] text-[13px]\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{user.name.slice(0, 1)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</AvatarFallback>\n\t\t\t\t\t\t\t\t\t\t\t\t</Avatar>\n\t\t\t\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"max-w-40 truncate\"\n\t\t\t\t\t\t\t\t\t\t\t\t\ttitle={user.name}\n\t\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{user.name}\n\t\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"truncate pl-[9px]\">Not signed in</span>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</CollapsibleTrigger>\n\t\t\t\t\t\t\t<CollapsibleContent className=\"h-(--collapsible-panel-height) overflow-hidden bg-slate-100 transition-[height] duration-200 ease-out data-ending-style:h-0 data-starting-style:h-0 motion-reduce:transition-none\">\n\t\t\t\t\t\t\t\t<div className=\"min-h-40 border-b border-slate-200\" />\n\t\t\t\t\t\t\t</CollapsibleContent>\n\t\t\t\t\t\t</Collapsible>\n\t\t\t\t\t</>,\n\t\t\t\t\tshadowRoot,\n\t\t\t\t)}\n\t\t</header>\n\t)\n}\n\nexport function Layout({ children }: { children: ReactNode }) {\n\tconst data = useRouteLoaderData<typeof loader>(\"root\")\n\treturn (\n\t\t<html lang=\"en\">\n\t\t\t<head>\n\t\t\t\t<meta charSet=\"utf-8\" />\n\t\t\t\t<meta\n\t\t\t\t\tname=\"viewport\"\n\t\t\t\t\tcontent=\"width=device-width, initial-scale=1\"\n\t\t\t\t/>\n\t\t\t\t<Meta />\n\t\t\t\t<Links />\n\t\t\t</head>\n\t\t\t<body>\n\t\t\t\t<Chrome user={data?.user ?? null} />\n\t\t\t\t{children}\n\t\t\t\t<ScrollRestoration />\n\t\t\t\t<Scripts />\n\t\t\t</body>\n\t\t</html>\n\t)\n}\n"],"mappings":";;;;;;;;;;;;;AAIA,SAASA,SAAO,EACf,WACA,OAAO,WACP,GAAG,SAGD;CACF,OACC,oBAACC,OAAgB,MAAjB;EACC,aAAU;EACV,aAAW;EACX,WAAW,GACV,yPACA,SACD;EACA,GAAI;CACJ,CAAA;AAEH;AAEA,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;CAC1E,OACC,oBAACA,OAAgB,OAAjB;EACC,aAAU;EACV,WAAW,GAAG,qDAAqD,SAAS;EAC5E,GAAI;CACJ,CAAA;AAEH;AAEA,SAAS,eAAe,EAAE,WAAW,GAAG,SAAyC;CAChF,OACC,oBAACA,OAAgB,UAAjB;EACC,aAAU;EACV,WAAW,GACV,sIACA,SACD;EACA,GAAI;CACJ,CAAA;AAEH;;;ACzCA,MAAM,iBAAiB,IACtB,8lBACA;CACC,iBAAiB;EAChB,MAAM;EACN,SAAS;CACV;CACA,UAAU;EACT,MAAM;GACL,SACC;GACD,MAAM;GACN,WAAW;GACX,WACC;GACD,WACC;GACD,IAAI;GACJ,IAAI;GACJ,IAAI;EACL;EACA,SAAS;GACR,SAAS;GACT,aACC;GACD,OACC;GACD,MAAM;GACN,SACC;GACD,WACC;EACF;CACD;AACD,CACD;AAEA,SAASC,SAAO,EACf,WACA,UAAU,WACV,OAAO,WACP,GAAG,SAC4D;CAC/D,OACC,oBAACC,QAAD;EACC,aAAU;EACV,WAAW,GAAG,eAAe;GAAE;GAAW;GAAM;EAAQ,CAAC,CAAC;EAC1D,GAAI;CACJ,CAAA;AAEH;;;ACpDA,SAASC,cAAY,EAAE,GAAG,SAA0C;CACnE,OACC,oBAACC,YAAqB,MAAtB;EACC,aAAU;EACV,GAAI;CACJ,CAAA;AAEH;AAEA,SAAS,mBAAmB,EAAE,GAAG,SAA6C;CAC7E,OACC,oBAACA,YAAqB,SAAtB;EACC,aAAU;EACV,GAAI;CACJ,CAAA;AAEH;AAEA,SAAS,mBAAmB,EAAE,GAAG,SAA2C;CAC3E,OACC,oBAACA,YAAqB,OAAtB;EACC,aAAU;EACV,GAAI;CACJ,CAAA;AAEH;;;ACLA,eAAsB,OAAO,EAAE,WAA+B;CAC7D,OAAO,EAAE,MAAM,MAAM,QAAQ,IAAI,aAAa,CAAC,CAAC,eAAe,EAAE;AAClE;AAEA,SAAS,OAAO,EAAE,QAA+B;CAChD,MAAM,CAAC,YAAY,iBAAiB,SAA4B,IAAI;CACpE,MAAM,SAAS,aAAa,SAA6B;EACxD,IAAI,MAAM,cAAc,KAAK,cAAc,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC,CAAC;CAC/E,GAAG,CAAC,CAAC;CAEL,gBAAgB;EACf,MAAM,OAAO,IAAI,SAAS,qBAAqB,QAAQ,SAAS,KAAK;GACpE,SAAS;GACT,QAAQ;EACT,CAAC;EACD,SAAS,MAAM,IAAI,IAAI;EACvB,KAAU,KAAK;EACf,aAAa;GACZ,SAAS,MAAM,OAAO,IAAI;EAC3B;CACD,GAAG,CAAC,CAAC;CAEL,OACC,oBAAC,UAAD;EAAQ,KAAK;EACX,UAAA,cACA,aACC,qBAAA,UAAA,EAAA,UAAA,CACC,oBAAC,SAAD,EAAA,UAAQ,aAAoB,CAAA,GAC5B,qBAACC,eAAD;GAAa,WAAU;GAAvB,UAAA,CACC,qBAAC,oBAAD;IACC,cACC,OACG,oCAAoC,KAAK,SACzC;IAEJ,QACC,oBAACC,UAAD;KACC,SAAQ;KACR,WAAU;IACV,CAAA;IAVH,UAAA,CAaC,oBAAC,QAAD;KAAM,WAAU;KAA8E,UAAA;IAExF,CAAA,GACN,qBAAC,QAAD;KAAM,WAAU;KAAhB,UAAA,CACC,qBAAC,QAAD;MAAM,WAAU;MAAhB,UAAA,CACC,oBAAC,QAAD;OAAM,WAAU;OAAgC,UAAA;MAAmB,CAAA,GACnE,oBAAC,QAAD;OAAM,WAAU;OAAuC,UAAA;MAEjD,CAAA,CACD;KACN,CAAA,GAAA,oBAAC,QAAD;MAAM,WAAU;MACd,UAAA,OACA,qBAAA,UAAA,EAAA,UAAA,CACC,qBAACC,UAAD;OAAQ,WAAU;OAAlB,UAAA,CACC,oBAAC,aAAD;QACC,WAAU;QACV,KAAK,KAAK,SAAS,KAAA;QACnB,KAAI;OACJ,CAAA,GACD,oBAAC,gBAAD;QAAgB,WAAU;QACxB,UAAA,KAAK,KAAK,MAAM,GAAG,CAAC;OACN,CAAA,CACT;MACR,CAAA,GAAA,oBAAC,QAAD;OACC,WAAU;OACV,OAAO,KAAK;OAEX,UAAA,KAAK;MACD,CAAA,CACL,EAAA,CAAA,IAEF,oBAAC,QAAD;OAAM,WAAU;OAAoB,UAAA;MAAmB,CAAA;KAEnD,CAAA,CACD;IACa,CAAA,CAAA;GACpB,CAAA,GAAA,oBAAC,oBAAD;IAAoB,WAAU;IAC7B,UAAA,oBAAC,OAAD,EAAK,WAAU,qCAAsC,CAAA;GAClC,CAAA,CACR;EACZ,CAAA,CAAA,EAAA,CAAA,GACF,UACD;CACM,CAAA;AAEV;AAEA,SAAgB,OAAO,EAAE,YAAqC;CAC7D,MAAM,OAAO,mBAAkC,MAAM;CACrD,OACC,qBAAC,QAAD;EAAM,MAAK;EAAX,UAAA,CACC,qBAAC,QAAD,EAAA,UAAA;GACC,oBAAC,QAAD,EAAM,SAAQ,QAAS,CAAA;GACvB,oBAAC,QAAD;IACC,MAAK;IACL,SAAQ;GACR,CAAA;GACD,oBAAC,MAAD,CAAO,CAAA;GACP,oBAAC,OAAD,CAAQ,CAAA;EACH,EAAA,CAAA,GACN,qBAAC,QAAD,EAAA,UAAA;GACC,oBAAC,QAAD,EAAQ,MAAM,MAAM,QAAQ,KAAO,CAAA;GAClC;GACD,oBAAC,mBAAD,CAAoB,CAAA;GACpB,oBAAC,SAAD,CAAU,CAAA;EACL,EAAA,CAAA,CACD;;AAER"}
+{"version":3,"file":"react.js","names":[],"sources":["../../shared/dist/chrome.mjs","../browser-env.ts","../react.tsx"],"sourcesContent":["import { z } from \"zod\";\n\n//#region lib/chrome.ts\nconst chromePath = \"/dashboard/chrome\";\nconst chromeHeightSchema = z.object({\n\theight: z.number().finite().nonnegative(),\n\ttype: z.literal(\"ctx:chrome:height\")\n});\n\n//#endregion\nexport { chromeHeightSchema, chromePath };","import { z } from \"zod\"\n\nexport const browserEnv = z\n\t.object({\n\t\tCTX_APP_ID: z.uuid().optional(),\n\t\tCTX_APP_MANIFEST: z.string().optional(),\n\t\tCTX_PLATFORM_URL: z.url().default(\"https://slate.usecontextlayer.com\"),\n\t})\n\t.parse({\n\t\tCTX_APP_ID: import.meta.env.CTX_APP_ID,\n\t\tCTX_APP_MANIFEST: import.meta.env.CTX_APP_MANIFEST,\n\t\tCTX_PLATFORM_URL: import.meta.env.CTX_PLATFORM_URL,\n\t})\n","import { chromeHeightSchema, chromePath } from \"@usecontextlayer/shared/chrome\"\nimport { type ReactNode, useEffect, useRef, useState } from \"react\"\nimport { Links, Meta, Scripts, ScrollRestoration } from \"react-router\"\nimport { browserEnv } from \"@/browser-env\"\n\nfunction Chrome() {\n\tconst frame = useRef<HTMLIFrameElement>(null)\n\tconst [src, setSrc] = useState<string>()\n\tconst [height, setHeight] = useState(30)\n\tuseEffect(() => {\n\t\tconst target = browserEnv.CTX_APP_ID ?? window.location.hostname\n\t\tconst url = new URL(\n\t\t\t`${chromePath}/apps/${encodeURIComponent(target)}`,\n\t\t\tbrowserEnv.CTX_PLATFORM_URL,\n\t\t)\n\t\turl.searchParams.set(\"parentOrigin\", window.location.origin)\n\t\tif (browserEnv.CTX_APP_MANIFEST)\n\t\t\turl.searchParams.set(\"manifest\", browserEnv.CTX_APP_MANIFEST)\n\t\tfunction resize(event: MessageEvent) {\n\t\t\tif (event.origin !== url.origin || event.source !== frame.current?.contentWindow)\n\t\t\t\treturn\n\t\t\tconst message = chromeHeightSchema.safeParse(event.data)\n\t\t\tif (message.success) setHeight(message.data.height)\n\t\t}\n\t\twindow.addEventListener(\"message\", resize)\n\t\tsetSrc(url.href)\n\t\treturn () => window.removeEventListener(\"message\", resize)\n\t}, [])\n\treturn (\n\t\t<iframe\n\t\t\tref={frame}\n\t\t\tsrc={src}\n\t\t\ttitle=\"ContextLayer\"\n\t\t\tstyle={{\n\t\t\t\tbackgroundColor: \"oklch(96.8% 0.007 247.896)\",\n\t\t\t\tborder: 0,\n\t\t\t\tborderBottom: \"1px solid oklch(92.9% 0.013 255.508)\",\n\t\t\t\tdisplay: \"block\",\n\t\t\t\theight,\n\t\t\t\twidth: \"100%\",\n\t\t\t}}\n\t\t/>\n\t)\n}\n\nexport function Layout({ children }: { children: ReactNode }) {\n\treturn (\n\t\t<html lang=\"en\">\n\t\t\t<head>\n\t\t\t\t<meta charSet=\"utf-8\" />\n\t\t\t\t<meta\n\t\t\t\t\tname=\"viewport\"\n\t\t\t\t\tcontent=\"width=device-width, initial-scale=1\"\n\t\t\t\t/>\n\t\t\t\t<Meta />\n\t\t\t\t<Links />\n\t\t\t</head>\n\t\t\t<body>\n\t\t\t\t<Chrome />\n\t\t\t\t{children}\n\t\t\t\t<ScrollRestoration />\n\t\t\t\t<Scripts />\n\t\t\t</body>\n\t\t</html>\n\t)\n}\n"],"mappings":";;;;;AAGA,MAAM,aAAa;AACnB,MAAM,qBAAqB,EAAE,OAAO;CACnC,QAAQ,EAAE,OAAO,CAAC,CAAC,OAAO,CAAC,CAAC,YAAY;CACxC,MAAM,EAAE,QAAQ,mBAAmB;AACpC,CAAC;;;ACLD,MAAa,aAAa,EACxB,OAAO;CACP,YAAY,EAAE,KAAK,CAAC,CAAC,SAAS;CAC9B,kBAAkB,EAAE,OAAO,CAAC,CAAC,SAAS;CACtC,kBAAkB,EAAE,IAAI,CAAC,CAAC,QAAQ,mCAAmC;AACtE,CAAC,CAAC,CACD,MAAM;CACN,YAAY,YAAY,IAAI;CAC5B,kBAAkB,YAAY,IAAI;CAClC,kBAAkB,YAAY,IAAI;AACnC,CAAC;;;ACPF,SAAS,SAAS;CACjB,MAAM,QAAQ,OAA0B,IAAI;CAC5C,MAAM,CAAC,KAAK,UAAU,SAAiB;CACvC,MAAM,CAAC,QAAQ,aAAa,SAAS,EAAE;CACvC,gBAAgB;EACf,MAAM,SAAS,WAAW,cAAc,OAAO,SAAS;EACxD,MAAM,MAAM,IAAI,IACf,GAAG,WAAW,QAAQ,mBAAmB,MAAM,KAC/C,WAAW,gBACZ;EACA,IAAI,aAAa,IAAI,gBAAgB,OAAO,SAAS,MAAM;EAC3D,IAAI,WAAW,kBACd,IAAI,aAAa,IAAI,YAAY,WAAW,gBAAgB;EAC7D,SAAS,OAAO,OAAqB;GACpC,IAAI,MAAM,WAAW,IAAI,UAAU,MAAM,WAAW,MAAM,SAAS,eAClE;GACD,MAAM,UAAU,mBAAmB,UAAU,MAAM,IAAI;GACvD,IAAI,QAAQ,SAAS,UAAU,QAAQ,KAAK,MAAM;EACnD;EACA,OAAO,iBAAiB,WAAW,MAAM;EACzC,OAAO,IAAI,IAAI;EACf,aAAa,OAAO,oBAAoB,WAAW,MAAM;CAC1D,GAAG,CAAC,CAAC;CACL,OACC,oBAAC,UAAD;EACC,KAAK;EACA;EACL,OAAM;EACN,OAAO;GACN,iBAAiB;GACjB,QAAQ;GACR,cAAc;GACd,SAAS;GACT;GACA,OAAO;EACR;CACA,CAAA;AAEH;AAEA,SAAgB,OAAO,EAAE,YAAqC;CAC7D,OACC,qBAAC,QAAD;EAAM,MAAK;EAAX,UAAA,CACC,qBAAC,QAAD,EAAA,UAAA;GACC,oBAAC,QAAD,EAAM,SAAQ,QAAS,CAAA;GACvB,oBAAC,QAAD;IACC,MAAK;IACL,SAAQ;GACR,CAAA;GACD,oBAAC,MAAD,CAAO,CAAA;GACP,oBAAC,OAAD,CAAQ,CAAA;EACH,EAAA,CAAA,GACN,qBAAC,QAAD,EAAA,UAAA;GACC,oBAAC,QAAD,CAAS,CAAA;GACR;GACD,oBAAC,mBAAD,CAAoB,CAAA;GACpB,oBAAC,SAAD,CAAU,CAAA;EACL,EAAA,CAAA,CACD;;AAER"}

package/dist/vite.d.ts

@@ -1,5 +1,14 @@
 import { ConfigEnv } from "vite";
 //#region vite.d.ts
-export declare function contextlayer({ command }: ConfigEnv): Promise<import("vite").Plugin<any>[]>;
+export declare function contextlayer({ command }: ConfigEnv): Promise<(import("vite").Plugin<any>[] | {
+  config: () => {
+    define: {
+      "import.meta.env.CTX_APP_ID": string;
+      "import.meta.env.CTX_APP_MANIFEST": string;
+      "import.meta.env.CTX_PLATFORM_URL": string;
+    };
+  };
+  name: string;
+})[]>;
 //#endregion
 //# sourceMappingURL=vite.d.ts.map

package/dist/vite.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vite.d.ts","names":[],"sources":["../vite.ts"],"mappings":";;wBAIsB,eAAe,WAAW,YAAS,uBAAA"}
+{"version":3,"file":"vite.d.ts","names":[],"sources":["../vite.ts"],"mappings":";;wBAIsB,eAAe,WAAW,YAAS,wBAAA;;IAKrD;MACC;MAEA;MAEA"}

package/dist/vite.js

@@ -2,23 +2,28 @@ import { cloudflare } from "@cloudflare/vite-plugin";
 import { getLocalToolsBindings } from "@usecontextlayer/cli/vite";
 //#region vite.ts
 async function contextlayer({ command }) {
-	return cloudflare({
+	const bindings = command === "serve" ? await getLocalToolsBindings() : void 0;
+	return [{
+		config: () => ({ define: {
+			"import.meta.env.CTX_APP_ID": JSON.stringify(bindings?.props.appId) ?? "undefined",
+			"import.meta.env.CTX_APP_MANIFEST": JSON.stringify(JSON.stringify(bindings?.props.manifest)) ?? "undefined",
+			"import.meta.env.CTX_PLATFORM_URL": JSON.stringify(bindings?.vars.CTX_PLATFORM_URL) ?? "undefined"
+		} }),
+		name: "contextlayer-chrome"
+	}, cloudflare({
 		auxiliaryWorkers: [{
-			config: command === "serve" ? { vars: await getLocalToolsBindings() } : {},
+			config: bindings ? { vars: bindings.vars } : {},
 			configPath: "workers/local-tools/wrangler.jsonc",
 			devOnly: true
 		}],
-		config: command === "serve" ? { services: [{
+		config: bindings ? { services: [{
 			binding: "TOOLS",
 			entrypoint: "Tools",
-			service: "ctx-local-tools"
-		}, {
-			binding: "VIEWER",
-			entrypoint: "Viewer",
+			props: bindings.props,
 			service: "ctx-local-tools"
 		}] } : {},
 		viteEnvironment: { name: "ssr" }
-	});
+	})];
 }
 //#endregion
 export { contextlayer };

package/dist/vite.js.map

@@ -1 +1 @@
-{"version":3,"file":"vite.js","names":[],"sources":["../vite.ts"],"sourcesContent":["import { cloudflare } from \"@cloudflare/vite-plugin\"\nimport { getLocalToolsBindings } from \"@usecontextlayer/cli/vite\"\nimport type { ConfigEnv } from \"vite\"\n\nexport async function contextlayer({ command }: ConfigEnv) {\n\treturn cloudflare({\n\t\tauxiliaryWorkers: [\n\t\t\t{\n\t\t\t\tconfig: command === \"serve\" ? { vars: await getLocalToolsBindings() } : {},\n\t\t\t\tconfigPath: \"workers/local-tools/wrangler.jsonc\",\n\t\t\t\tdevOnly: true,\n\t\t\t},\n\t\t],\n\t\tconfig:\n\t\t\tcommand === \"serve\"\n\t\t\t\t? {\n\t\t\t\t\t\tservices: [\n\t\t\t\t\t\t\t{ binding: \"TOOLS\", entrypoint: \"Tools\", service: \"ctx-local-tools\" },\n\t\t\t\t\t\t\t{ binding: \"VIEWER\", entrypoint: \"Viewer\", service: \"ctx-local-tools\" },\n\t\t\t\t\t\t],\n\t\t\t\t\t}\n\t\t\t\t: {},\n\t\tviteEnvironment: { name: \"ssr\" },\n\t})\n}\n"],"mappings":";;;AAIA,eAAsB,aAAa,EAAE,WAAsB;CAC1D,OAAO,WAAW;EACjB,kBAAkB,CACjB;GACC,QAAQ,YAAY,UAAU,EAAE,MAAM,MAAM,sBAAsB,EAAE,IAAI,CAAC;GACzE,YAAY;GACZ,SAAS;EACV,CACD;EACA,QACC,YAAY,UACT,EACA,UAAU,CACT;GAAE,SAAS;GAAS,YAAY;GAAS,SAAS;EAAkB,GACpE;GAAE,SAAS;GAAU,YAAY;GAAU,SAAS;EAAkB,CACvE,EACD,IACC,CAAC;EACL,iBAAiB,EAAE,MAAM,MAAM;CAChC,CAAC;AACF"}
+{"version":3,"file":"vite.js","names":[],"sources":["../vite.ts"],"sourcesContent":["import { cloudflare } from \"@cloudflare/vite-plugin\"\nimport { getLocalToolsBindings } from \"@usecontextlayer/cli/vite\"\nimport type { ConfigEnv } from \"vite\"\n\nexport async function contextlayer({ command }: ConfigEnv) {\n\tconst bindings = command === \"serve\" ? await getLocalToolsBindings() : undefined\n\treturn [\n\t\t{\n\t\t\tconfig: () => ({\n\t\t\t\tdefine: {\n\t\t\t\t\t\"import.meta.env.CTX_APP_ID\":\n\t\t\t\t\t\tJSON.stringify(bindings?.props.appId) ?? \"undefined\",\n\t\t\t\t\t\"import.meta.env.CTX_APP_MANIFEST\":\n\t\t\t\t\t\tJSON.stringify(JSON.stringify(bindings?.props.manifest)) ?? \"undefined\",\n\t\t\t\t\t\"import.meta.env.CTX_PLATFORM_URL\":\n\t\t\t\t\t\tJSON.stringify(bindings?.vars.CTX_PLATFORM_URL) ?? \"undefined\",\n\t\t\t\t},\n\t\t\t}),\n\t\t\tname: \"contextlayer-chrome\",\n\t\t},\n\t\tcloudflare({\n\t\t\tauxiliaryWorkers: [\n\t\t\t\t{\n\t\t\t\t\tconfig: bindings ? { vars: bindings.vars } : {},\n\t\t\t\t\tconfigPath: \"workers/local-tools/wrangler.jsonc\",\n\t\t\t\t\tdevOnly: true,\n\t\t\t\t},\n\t\t\t],\n\t\t\tconfig: bindings\n\t\t\t\t? {\n\t\t\t\t\t\tservices: [\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tbinding: \"TOOLS\",\n\t\t\t\t\t\t\t\tentrypoint: \"Tools\",\n\t\t\t\t\t\t\t\tprops: bindings.props,\n\t\t\t\t\t\t\t\tservice: \"ctx-local-tools\",\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t],\n\t\t\t\t\t}\n\t\t\t\t: {},\n\t\t\tviteEnvironment: { name: \"ssr\" },\n\t\t}),\n\t]\n}\n"],"mappings":";;;AAIA,eAAsB,aAAa,EAAE,WAAsB;CAC1D,MAAM,WAAW,YAAY,UAAU,MAAM,sBAAsB,IAAI,KAAA;CACvE,OAAO,CACN;EACC,eAAe,EACd,QAAQ;GACP,8BACC,KAAK,UAAU,UAAU,MAAM,KAAK,KAAK;GAC1C,oCACC,KAAK,UAAU,KAAK,UAAU,UAAU,MAAM,QAAQ,CAAC,KAAK;GAC7D,oCACC,KAAK,UAAU,UAAU,KAAK,gBAAgB,KAAK;EACrD,EACD;EACA,MAAM;CACP,GACA,WAAW;EACV,kBAAkB,CACjB;GACC,QAAQ,WAAW,EAAE,MAAM,SAAS,KAAK,IAAI,CAAC;GAC9C,YAAY;GACZ,SAAS;EACV,CACD;EACA,QAAQ,WACL,EACA,UAAU,CACT;GACC,SAAS;GACT,YAAY;GACZ,OAAO,SAAS;GAChB,SAAS;EACV,CACD,EACD,IACC,CAAC;EACJ,iBAAiB,EAAE,MAAM,MAAM;CAChC,CAAC,CACF;AACD"}

package/dist/worker.d.ts

@@ -1,18 +1,17 @@
-import { a as Viewer, t as Tools } from "./index-DbuYj6qS.js";
+import { Tools } from "./index.js";
 import { createRequestHandler } from "react-router";
 //#region worker.d.ts
+interface LocalBindings {
+  TOOLS: Tools;
+}
+interface AppProps {
+  tools: Tools;
+}
+export type App = Required<Pick<ExportedHandler<LocalBindings, unknown, unknown, AppProps>, "fetch">>;
 export declare function createApp({ build, mode, development }: {
   build: Parameters<typeof createRequestHandler>[0];
   mode: string;
   development: boolean;
-}): {
-  fetch(request: Request, env: {
-    TOOLS: Tools;
-    VIEWER: Viewer;
-  }, ctx: ExecutionContext<{
-    tools: Tools;
-    viewer?: Viewer;
-  }>): Promise<Response>;
-};
+}): App;
 //#endregion
 //# sourceMappingURL=worker.d.ts.map

package/dist/worker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"worker.d.ts","names":[],"sources":["../worker.ts"],"mappings":";;;wBAGgB,YACf,OACA,MACA;EAEA,OAAO,kBAAkB;EACzB;EACA;;EAIO,MAAK,SACD,SAAO;IACT,OAAO;IAAO,QAAQ;KAAQ,KAChC;IAAmB,OAAO;IAAO,SAAS;OAAS,QAAA"}
+{"version":3,"file":"worker.d.ts","names":[],"sources":["../worker.ts"],"mappings":";;;UAGU;EACT,OAAO;;UAGE;EACT,OAAO;;YAGI,MAAM,SACjB,KAAK,gBAAgB,iCAAiC;wBAGvC,YACf,OACA,MACA;EAEA,OAAO,kBAAkB;EACzB;EACA;IACG"}

package/dist/worker.js

@@ -1,4 +1,4 @@
-import { toolsContext, viewerContext } from "./index.js";
+import { toolsContext } from "./index.js";
 import { RouterContextProvider, createRequestHandler } from "react-router";
 //#region worker.ts
 function createApp({ build, mode, development }) {
@@ -6,8 +6,6 @@ function createApp({ build, mode, development }) {
 	return { async fetch(request, env, ctx) {
 		const context = new RouterContextProvider();
 		context.set(toolsContext, development ? env.TOOLS : ctx.props.tools);
-		const viewer = development ? env.VIEWER : ctx.props.viewer;
-		if (viewer) context.set(viewerContext, viewer);
 		return requestHandler(request, context);
 	} };
 }

package/dist/worker.js.map

@@ -1 +1 @@
-{"version":3,"file":"worker.js","names":[],"sources":["../worker.ts"],"sourcesContent":["import { createRequestHandler, RouterContextProvider } from \"react-router\"\nimport { type Tools, toolsContext, type Viewer, viewerContext } from \"@/index\"\n\nexport function createApp({\n\tbuild,\n\tmode,\n\tdevelopment,\n}: {\n\tbuild: Parameters<typeof createRequestHandler>[0]\n\tmode: string\n\tdevelopment: boolean\n}) {\n\tconst requestHandler = createRequestHandler(build, mode)\n\treturn {\n\t\tasync fetch(\n\t\t\trequest: Request,\n\t\t\tenv: { TOOLS: Tools; VIEWER: Viewer },\n\t\t\tctx: ExecutionContext<{ tools: Tools; viewer?: Viewer }>,\n\t\t) {\n\t\t\tconst context = new RouterContextProvider()\n\t\t\tcontext.set(toolsContext, development ? env.TOOLS : ctx.props.tools)\n\t\t\tconst viewer = development ? env.VIEWER : ctx.props.viewer\n\t\t\tif (viewer) context.set(viewerContext, viewer)\n\t\t\treturn requestHandler(request, context)\n\t\t},\n\t}\n}\n"],"mappings":";;;AAGA,SAAgB,UAAU,EACzB,OACA,MACA,eAKE;CACF,MAAM,iBAAiB,qBAAqB,OAAO,IAAI;CACvD,OAAO,EACN,MAAM,MACL,SACA,KACA,KACC;EACD,MAAM,UAAU,IAAI,sBAAsB;EAC1C,QAAQ,IAAI,cAAc,cAAc,IAAI,QAAQ,IAAI,MAAM,KAAK;EACnE,MAAM,SAAS,cAAc,IAAI,SAAS,IAAI,MAAM;EACpD,IAAI,QAAQ,QAAQ,IAAI,eAAe,MAAM;EAC7C,OAAO,eAAe,SAAS,OAAO;CACvC,EACD;AACD"}
+{"version":3,"file":"worker.js","names":[],"sources":["../worker.ts"],"sourcesContent":["import { createRequestHandler, RouterContextProvider } from \"react-router\"\nimport { type Tools, toolsContext } from \"@/index\"\n\ninterface LocalBindings {\n\tTOOLS: Tools\n}\n\ninterface AppProps {\n\ttools: Tools\n}\n\nexport type App = Required<\n\tPick<ExportedHandler<LocalBindings, unknown, unknown, AppProps>, \"fetch\">\n>\n\nexport function createApp({\n\tbuild,\n\tmode,\n\tdevelopment,\n}: {\n\tbuild: Parameters<typeof createRequestHandler>[0]\n\tmode: string\n\tdevelopment: boolean\n}): App {\n\tconst requestHandler = createRequestHandler(build, mode)\n\treturn {\n\t\tasync fetch(request, env, ctx) {\n\t\t\tconst context = new RouterContextProvider()\n\t\t\tcontext.set(toolsContext, development ? env.TOOLS : ctx.props.tools)\n\t\t\treturn requestHandler(request, context)\n\t\t},\n\t}\n}\n"],"mappings":";;;AAeA,SAAgB,UAAU,EACzB,OACA,MACA,eAKO;CACP,MAAM,iBAAiB,qBAAqB,OAAO,IAAI;CACvD,OAAO,EACN,MAAM,MAAM,SAAS,KAAK,KAAK;EAC9B,MAAM,UAAU,IAAI,sBAAsB;EAC1C,QAAQ,IAAI,cAAc,cAAc,IAAI,QAAQ,IAAI,MAAM,KAAK;EACnE,OAAO,eAAe,SAAS,OAAO;CACvC,EACD;AACD"}

package/package.json

@@ -1,14 +1,7 @@
 {
   "dependencies": {
-    "@base-ui/react": "^1.8.0",
-    "@fontsource/fugaz-one": "^5.3.0",
-    "class-variance-authority": "^0.7.1",
-    "cn": "^0.4.0",
-    "shadcn": "^4.21.1",
-    "tailwindcss": "^4.3.3",
-    "tw-animate-css": "^1.4.0",
     "zod": "^4.4.3",
-    "@usecontextlayer/cli": "0.14.0"
+    "@usecontextlayer/cli": "0.14.2"
   },
   "devDependencies": {
     "@cloudflare/vite-plugin": "^1.62.4",
@@ -22,7 +15,7 @@
     "tsdown": "latest",
     "typescript": "latest",
     "vite": "^8.3.2",
-    "@usecontextlayer/shared": "0.14.0"
+    "@usecontextlayer/shared": "0.14.2"
   },
   "exports": {
     ".": {
@@ -37,7 +30,6 @@
       "import": "./dist/react.js",
       "types": "./dist/react.d.ts"
     },
-    "./styles.css": "./styles.css",
     "./vite": {
       "import": "./dist/vite.js",
       "types": "./dist/vite.d.ts"
@@ -49,8 +41,7 @@
   },
   "files": [
     "dist",
-    "examples",
-    "styles.css"
+    "examples"
   ],
   "name": "@usecontextlayer/sdk",
   "peerDependencies": {
@@ -61,7 +52,7 @@
     "vite": "^8.3.2"
   },
   "type": "module",
-  "version": "0.14.0",
+  "version": "0.14.2",
   "scripts": {
     "build": "tsdown",
     "dev:watch": "tsdown --watch",

package/dist/index-DbuYj6qS.d.ts

@@ -1,24 +0,0 @@
-import { z } from "zod";
-//#region viewer.d.ts
-declare const userSchema: z.ZodObject<{
-  id: z.ZodString;
-  image: z.ZodNullable<z.ZodString>;
-  name: z.ZodString;
-}, z.core.$strip>;
-type User = z.infer<typeof userSchema>;
-interface Viewer {
-  getCurrentUser(): Promise<User | null>;
-}
-//#endregion
-//#region index.d.ts
-interface Tools {
-  call(slug: string, toolSlug: string, args: Record<string, unknown>): Promise<{
-    data: unknown;
-    logId: string;
-  }>;
-}
-declare const toolsContext: import("react-router").RouterContext<Tools>;
-declare const viewerContext: import("react-router").RouterContext<Viewer>;
-//#endregion
-export { Viewer as a, User as i, toolsContext as n, viewerContext as r, Tools as t };
-//# sourceMappingURL=index-DbuYj6qS.d.ts.map

package/dist/index-DbuYj6qS.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index-DbuYj6qS.d.ts","names":[],"sources":["../viewer.ts","../index.ts"],"mappings":";;cAEa,YAAU,EAAA;;;;GAIrB,EAAA,KAAA;KAEU,OAAO,EAAE,aAAa;UAEjB;EAChB,kBAAkB,QAAQ;;;;UCNV;EAChB,KACC,cACA,kBACA,MAAM,0BACJ;IAAU;IAAe;;;cAGhB,qCAAY,cAAA;cACZ,sCAAa,cAAA"}

package/styles.css

@@ -1,136 +0,0 @@
-@import "tailwindcss" source(none);
-@import "tw-animate-css";
-@import "shadcn/tailwind.css";
-@source "./dist";
-
-@custom-variant dark (&:is(.dark *));
-
-@theme inline {
-	--font-heading: var(--font-sans);
-	--font-sans: ui-sans-serif, system-ui, sans-serif;
-	--font-logo: "ContextLayer Logo", sans-serif;
-	--color-sidebar-ring: var(--sidebar-ring);
-	--color-sidebar-border: var(--sidebar-border);
-	--color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-	--color-sidebar-accent: var(--sidebar-accent);
-	--color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-	--color-sidebar-primary: var(--sidebar-primary);
-	--color-sidebar-foreground: var(--sidebar-foreground);
-	--color-sidebar: var(--sidebar);
-	--color-chart-5: var(--chart-5);
-	--color-chart-4: var(--chart-4);
-	--color-chart-3: var(--chart-3);
-	--color-chart-2: var(--chart-2);
-	--color-chart-1: var(--chart-1);
-	--color-ring: var(--ring);
-	--color-input: var(--input);
-	--color-border: var(--border);
-	--color-destructive: var(--destructive);
-	--color-accent-foreground: var(--accent-foreground);
-	--color-accent: var(--accent);
-	--color-muted-foreground: var(--muted-foreground);
-	--color-muted: var(--muted);
-	--color-secondary-foreground: var(--secondary-foreground);
-	--color-secondary: var(--secondary);
-	--color-primary-foreground: var(--primary-foreground);
-	--color-primary: var(--primary);
-	--color-popover-foreground: var(--popover-foreground);
-	--color-popover: var(--popover);
-	--color-card-foreground: var(--card-foreground);
-	--color-card: var(--card);
-	--color-foreground: var(--foreground);
-	--color-background: var(--background);
-	--radius-sm: calc(var(--radius) * 0.6);
-	--radius-md: calc(var(--radius) * 0.8);
-	--radius-lg: var(--radius);
-	--radius-xl: calc(var(--radius) * 1.4);
-	--radius-2xl: calc(var(--radius) * 1.8);
-	--radius-3xl: calc(var(--radius) * 2.2);
-	--radius-4xl: calc(var(--radius) * 2.6);
-}
-
-:host {
-	--background: oklch(1 0 0);
-	--foreground: oklch(0.145 0 0);
-	--card: oklch(1 0 0);
-	--card-foreground: oklch(0.145 0 0);
-	--popover: oklch(1 0 0);
-	--popover-foreground: oklch(0.145 0 0);
-	--primary: oklch(0.205 0 0);
-	--primary-foreground: oklch(0.985 0 0);
-	--secondary: oklch(0.97 0 0);
-	--secondary-foreground: oklch(0.205 0 0);
-	--muted: oklch(0.97 0 0);
-	--muted-foreground: oklch(0.556 0 0);
-	--accent: oklch(0.97 0 0);
-	--accent-foreground: oklch(0.205 0 0);
-	--destructive: oklch(0.577 0.245 27.325);
-	--border: oklch(0.922 0 0);
-	--input: oklch(0.922 0 0);
-	--ring: oklch(0.708 0 0);
-	--chart-1: oklch(0.87 0 0);
-	--chart-2: oklch(0.556 0 0);
-	--chart-3: oklch(0.439 0 0);
-	--chart-4: oklch(0.371 0 0);
-	--chart-5: oklch(0.269 0 0);
-	--radius: 0.625rem;
-	--sidebar: oklch(0.985 0 0);
-	--sidebar-foreground: oklch(0.145 0 0);
-	--sidebar-primary: oklch(0.205 0 0);
-	--sidebar-primary-foreground: oklch(0.985 0 0);
-	--sidebar-accent: oklch(0.97 0 0);
-	--sidebar-accent-foreground: oklch(0.205 0 0);
-	--sidebar-border: oklch(0.922 0 0);
-	--sidebar-ring: oklch(0.708 0 0);
-}
-
-:host(.dark) {
-	--background: oklch(0.145 0 0);
-	--foreground: oklch(0.985 0 0);
-	--card: oklch(0.205 0 0);
-	--card-foreground: oklch(0.985 0 0);
-	--popover: oklch(0.205 0 0);
-	--popover-foreground: oklch(0.985 0 0);
-	--primary: oklch(0.922 0 0);
-	--primary-foreground: oklch(0.205 0 0);
-	--secondary: oklch(0.269 0 0);
-	--secondary-foreground: oklch(0.985 0 0);
-	--muted: oklch(0.269 0 0);
-	--muted-foreground: oklch(0.708 0 0);
-	--accent: oklch(0.269 0 0);
-	--accent-foreground: oklch(0.985 0 0);
-	--destructive: oklch(0.704 0.191 22.216);
-	--border: oklch(1 0 0 / 10%);
-	--input: oklch(1 0 0 / 15%);
-	--ring: oklch(0.556 0 0);
-	--chart-1: oklch(0.87 0 0);
-	--chart-2: oklch(0.556 0 0);
-	--chart-3: oklch(0.439 0 0);
-	--chart-4: oklch(0.371 0 0);
-	--chart-5: oklch(0.269 0 0);
-	--sidebar: oklch(0.205 0 0);
-	--sidebar-foreground: oklch(0.985 0 0);
-	--sidebar-primary: oklch(0.488 0.243 264.376);
-	--sidebar-primary-foreground: oklch(0.985 0 0);
-	--sidebar-accent: oklch(0.269 0 0);
-	--sidebar-accent-foreground: oklch(0.985 0 0);
-	--sidebar-border: oklch(1 0 0 / 10%);
-	--sidebar-ring: oklch(0.556 0 0);
-}
-
-@layer base {
-	:host {
-		all: initial;
-		display: block;
-		background: var(--background);
-		color: var(--foreground);
-		font:
-			14px / 1.5 ui-sans-serif,
-			system-ui,
-			sans-serif;
-		color-scheme: light;
-	}
-	* {
-		@apply border-border outline-ring/50;
-	}
-}