@agent-native/core 0.168.10 → 0.168.11

package/corpus/templates/clips/desktop/src/tailwind.css

@@ -0,0 +1,282 @@
+/**
+ * Tailwind + shadcn/ui for the Clips tray app.
+ *
+ * Deliberately imports `theme` and `utilities` but NOT `preflight`. The tray
+ * predates this layer: `styles.css` hand-styles every overlay (pill, bubble,
+ * toolbar, countdown, onboarding) against unreset browser defaults, so
+ * preflight's reset would silently break all of them. Surfaces move onto
+ * Tailwind one at a time; when the last hand-written rule is gone, swap these
+ * two imports for plain `@import "tailwindcss"` and delete this comment.
+ */
+/* Layer order decides who wins, and it has to be declared before the imports.
+   `styles.css` is unlayered CSS, and unlayered always beats a layer — including
+   bare element rules like `button { font-size: inherit }`, which would quietly
+   defeat every `text-sm` on a shadcn Button. Pulling it into `legacy` puts it
+   below `utilities` so Tailwind can do its job, while keeping the tray's own
+   cascade intact for the surfaces still using it. */
+@layer legacy, theme, utilities;
+
+@import "./styles.css" layer(legacy);
+@import "tailwindcss/theme.css" layer(theme);
+@import "tailwindcss/utilities.css" layer(utilities);
+@import "tw-animate-css";
+
+@source "./**/*.{ts,tsx}";
+
+/**
+ * The parts of preflight a Tailwind-era surface cannot live without, scoped to
+ * subtrees marked `data-tw-surface` so the hand-written tray surfaces keep the
+ * UA defaults their CSS was written against.
+ *
+ * Every rule here exists because a shadcn component assumes preflight already
+ * ran. Skipping it cost us, in order: phantom UA margins under headings, the
+ * native grey `ButtonFace` box behind `ghost` variants, `currentColor` borders
+ * painting black instead of a hairline, and icons riding ~2px high because an
+ * un-reset `svg` is an inline box on a text baseline. If a shadcn primitive
+ * looks subtly wrong here, suspect this list before editing the primitive.
+ *
+ * In `theme` so every utility still wins. Portaled shadcn content (popover and
+ * select) carries the attribute itself, since it renders outside the subtree.
+ */
+@layer theme {
+  [data-tw-surface] :is(h1, h2, h3, h4, h5, h6, p, figure, blockquote) {
+    margin: 0;
+  }
+
+  /* Icons are laid out as boxes, not as glyphs on a baseline. Without this an
+     `svg` stays `display: inline` and sits ~2px above the centre of whatever
+     flex row is meant to be centring it — visible on every checkmark, chevron,
+     and button icon. */
+  [data-tw-surface] :is(img, svg, video, canvas, audio, iframe, embed, object) {
+    display: block;
+    vertical-align: middle;
+  }
+
+  /* Tailwind's `border` utility sets width only — preflight is what gives every
+     element a default border COLOR. Without it a bare `border` (shadcn's
+     popover and select content, among others) falls back to `currentColor` and
+     paints a hard near-black rule instead of a hairline. */
+  [data-tw-surface],
+  [data-tw-surface] *,
+  [data-tw-surface] *::before,
+  [data-tw-surface] *::after {
+    border-color: hsl(var(--ui-border));
+  }
+
+  [data-tw-surface] :is(button, input, optgroup, select, textarea) {
+    appearance: none;
+    margin: 0;
+    padding: 0;
+    border: 0;
+    border-radius: 0;
+    background-color: transparent;
+    color: inherit;
+    font: inherit;
+    letter-spacing: inherit;
+  }
+
+  [data-tw-surface] :is(button, [role="button"]) {
+    cursor: pointer;
+  }
+
+  [data-tw-surface] :is(button, input, select, textarea):disabled {
+    cursor: not-allowed;
+  }
+
+  [data-tw-surface] :is(input, textarea)::placeholder {
+    color: hsl(var(--ui-muted-foreground));
+    opacity: 1;
+  }
+
+  /* The remainder of preflight, ported in one pass rather than discovered one
+     bug at a time. Headings keep UA size/weight without this, lists keep their
+     markers and indent, links keep browser blue — each of which would read as
+     a broken shadcn component rather than a missing reset. */
+  [data-tw-surface] :is(h1, h2, h3, h4, h5, h6) {
+    font-size: inherit;
+    font-weight: inherit;
+  }
+
+  [data-tw-surface] :is(dl, dd, hr, pre, fieldset, legend) {
+    margin: 0;
+    padding: 0;
+  }
+
+  [data-tw-surface] :is(ol, ul, menu) {
+    list-style: none;
+    margin: 0;
+    padding: 0;
+  }
+
+  [data-tw-surface] a {
+    color: inherit;
+    text-decoration: inherit;
+  }
+
+  [data-tw-surface] :is(code, kbd, samp, pre) {
+    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+    font-size: 1em;
+  }
+
+  [data-tw-surface] hr {
+    height: 0;
+    color: inherit;
+    border-top-width: 1px;
+  }
+
+  [data-tw-surface] table {
+    text-indent: 0;
+    border-color: inherit;
+    border-collapse: collapse;
+  }
+
+  [data-tw-surface] :is(img, video) {
+    max-width: 100%;
+    height: auto;
+  }
+
+  [data-tw-surface] textarea {
+    resize: vertical;
+  }
+
+  [data-tw-surface] summary {
+    display: list-item;
+  }
+
+  [data-tw-surface] [hidden]:not([hidden="until-found"]) {
+    display: none !important;
+  }
+}
+
+/* The tray follows the OS, so dark mode is a media query rather than the web
+   app's `.dark` class. Both resolve the same token names. */
+@custom-variant dark (@media (prefers-color-scheme: dark));
+
+/**
+ * shadcn/ui semantic tokens, expressed as HSL triplets as in the web app's
+ * `app/global.css` so a primitive copied between the two renders the same.
+ * The values are the tray's own palette — a menu-bar window sits on the
+ * desktop, not on a page, so it stays slightly darker and flatter than web.
+ *
+ * Every token is `--ui-`-prefixed because this block is UNLAYERED and legacy
+ * `styles.css` (layered) defines full-color tokens under the bare names —
+ * an unprefixed `--border: 0 0% 90%` here would beat legacy's full-color
+ * `--border` and expand its 27 `var(--border)` borders to an invalid
+ * color. Only tailwind.css maps these into Tailwind's namespace.
+ */
+:root {
+  --ui-background: 0 0% 100%;
+  --ui-foreground: 0 0% 9%;
+  --ui-card: 0 0% 100%;
+  --ui-card-foreground: 0 0% 9%;
+  --ui-popover: 0 0% 100%;
+  --ui-popover-foreground: 0 0% 9%;
+  --ui-primary: 0 0% 10%;
+  --ui-primary-foreground: 0 0% 100%;
+  --ui-secondary: 0 0% 97%;
+  --ui-secondary-foreground: 0 0% 10%;
+  --ui-muted: 0 0% 96%;
+  --ui-muted-foreground: 0 0% 45%;
+  --ui-accent: 0 0% 94%;
+  --ui-accent-foreground: 0 0% 10%;
+  --ui-destructive: 0 72% 51%;
+  --ui-destructive-foreground: 0 0% 98%;
+  --ui-border: 0 0% 90%;
+  --ui-input: 0 0% 87%;
+  --ui-ring: 0 0% 40%;
+  /* macOS convention for an engaged switch, and the one accent the tray uses. */
+  --ui-success: 142 71% 45%;
+  /* Reserved for "there is something new here" — the Settings dot, nothing else. */
+  --ui-info: 217 91% 55%;
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --ui-background: 0 0% 13%;
+    --ui-foreground: 0 0% 96%;
+    --ui-card: 0 0% 15%;
+    --ui-card-foreground: 0 0% 96%;
+    --ui-popover: 0 0% 15%;
+    --ui-popover-foreground: 0 0% 96%;
+    --ui-primary: 0 0% 96%;
+    --ui-primary-foreground: 0 0% 10%;
+    --ui-secondary: 0 0% 18%;
+    --ui-secondary-foreground: 0 0% 96%;
+    --ui-muted: 0 0% 16%;
+    --ui-muted-foreground: 0 0% 64%;
+    --ui-accent: 0 0% 20%;
+    --ui-accent-foreground: 0 0% 96%;
+    --ui-destructive: 0 72% 58%;
+    --ui-destructive-foreground: 0 0% 98%;
+    --ui-border: 0 0% 24%;
+    --ui-input: 0 0% 32%;
+    --ui-ring: 0 0% 60%;
+    --ui-success: 142 60% 52%;
+    --ui-info: 217 91% 65%;
+  }
+}
+
+@theme inline {
+  /**
+   * Absolute, not rem. The tray sets `:root { font-size: 13px }`, so every
+   * rem-based Tailwind scale silently computed ~19% small against it —
+   * `text-xs` landed at 9.75px and `h-8` at 26px, which is what made control
+   * typography look off next to the px-based rest of the app. Pinning these to
+   * px makes the utility scale mean the same thing here as in the web app.
+   */
+  --spacing: 4px;
+  /* Softer than shadcn's 8px default: a 32px-tall control wants ~10px to read
+     as the rounded pill the rest of this product uses. */
+  --radius: 10px;
+
+  /* One scale, anchored on the tray's 13px baseline. `text-base` is body copy,
+     `text-sm` is every in-row control, `text-xs` is the grounding line. */
+  --text-2xs: 10px;
+  --text-2xs--line-height: 1.4;
+  --text-xs: 11px;
+  --text-xs--line-height: 1.45;
+  --text-sm: 12px;
+  --text-sm--line-height: 1.4;
+  --text-base: 13px;
+  --text-base--line-height: 1.45;
+  --text-lg: 15px;
+  --text-lg--line-height: 1.35;
+  --text-xl: 17px;
+  --text-xl--line-height: 1.3;
+  --text-2xl: 20px;
+  --text-2xl--line-height: 1.2;
+
+  --color-border: hsl(var(--ui-border));
+  --color-input: hsl(var(--ui-input));
+  --color-ring: hsl(var(--ui-ring));
+  --color-background: hsl(var(--ui-background));
+  --color-foreground: hsl(var(--ui-foreground));
+
+  --color-primary: hsl(var(--ui-primary));
+  --color-primary-foreground: hsl(var(--ui-primary-foreground));
+
+  --color-secondary: hsl(var(--ui-secondary));
+  --color-secondary-foreground: hsl(var(--ui-secondary-foreground));
+
+  --color-destructive: hsl(var(--ui-destructive));
+  --color-destructive-foreground: hsl(var(--ui-destructive-foreground));
+
+  --color-muted: hsl(var(--ui-muted));
+  --color-muted-foreground: hsl(var(--ui-muted-foreground));
+
+  --color-accent: hsl(var(--ui-accent));
+  --color-accent-foreground: hsl(var(--ui-accent-foreground));
+
+  --color-popover: hsl(var(--ui-popover));
+  --color-popover-foreground: hsl(var(--ui-popover-foreground));
+
+  --color-card: hsl(var(--ui-card));
+  --color-card-foreground: hsl(var(--ui-card-foreground));
+
+  --color-success: hsl(var(--ui-success));
+  --color-info: hsl(var(--ui-info));
+
+  --radius-lg: var(--radius);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-sm: calc(var(--radius) - 4px);
+}

