@usecontextlayer/sdk 0.13.0 → 0.14.1

package/README.md

@@ -1,30 +1,34 @@
 # @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 your 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.
 
 ## Local login and assignment
 
-Run `ctx login` to save your ContextLayer login. Declare `work-email` as an individual Gmail requirement in `public/slate.json`, then use `ctx connections list` to find your connection and `ctx connection local assign work-email <connection_id>` to assign it. Run local commands from the app root.
+Run `ctx login` to save your ContextLayer login. Declare `work-email` as a viewer-mode Gmail requirement in `public/slate.json`, then use `ctx connections list` to find your connection and `ctx connection local assign work-email <connection_id>` to assign it. Run local commands from the app root.
 
-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 and obtains a current access token using the same saved login as the CLI. The AppID, platform URL, auth issuer, and access token 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.
+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, 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 signed-in identity are plain content; the signed-out identity opens sign-in. The tray currently displays requirement and saved-assignment JSON.
+
+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 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.
+S4 authentication is incomplete. The current temporary implementation opens a trusted platform sign-in popup when “Not signed in” is clicked; this experience was rejected and will be fixed after the current code is committed. Private app entry should leave the header authenticated automatically, without this additional step. Better Auth issues a one-time token directly to the frame, which exchanges it server-side for a Secure, HttpOnly, partitioned frame cookie backed by the existing web session. Web logout revokes that session. The surrounding authored page never receives the token or chrome data. The first frame sign-in requires a user gesture; subsequent loads reuse the partitioned cookie.
 
 ## A loader that reads Gmail
 
-The first argument is the connection requirement slug in `public/slate.json`, such as `work-email`. The platform resolves it using the app and signed-in user:
+The first argument is the connection requirement slug in `public/slate.json`, such as `work-email`. Its manifest mode selects the acting user's assignment (`viewer`) or the app's owning user or organization's assignment (`owner`):
 
 ```ts
 import { toolsContext } from "@usecontextlayer/sdk"
@@ -42,26 +46,11 @@ 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. The platform resolves the signed-in viewer’s assignment for the app and slug, so a viewer using the same account as the CLI uses the same saved assignment. Local access-token bindings are not included in production builds.
+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.
 
 ## Vite configuration
 
@@ -79,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 and saved ContextLayer login. 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 returns the browser viewer's profile and `{ slug, toolkit, mode, connection_id }` rows from the shared app-connection listing operation. Anonymous frames show “Not signed in” and 0/0. The tray renders requirement/assignment JSON and counts non-null assignments; it does not validate provider status. 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. Saved assignment changes appear on the next frame load. 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,28 +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_AUTH_ISSUER: z.ZodURL;
-  CTX_PLATFORM_URL: z.ZodURL;
-}, z.core.$strip>;
-type Bindings = z.input<typeof schema>;
+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";
+    }>;
+    toolkit: z.ZodString;
+  }, z.core.$strict>>;
+  secrets: z.ZodDefault<z.ZodRecord<z.ZodString, z.ZodObject<{
+    mode: z.ZodEnum<{
+      owner: "owner";
+      viewer: "viewer";
+    }>;
+  }, 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":";;;;cAEM,QAAM,EAAA;;;;;GAKV,EAAA,KAAA;KACU,WAAW,EAAE,aAAa;;;qBCIzB,cAAc,iBAAiB,qBAAqB;EAC1D,KAAK,cAAc,kBAAkB,MAAM,0BAAuB;;;;;qBAoB5D,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,22 +1,6 @@
-import { WorkerEntrypoint } from "cloudflare:workers";
 import { z } from "zod";
-//#region env.ts
-const schema = z.object({
-	CTX_ACCESS_TOKEN: z.string().min(1),
-	CTX_APP_ID: z.uuid(),
-	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(),
@@ -24,16 +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,
 				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"
 		});
@@ -46,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":["../env.ts","../viewer.ts","../local.ts"],"sourcesContent":["import { z } from \"zod\"\n\nconst schema = z.object({\n\tCTX_ACCESS_TOKEN: z.string().min(1),\n\tCTX_APP_ID: z.uuid(),\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({ arguments: args, slug, tool: toolSlug }),\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":";;;AAEA,MAAM,SAAS,EAAE,OAAO;CACvB,kBAAkB,EAAE,OAAO,CAAC,CAAC,IAAI,CAAC;CAClC,YAAY,EAAE,KAAK;CACnB,iBAAiB,EAAE,IAAI;CACvB,kBAAkB,EAAE,IAAI;AACzB,CAAC;AAED,MAAa,YAAY,aAAuB,OAAO,MAAM,QAAQ;;;ACPrE,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;IAAE,WAAW;IAAM;IAAM,MAAM;GAAS,CAAC;GAC9D,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":";;wBAsCgB,SAAS;EAAc,UAAU;oBAAW,IAAA"}

package/dist/react.js

@@ -1,173 +1,57 @@
-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: {
+			border: 0,
+			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 +63,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 +71,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":"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"}
+{"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={{ border: 0, display: \"block\", height, width: \"100%\" }}\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;GAAE,QAAQ;GAAG,SAAS;GAAS;GAAQ,OAAO;EAAO;CAC5D,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.13.0"
+    "@usecontextlayer/cli": "0.14.1"
   },
   "devDependencies": {
     "@cloudflare/vite-plugin": "^1.62.4",
@@ -21,7 +14,8 @@
     "react-router": "^8.4.0",
     "tsdown": "latest",
     "typescript": "latest",
-    "vite": "^8.3.2"
+    "vite": "^8.3.2",
+    "@usecontextlayer/shared": "0.14.1"
   },
   "exports": {
     ".": {
@@ -36,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"
@@ -48,8 +41,7 @@
   },
   "files": [
     "dist",
-    "examples",
-    "styles.css"
+    "examples"
   ],
   "name": "@usecontextlayer/sdk",
   "peerDependencies": {
@@ -60,7 +52,7 @@
     "vite": "^8.3.2"
   },
   "type": "module",
-  "version": "0.13.0",
+  "version": "0.14.1",
   "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;
-	}
-}