package/corpus/templates/clips/desktop/tsconfig.json

@@ -12,7 +12,10 @@
     "skipLibCheck": true,
     "resolveJsonModule": true,
     "isolatedModules": true,
-    "noEmit": true
+    "noEmit": true,
+    "paths": {
+      "@/*": ["./src/*"]
+    }
   },
   "include": ["src/**/*.ts", "src/**/*.tsx"],
   "exclude": ["src/**/*.test.ts", "src/**/*.spec.ts"]

package/corpus/templates/clips/desktop/vite.config.ts

@@ -2,6 +2,7 @@ import { readFileSync } from "node:fs";
 import { dirname, resolve } from "node:path";
 import { fileURLToPath } from "node:url";
 
+import tailwindcss from "@tailwindcss/vite";
 import react from "@vitejs/plugin-react";
 import { defineConfig } from "vite";
 
@@ -77,7 +78,12 @@ function resolveSentryEnvironment(): string {
 //   still picks up `.rs` / `tauri.conf.json` / `capabilities/*.json`
 //   changes and rebuilds the app.
 export default defineConfig({
-  plugins: [react()],
+  plugins: [react(), tailwindcss()],
+  resolve: {
+    alias: {
+      "@": resolve(root, "src"),
+    },
+  },
   clearScreen: false,
   define: {
     __CLIPS_DESKTOP_SENTRY_DSN__: JSON.stringify(resolveSentryDsn()),

package/dist/observability/routes.d.ts

@@ -41,16 +41,16 @@ export declare function createObservabilityHandler(): import("h3").EventHandlerW
     thumbsUpRate: number;
     avgEvalScore: number;
 } | {
-    error?: undefined;
     summary: import("./types.js").TraceSummary;
     spans: import("./types.js").TraceSpan[];
     id?: undefined;
+    error?: undefined;
     ok?: undefined;
 } | {
-    error?: undefined;
     summary?: undefined;
     spans?: undefined;
     id: string;
+    error?: undefined;
     ok?: undefined;
 } | {
     summary?: undefined;
@@ -59,9 +59,9 @@ export declare function createObservabilityHandler(): import("h3").EventHandlerW
     error: any;
     ok?: undefined;
 } | {
-    error?: undefined;
     summary?: undefined;
     spans?: undefined;
     id?: undefined;
+    error?: undefined;
     ok: boolean;
 }>>;

package/dist/progress/routes.d.ts

@@ -15,6 +15,6 @@ export declare function createProgressHandler(): import("h3").EventHandlerWithFe
     error: string;
     ok?: undefined;
 } | {
-    error?: undefined;
     ok: boolean;
+    error?: undefined;
 }>>;

package/dist/secrets/routes.d.ts

@@ -37,17 +37,17 @@ export declare function createWriteSecretHandler(): import("h3").EventHandlerWit
     ok?: undefined;
     status?: undefined;
 } | {
-    error?: undefined;
     ok: boolean;
     status: string;
+    error?: undefined;
 } | {
     ok?: undefined;
     error: string;
     removed?: undefined;
 } | {
-    error?: undefined;
     ok: boolean;
     removed: boolean;
+    error?: undefined;
 }>>;
 /**
  * POST /_agent-native/secrets/:key/test — validate an optional candidate value
@@ -58,13 +58,13 @@ export declare function createTestSecretHandler(): import("h3").EventHandlerWith
     error: string;
     note?: undefined;
 } | {
-    error?: undefined;
     ok: boolean;
     note?: undefined;
-} | {
     error?: undefined;
+} | {
     ok: boolean;
     note: string;
+    error?: undefined;
 } | {
     note?: undefined;
     ok: boolean;
@@ -95,11 +95,11 @@ export interface AdHocSecretPayload {
 export declare function createAdHocSecretHandler(): import("h3").EventHandlerWithFetch<import("h3").EventHandlerRequest, Promise<AdHocSecretPayload[] | {
     error: string;
 } | {
-    error?: undefined;
     ok: boolean;
     key: string;
-} | {
     error?: undefined;
+} | {
     ok: boolean;
     removed: boolean;
+    error?: undefined;
 }>>;

package/dist/server/action-routes.js

@@ -1,4 +1,4 @@
-import { createError, defineEventHandler, setResponseStatus, setResponseHeader, getMethod, getQuery, getHeader, getRequestURL, } from "h3";
+import { createError, defineEventHandler, setResponseStatus, setResponseHeader, getMethod, getQuery, getHeader, } from "h3";
 import { verifyA2ATokenWithClaims } from "../a2a-claims.js";
 import { isActionContractError, isAgentActionStopError } from "../action.js";
 import { isTransientDatabaseError } from "../db/client.js";
@@ -15,6 +15,7 @@ import { getAllowedCorsOrigin as resolveAllowedCorsOrigin, readCorsAllowedOrigin
 import { resolveEmbedSessionFromRequest, resolvedEmbedCapabilityScope, } from "./embed-session.js";
 import { getHttpRequestTelemetryId } from "./http-response-telemetry.js";
 import { consumeOneTimeJti } from "./identity-sso-store.js";
+import { getForwardedRequestOrigin } from "./request-origin.js";
 function requiredClientCompatibilityVersion() {
     const configured = typeof __AGENT_NATIVE_CLIENT_COMPATIBILITY_VERSION__ === "string"
         ? __AGENT_NATIVE_CLIENT_COMPATIBILITY_VERSION__
@@ -410,7 +411,7 @@ export function mountActionRoutes(nitroApp, actions, options) {
                 timezone,
                 browserSessionId,
                 clientPlatform,
-                requestOrigin: getRequestURL(event).origin,
+                requestOrigin: getForwardedRequestOrigin(event),
                 // Captured here because this is the last layer that still holds
                 // the h3 event; everything below reads it off the request store.
                 isLoopbackRequest: isLoopbackRequest(event),

package/dist/server/realtime-token.d.ts

@@ -26,8 +26,8 @@ export declare function createRealtimeTokenHandler(): import("h3").EventHandlerW
     expiresAt?: undefined;
     ttlSeconds?: undefined;
 } | {
-    error?: undefined;
     token: string;
     expiresAt: string;
     ttlSeconds: number;
+    error?: undefined;
 }>>;

package/dist/server/request-origin.d.ts

@@ -1,4 +1,10 @@
 import { type H3Event } from "h3";
+/**
+ * Browser-visible origin from proxy-forwarded headers. Unlike `getOrigin()`,
+ * this ignores OAuth callback and configured-public-origin overrides so action
+ * CSRF checks match the Referer the browser actually sent.
+ */
+export declare function getForwardedRequestOrigin(event: H3Event): string;
 /**
  * Reject cross-site POSTs. Cookies are `SameSite=None; Secure` over HTTPS so
  * the browser would otherwise attach the session to a forged form submission

package/dist/server/request-origin.js

@@ -1,4 +1,16 @@
 import { getRequestHeader } from "h3";
+/**
+ * Browser-visible origin from proxy-forwarded headers. Unlike `getOrigin()`,
+ * this ignores OAuth callback and configured-public-origin overrides so action
+ * CSRF checks match the Referer the browser actually sent.
+ */
+export function getForwardedRequestOrigin(event) {
+    const headerHost = getRequestHeader(event, "x-forwarded-host") ||
+        getRequestHeader(event, "host");
+    const isProd = process.env.NODE_ENV === "production";
+    const headerProto = getRequestHeader(event, "x-forwarded-proto") || (isProd ? "https" : "http");
+    return `${headerProto}://${headerHost ?? "localhost"}`;
+}
 function isLoopbackHost(host) {
     return host.startsWith("localhost:") || host.startsWith("127.0.0.1:");
 }

package/dist/server/transcribe-voice.d.ts

@@ -20,6 +20,6 @@ export declare function createTranscribeVoiceHandler(): import("h3").EventHandle
     error: string;
     text?: undefined;
 } | {
-    error?: undefined;
     text: string;
+    error?: undefined;
 }>>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@agent-native/core",
-  "version": "0.168.10",
+  "version": "0.168.11",
   "description": "Framework for agent-native application development — where AI agents and UI share SQL state, actions, and context",
   "homepage": "https://github.com/BuilderIO/agent-native#readme",
   "bugs": {