@stigmer/react 0.4.2 → 0.4.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stigmer/react",
-  "version": "0.4.2",
+  "version": "0.4.4",
   "description": "React provider and client hook for the Stigmer platform SDK",
   "license": "Apache-2.0",
   "type": "module",
@@ -35,7 +35,7 @@
     }
   },
   "dependencies": {
-    "@stigmer/theme": "0.4.2",
+    "@stigmer/theme": "0.4.4",
     "react-markdown": "^10.1.0",
     "remark-gfm": "^4.0.1",
     "streamdown": "^2.5.0",
@@ -44,8 +44,8 @@
   "peerDependencies": {
     "@base-ui/react": "^1.0.0",
     "@bufbuild/protobuf": "^2.0.0",
-    "@stigmer/protos": "0.4.2",
-    "@stigmer/sdk": "0.4.2",
+    "@stigmer/protos": "0.4.4",
+    "@stigmer/sdk": "0.4.4",
     "lucide-react": ">=0.400.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",

package/portal-container.d.ts

@@ -0,0 +1,54 @@
+/**
+ * React context that holds a reference to the managed portal container.
+ *
+ * `StigmerProvider` creates a `<div>` appended to `document.body` with
+ * the same scoping attributes (`class="stgm [preset]"`,
+ * `data-stgm-color-mode`) as the main provider container. This ensures
+ * that portaled content (popovers, dialogs, menus) inherits the correct
+ * design token values — including dark-mode overrides — even though it
+ * lives outside the provider's DOM subtree.
+ *
+ * Defaults to `null` so components rendered outside a `StigmerProvider`
+ * fall back to the browser's default portal target (`document.body`).
+ *
+ * @internal Consumed by SDK components; not part of the public API.
+ */
+export declare const PortalContainerContext: import("react").Context<HTMLElement | null>;
+/**
+ * Returns the managed portal container for the nearest `StigmerProvider`.
+ *
+ * SDK components that use `Popover.Portal`, `Dialog.Portal`,
+ * `Select.Portal`, or `Menu.Portal` pass the returned element as the
+ * `container` prop so that portaled content inherits `--stgm-*` design
+ * tokens (including dark-mode values).
+ *
+ * Returns `null` when called outside a `StigmerProvider`, which makes
+ * Base UI portals fall back to `document.body`. This keeps components
+ * functional (though un-themed) when used standalone.
+ *
+ * Platform builders who create custom portaled components should use
+ * this hook to target the same container as the built-in SDK components.
+ *
+ * @example
+ * ```tsx
+ * import { Popover } from "@base-ui/react/popover";
+ * import { useStigmerPortalContainer } from "@stigmer/react";
+ *
+ * function MyPopover() {
+ *   const portalContainer = useStigmerPortalContainer();
+ *
+ *   return (
+ *     <Popover.Root>
+ *       <Popover.Trigger>Open</Popover.Trigger>
+ *       <Popover.Portal container={portalContainer}>
+ *         <Popover.Positioner>
+ *           <Popover.Popup>Content</Popover.Popup>
+ *         </Popover.Positioner>
+ *       </Popover.Portal>
+ *     </Popover.Root>
+ *   );
+ * }
+ * ```
+ */
+export declare function useStigmerPortalContainer(): HTMLElement | null;
+//# sourceMappingURL=portal-container.d.ts.map

package/portal-container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"portal-container.d.ts","sourceRoot":"","sources":["../src/portal-container.ts"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,sBAAsB,6CAA0C,CAAC;AAE9E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,wBAAgB,yBAAyB,IAAI,WAAW,GAAG,IAAI,CAE9D"}

package/portal-container.js

@@ -0,0 +1,58 @@
+"use client";
+import { createContext, useContext } from "react";
+/**
+ * React context that holds a reference to the managed portal container.
+ *
+ * `StigmerProvider` creates a `<div>` appended to `document.body` with
+ * the same scoping attributes (`class="stgm [preset]"`,
+ * `data-stgm-color-mode`) as the main provider container. This ensures
+ * that portaled content (popovers, dialogs, menus) inherits the correct
+ * design token values — including dark-mode overrides — even though it
+ * lives outside the provider's DOM subtree.
+ *
+ * Defaults to `null` so components rendered outside a `StigmerProvider`
+ * fall back to the browser's default portal target (`document.body`).
+ *
+ * @internal Consumed by SDK components; not part of the public API.
+ */
+export const PortalContainerContext = createContext(null);
+/**
+ * Returns the managed portal container for the nearest `StigmerProvider`.
+ *
+ * SDK components that use `Popover.Portal`, `Dialog.Portal`,
+ * `Select.Portal`, or `Menu.Portal` pass the returned element as the
+ * `container` prop so that portaled content inherits `--stgm-*` design
+ * tokens (including dark-mode values).
+ *
+ * Returns `null` when called outside a `StigmerProvider`, which makes
+ * Base UI portals fall back to `document.body`. This keeps components
+ * functional (though un-themed) when used standalone.
+ *
+ * Platform builders who create custom portaled components should use
+ * this hook to target the same container as the built-in SDK components.
+ *
+ * @example
+ * ```tsx
+ * import { Popover } from "@base-ui/react/popover";
+ * import { useStigmerPortalContainer } from "@stigmer/react";
+ *
+ * function MyPopover() {
+ *   const portalContainer = useStigmerPortalContainer();
+ *
+ *   return (
+ *     <Popover.Root>
+ *       <Popover.Trigger>Open</Popover.Trigger>
+ *       <Popover.Portal container={portalContainer}>
+ *         <Popover.Positioner>
+ *           <Popover.Popup>Content</Popover.Popup>
+ *         </Popover.Positioner>
+ *       </Popover.Portal>
+ *     </Popover.Root>
+ *   );
+ * }
+ * ```
+ */
+export function useStigmerPortalContainer() {
+    return useContext(PortalContainerContext);
+}
+//# sourceMappingURL=portal-container.js.map

package/portal-container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"portal-container.js","sourceRoot":"","sources":["../src/portal-container.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAElD;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,MAAM,sBAAsB,GAAG,aAAa,CAAqB,IAAI,CAAC,CAAC;AAE9E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,MAAM,UAAU,yBAAyB;IACvC,OAAO,UAAU,CAAC,sBAAsB,CAAC,CAAC;AAC5C,CAAC"}

package/provider.d.ts

@@ -1,4 +1,4 @@
-import type { ReactNode } from "react";
+import { type ReactNode } from "react";
 import type { Stigmer, DeploymentMode } from "@stigmer/sdk";
 import type { ThemePresetId } from "@stigmer/theme";
 import type { ColorMode } from "./color-mode";

package/provider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../src/provider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAGpD,OAAO,KAAK,EAAE,SAAS,EAAqB,MAAM,cAAc,CAAC;AAGjE,yCAAyC;AACzC,MAAM,WAAW,oBAAoB;IACnC,oDAAoD;IACpD,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAC;IACzB,yDAAyD;IACzD,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC;IAC7B;;;;;;;;;;OAUG;IACH,QAAQ,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC;IACzC;;;;;;;;;;;;;OAaG;IACH,QAAQ,CAAC,MAAM,CAAC,EAAE,aAAa,CAAC;IAChC;;;OAGG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA6BG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,SAAS,CAAC;CAChC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,QAAQ,EACR,cAAwB,EACxB,MAAM,EACN,SAAS,EACT,SAAmB,GACpB,EAAE,oBAAoB,2CAqBtB"}
+{"version":3,"file":"provider.d.ts","sourceRoot":"","sources":["../src/provider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAA+B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AACpE,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAE5D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAGpD,OAAO,KAAK,EAAE,SAAS,EAAqB,MAAM,cAAc,CAAC;AAIjE,yCAAyC;AACzC,MAAM,WAAW,oBAAoB;IACnC,oDAAoD;IACpD,QAAQ,CAAC,MAAM,EAAE,OAAO,CAAC;IACzB,yDAAyD;IACzD,QAAQ,CAAC,QAAQ,EAAE,SAAS,CAAC;IAC7B;;;;;;;;;;OAUG;IACH,QAAQ,CAAC,cAAc,CAAC,EAAE,cAAc,CAAC;IACzC;;;;;;;;;;;;;OAaG;IACH,QAAQ,CAAC,MAAM,CAAC,EAAE,aAAa,CAAC;IAChC;;;OAGG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA6BG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,SAAS,CAAC;CAChC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,wBAAgB,eAAe,CAAC,EAC9B,MAAM,EACN,QAAQ,EACR,cAAwB,EACxB,MAAM,EACN,SAAS,EACT,SAAmB,GACpB,EAAE,oBAAoB,2CAyBtB"}

package/provider.js

@@ -1,9 +1,11 @@
 "use client";
 import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef, useState } from "react";
 import { cn, resolvePresetClass } from "@stigmer/theme";
 import { StigmerContext } from "./context";
 import { DeploymentModeContext } from "./deployment-mode";
 import { ColorModeContext, useSystemColorMode } from "./color-mode";
+import { PortalContainerContext } from "./portal-container";
 /**
  * React provider that distributes a {@link Stigmer} SDK client to
  * descendant components via {@link StigmerContext}.
@@ -38,6 +40,50 @@ export function StigmerProvider({ client, children, deploymentMode = "cloud", pr
     const systemMode = useSystemColorMode();
     const resolvedMode = colorMode === "system" ? systemMode : colorMode;
     const presetClass = preset ? resolvePresetClass(preset) : "";
-    return (_jsx(StigmerContext.Provider, { value: client, children: _jsx(DeploymentModeContext.Provider, { value: deploymentMode, children: _jsx(ColorModeContext.Provider, { value: resolvedMode, children: _jsx("div", { className: cn("stgm", presetClass, className), "data-stgm-color-mode": resolvedMode, children: children }) }) }) }));
+    const portalContainer = usePortalContainer(resolvedMode, presetClass);
+    return (_jsx(StigmerContext.Provider, { value: client, children: _jsx(DeploymentModeContext.Provider, { value: deploymentMode, children: _jsx(ColorModeContext.Provider, { value: resolvedMode, children: _jsx(PortalContainerContext.Provider, { value: portalContainer, children: _jsx("div", { className: cn("stgm", presetClass, className), "data-stgm-color-mode": resolvedMode, children: children }) }) }) }) }));
+}
+/**
+ * Creates and manages a portal container `<div>` appended to
+ * `document.body` that mirrors the scoping attributes of the main
+ * provider container.
+ *
+ * Portaled content (popovers, dialogs, menus) that targets this
+ * element will inherit the correct `--stgm-*` token values —
+ * including dark-mode overrides — because the container carries
+ * `data-stgm-color-mode` and the preset class.
+ *
+ * The element is created once on mount and removed on unmount.
+ * Attribute values are kept in sync with prop changes via a
+ * separate effect.
+ *
+ * Returns `null` during SSR (no `document`).
+ */
+function usePortalContainer(colorMode, presetClass) {
+    const elRef = useRef(null);
+    const [container, setContainer] = useState(null);
+    useEffect(() => {
+        const el = document.createElement("div");
+        el.className = cn("stgm", presetClass);
+        el.setAttribute("data-stgm-color-mode", colorMode);
+        el.setAttribute("data-stgm-portal", "");
+        document.body.appendChild(el);
+        elRef.current = el;
+        setContainer(el);
+        return () => {
+            document.body.removeChild(el);
+            elRef.current = null;
+        };
+        // Intentionally empty deps: create once on mount, remove on unmount.
+        // Attribute syncing is handled by the effect below.
+    }, []);
+    useEffect(() => {
+        const el = elRef.current;
+        if (!el)
+            return;
+        el.className = cn("stgm", presetClass);
+        el.setAttribute("data-stgm-color-mode", colorMode);
+    }, [colorMode, presetClass]);
+    return container;
 }
 //# sourceMappingURL=provider.js.map

package/provider.js.map

@@ -1 +1 @@
-{"version":3,"file":"provider.js","sourceRoot":"","sources":["../src/provider.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAIb,OAAO,EAAE,EAAE,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAExD,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAC3C,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAE1D,OAAO,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAyEpE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,MAAM,UAAU,eAAe,CAAC,EAC9B,MAAM,EACN,QAAQ,EACR,cAAc,GAAG,OAAO,EACxB,MAAM,EACN,SAAS,EACT,SAAS,GAAG,OAAO,GACE;IACrB,MAAM,UAAU,GAAG,kBAAkB,EAAE,CAAC;IACxC,MAAM,YAAY,GAChB,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC;IAElD,MAAM,WAAW,GAAG,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAE7D,OAAO,CACL,KAAC,cAAc,CAAC,QAAQ,IAAC,KAAK,EAAE,MAAM,YACpC,KAAC,qBAAqB,CAAC,QAAQ,IAAC,KAAK,EAAE,cAAc,YACnD,KAAC,gBAAgB,CAAC,QAAQ,IAAC,KAAK,EAAE,YAAY,YAC5C,cACE,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,WAAW,EAAE,SAAS,CAAC,0BACvB,YAAY,YAEjC,QAAQ,GACL,GACoB,GACG,GACT,CAC3B,CAAC;AACJ,CAAC"}
+{"version":3,"file":"provider.js","sourceRoot":"","sources":["../src/provider.tsx"],"names":[],"mappings":"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"}

package/runner/RunnerPicker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RunnerPicker.d.ts","sourceRoot":"","sources":["../../src/runner/RunnerPicker.tsx"],"names":[],"mappings":"AAuBA,sCAAsC;AACtC,MAAM,WAAW,iBAAiB;IAChC,kDAAkD;IAClD,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB;;;;;OAKG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,sEAAsE;IACtE,QAAQ,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACrD;;;OAGG;IACH,QAAQ,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAClC,yDAAyD;IACzD,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,wCAAwC;IACxC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,YAAY,CAAC,EAC3B,GAAG,EACH,KAAK,EACL,QAAQ,EACR,cAAqB,EACrB,SAAS,EACT,QAAQ,GACT,EAAE,iBAAiB,2CAuHnB"}
+{"version":3,"file":"RunnerPicker.d.ts","sourceRoot":"","sources":["../../src/runner/RunnerPicker.tsx"],"names":[],"mappings":"AAwBA,sCAAsC;AACtC,MAAM,WAAW,iBAAiB;IAChC,kDAAkD;IAClD,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB;;;;;OAKG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,sEAAsE;IACtE,QAAQ,CAAC,QAAQ,EAAE,CAAC,QAAQ,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACrD;;;OAGG;IACH,QAAQ,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAClC,yDAAyD;IACzD,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,wCAAwC;IACxC,QAAQ,CAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;CAC7B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,wBAAgB,YAAY,CAAC,EAC3B,GAAG,EACH,KAAK,EACL,QAAQ,EACR,cAAqB,EACrB,SAAS,EACT,QAAQ,GACT,EAAE,iBAAiB,2CAwHnB"}

package/runner/RunnerPicker.js

@@ -3,6 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { Select } from "@base-ui/react/select";
 import { RunnerPhase } from "@stigmer/protos/ai/stigmer/agentic/runner/v1/enum_pb";
+import { useStigmerPortalContainer } from "../portal-container";
 import { useRunnerList } from "./useRunnerList";
 import { isActivePhase, phaseLabel, phaseDotColor, PHASE_SORT_ORDER, } from "./phase";
 /**
@@ -43,6 +44,7 @@ const AUTO_VALUE = "__auto__";
  * ```
  */
 export function RunnerPicker({ org, value, onChange, showAutoOption = true, className, disabled, }) {
+    const portalContainer = useStigmerPortalContainer();
     const { runners, isLoading } = useRunnerList(org);
     const { active, inactive } = useMemo(() => {
         const act = [];
@@ -80,7 +82,7 @@ export function RunnerPicker({ org, value, onChange, showAutoOption = true, clas
                     className,
                 ]
                     .filter(Boolean)
-                    .join(" "), children: [_jsx(RunnerIcon, {}), _jsx("span", { className: "max-w-[10rem] max-sm:max-w-[5rem] truncate", children: triggerLabel }), _jsx(ChevronIcon, {})] }), _jsx(Select.Portal, { children: _jsx(Select.Positioner, { sideOffset: 4, children: _jsxs(Select.Popup, { className: [
+                    .join(" "), children: [_jsx(RunnerIcon, {}), _jsx("span", { className: "max-w-[10rem] max-sm:max-w-[5rem] truncate", children: triggerLabel }), _jsx(ChevronIcon, {})] }), _jsx(Select.Portal, { container: portalContainer, children: _jsx(Select.Positioner, { sideOffset: 4, children: _jsxs(Select.Popup, { className: [
                             "z-popover max-h-72 min-w-[var(--anchor-width)] overflow-auto",
                             "rounded-lg border border-border bg-popover p-1 shadow-md",
                             "text-popover-foreground",

package/runner/RunnerPicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"RunnerPicker.js","sourceRoot":"","sources":["../../src/runner/RunnerPicker.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"RunnerPicker.js","sourceRoot":"","sources":["../../src/runner/RunnerPicker.tsx"],"names":[],"mappings":"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"}

package/src/composer/ComposerToolbar.tsx

@@ -97,7 +97,6 @@ export function ComposerToolbar({
   const hasTier2 = configureItems.length > 0;
   const showHarnessSeparate = showHarnessSelector && !showModelSelector;
   const hasExecParams = showHarnessSeparate || showModelSelector;
-  const harnessLocked = harness !== undefined;
 
   return (
     <div className="flex items-center justify-between gap-2 border-t border-border-muted px-3 py-2">
@@ -174,8 +173,8 @@ export function ComposerToolbar({
           <ModelSelector
             value={modelId}
             onValueChange={onModelChange}
-            harness={harnessLocked ? harness : undefined}
-            onHarnessResolved={harnessLocked ? undefined : onHarnessChange}
+            harness={showHarnessSelector ? undefined : harness}
+            onHarnessChange={showHarnessSelector ? onHarnessChange : undefined}
             disabled={disabled}
           />
         )}

package/src/composer/ConfigureMenu.tsx

@@ -2,6 +2,7 @@
 
 import { cn } from "@stigmer/theme";
 import { Popover } from "@base-ui/react/popover";
+import { useStigmerPortalContainer } from "../portal-container";
 import { ConfigureIcon } from "./icons";
 
 export interface ConfigureMenuItem {
@@ -60,6 +61,8 @@ export function ConfigureMenu({
     }
   };
 
+  const portalContainer = useStigmerPortalContainer();
+
   if (items.length === 0) return null;
 
   const activePanelItem = activePanel
@@ -91,7 +94,7 @@ export function ConfigureMenu({
           />
         )}
       </Popover.Trigger>
-      <Popover.Portal>
+      <Popover.Portal container={portalContainer}>
         <Popover.Positioner sideOffset={8} align="start">
           <Popover.Popup
             className={cn(

package/src/composer/ContextPopover.tsx

@@ -1,5 +1,6 @@
 import { cn } from "@stigmer/theme";
 import { Popover } from "@base-ui/react/popover";
+import { useStigmerPortalContainer } from "../portal-container";
 
 export function ContextPopover({
   icon,
@@ -21,6 +22,8 @@ export function ContextPopover({
   /** When true, hides the text label on small viewports (icon-only). */
   hideLabel?: boolean;
 }) {
+  const portalContainer = useStigmerPortalContainer();
+
   return (
     <Popover.Root open={open} onOpenChange={onOpenChange}>
       <Popover.Trigger
@@ -39,7 +42,7 @@ export function ContextPopover({
           </span>
         )}
       </Popover.Trigger>
-      <Popover.Portal>
+      <Popover.Portal container={portalContainer}>
         <Popover.Positioner sideOffset={8} align="start">
           <Popover.Popup
             className={[

package/src/github/useGitHubConnection.ts

@@ -480,10 +480,8 @@ export function useGitHubConnection(
         const tokenVar = {
           [GITHUB_TOKEN_KEY]: { value: accessToken, isSecret: true },
         };
-        const env = await personalEnvRef.current.getOrCreate(tokenVar);
-        if (!personalEnvHasKey(env, GITHUB_TOKEN_KEY)) {
-          await personalEnvRef.current.addVariables(tokenVar);
-        }
+        await personalEnvRef.current.getOrCreate();
+        await personalEnvRef.current.addVariables(tokenVar);
 
         setToken(accessToken);
 

package/src/index.ts

@@ -13,6 +13,9 @@ export { useStigmer } from "./hooks";
 export { ColorModeContext, useColorMode } from "./color-mode";
 export type { ColorMode, ResolvedColorMode } from "./color-mode";
 
+// Portal container
+export { useStigmerPortalContainer } from "./portal-container";
+
 // Deployment mode and resource availability
 export {
   DeploymentModeContext,

package/src/internal/menu.tsx

@@ -4,6 +4,7 @@ import * as React from "react";
 import { Menu as MenuPrimitive } from "@base-ui/react/menu";
 import { cn } from "@stigmer/theme";
 import { CheckIcon } from "lucide-react";
+import { useStigmerPortalContainer } from "../portal-container";
 
 // ---------------------------------------------------------------------------
 // SDK-internal styled Menu primitives over @base-ui/react.
@@ -35,8 +36,10 @@ function MenuContent({
     MenuPrimitive.Positioner.Props,
     "align" | "alignOffset" | "side" | "sideOffset"
   >) {
+  const portalContainer = useStigmerPortalContainer();
+
   return (
-    <MenuPrimitive.Portal>
+    <MenuPrimitive.Portal container={portalContainer}>
       <MenuPrimitive.Positioner
         className="isolate z-50 outline-none"
         align={align}

package/src/models/ModelSelector.tsx

@@ -3,6 +3,7 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { Popover } from "@base-ui/react/popover";
 import { cn } from "@stigmer/theme";
+import { useStigmerPortalContainer } from "../portal-container";
 import { useModelRegistry } from "./useModelRegistry";
 import type { ModelInfo, CostTier, SpeedTier } from "./registry";
 import { HARNESS_META, HARNESS_OPTIONS, type HarnessOption } from "./harness";
@@ -95,6 +96,8 @@ export function ModelSelector({
   className,
   disabled,
 }: ModelSelectorProps) {
+  const portalContainer = useStigmerPortalContainer();
+
   const isHarnessLocked = harness !== undefined;
   const [internalHarness, setInternalHarness] = useState<HarnessOption>(harness ?? "native");
   const activeHarness = harness ?? internalHarness;
@@ -104,6 +107,7 @@ export function ModelSelector({
   );
 
   const [open, setOpen] = useState(false);
+  const [harnessOpen, setHarnessOpen] = useState(false);
   const [searchQuery, setSearchQuery] = useState("");
   const [showAll, setShowAll] = useState(false);
   const [highlightIdx, setHighlightIdx] = useState(-1);
@@ -171,6 +175,7 @@ export function ModelSelector({
       setSearchQuery("");
       setShowAll(false);
       setHighlightIdx(-1);
+      setHarnessOpen(false);
     }
   }, [open]);
 
@@ -269,39 +274,83 @@ export function ModelSelector({
         <ChevronIcon />
       </Popover.Trigger>
 
-      <Popover.Portal>
+      <Popover.Portal container={portalContainer}>
         <Popover.Positioner sideOffset={4}>
           <Popover.Popup
             role="dialog"
             aria-label="Model selector"
             className={cn(
-              "z-popover w-80 rounded-lg border border-border bg-popover shadow-md",
+              "z-popover w-72 rounded-lg border border-border bg-popover shadow-md",
               "text-popover-foreground",
             )}
           >
-            {/* Harness dropdown (only when not locked) */}
-            {!isHarnessLocked && (
-              <div className="border-b border-border px-3 py-2">
-                <label className="mb-1 block text-[0.6rem] font-medium uppercase tracking-wider text-muted-foreground">
-                  Harness
-                </label>
-                <select
-                  value={activeHarness}
-                  onChange={(e) => handleHarnessChange(e.target.value as HarnessOption)}
+            {/* Harness selector — inline label + compact dropdown; disabled when locked */}
+            <div className="relative flex items-center justify-between border-b border-border px-3 py-2">
+              <span className="text-xs text-muted-foreground">Harness</span>
+              <button
+                type="button"
+                aria-haspopup="listbox"
+                aria-expanded={harnessOpen}
+                aria-label="Select harness"
+                disabled={isHarnessLocked}
+                className={cn(
+                  "inline-flex items-center gap-1.5 rounded-md border border-border",
+                  "bg-background px-2.5 py-1.5 text-xs text-foreground",
+                  "transition-colors",
+                  "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+                  isHarnessLocked
+                    ? "cursor-not-allowed opacity-50"
+                    : "hover:bg-accent-hover",
+                )}
+                onClick={() => {
+                  if (!isHarnessLocked) setHarnessOpen(!harnessOpen);
+                }}
+                onKeyDown={(e) => {
+                  if (e.key === "Escape" && harnessOpen) {
+                    e.stopPropagation();
+                    setHarnessOpen(false);
+                  }
+                }}
+              >
+                <span>{HARNESS_META[activeHarness].label}</span>
+                {!isHarnessLocked && <ChevronIcon />}
+              </button>
+
+              {!isHarnessLocked && harnessOpen && (
+                <div
+                  role="listbox"
+                  aria-label="Available harnesses"
                   className={cn(
-                    "w-full rounded-md border border-border bg-background px-2 py-1.5 text-xs text-foreground",
-                    "focus:outline-none focus:ring-2 focus:ring-ring",
+                    "absolute right-3 top-full z-10 mt-1 overflow-hidden rounded-md border border-border",
+                    "bg-popover shadow-md",
                   )}
-                  aria-label="Select harness"
                 >
-                  {resolvedHarnesses.map((h) => (
-                    <option key={h} value={h}>
-                      {HARNESS_META[h].label}
-                    </option>
-                  ))}
-                </select>
-              </div>
-            )}
+                  {resolvedHarnesses.map((h) => {
+                    const isActive = h === activeHarness;
+                    return (
+                      <button
+                        key={h}
+                        type="button"
+                        role="option"
+                        aria-selected={isActive}
+                        className={cn(
+                          "flex w-full items-center gap-2 px-2.5 py-1.5 text-xs transition-colors",
+                          "hover:bg-accent-hover",
+                          isActive && "font-medium",
+                        )}
+                        onClick={() => {
+                          handleHarnessChange(h);
+                          setHarnessOpen(false);
+                        }}
+                      >
+                        <span className="flex-1 text-left">{HARNESS_META[h].label}</span>
+                        {isActive && <CheckIcon className="shrink-0 text-primary" />}
+                      </button>
+                    );
+                  })}
+                </div>
+              )}
+            </div>
 
             {/* Search input */}
             <div className="border-b border-border px-3 py-1.5">
@@ -419,29 +468,24 @@ function ModelRow({
         "transition-colors",
         isHighlighted && "bg-accent text-accent-foreground",
         !isHighlighted && "hover:bg-accent-hover",
-        isSelected && "font-medium",
       )}
       onClick={onClick}
       onMouseEnter={onMouseEnter}
     >
       <div className="flex w-full items-center gap-2">
-        <span className="flex-1 truncate text-left">{model.displayName}</span>
-
-        {showSpeedBadge && (
-          <span className="shrink-0 text-[0.6rem] text-muted-foreground">
-            {SPEED_TIER_LABEL[model.speedTier]}
-          </span>
-        )}
+        <span className="flex-1 truncate text-left font-medium">{model.displayName}</span>
 
         <span className="shrink-0 text-[0.6rem] text-muted-foreground">
-          {COST_TIER_LABEL[model.costTier]}
+          {showSpeedBadge
+            ? `${SPEED_TIER_LABEL[model.speedTier]} ${COST_TIER_LABEL[model.costTier]}`
+            : COST_TIER_LABEL[model.costTier]}
         </span>
 
         {isSelected && <CheckIcon className="shrink-0 text-primary" />}
       </div>
 
       {showDescription && model.shortDescription && (
-        <span className="mt-0.5 block text-left text-[0.6rem] text-muted-foreground">
+        <span className="mt-0.5 block text-left text-[0.65rem] text-muted-foreground">
           {model.shortDescription}
         </span>
       )}

package/src/organization/OrgSwitcher.tsx

@@ -12,6 +12,7 @@ import {
 import { Dialog as DialogPrimitive } from "@base-ui/react/dialog";
 import type { Organization } from "@stigmer/protos/ai/stigmer/tenancy/organization/v1/api_pb";
 import { cn } from "@stigmer/theme";
+import { useStigmerPortalContainer } from "../portal-container";
 import {
   Menu,
   MenuContent,
@@ -66,6 +67,7 @@ export function OrgSwitcher({ onOrgChanged, className }: OrgSwitcherProps) {
   const { orgs, activeOrg, setActiveOrg, isLoading, error, retry, refresh } =
     useOrg();
   const [createOpen, setCreateOpen] = useState(false);
+  const portalContainer = useStigmerPortalContainer();
 
   const handleOrgSwitch = useCallback(
     (slug: string) => {
@@ -188,7 +190,7 @@ export function OrgSwitcher({ onOrgChanged, className }: OrgSwitcherProps) {
         open={createOpen}
         onOpenChange={(open) => setCreateOpen(open)}
       >
-        <DialogPrimitive.Portal>
+        <DialogPrimitive.Portal container={portalContainer}>
           <DialogPrimitive.Backdrop
             className={cn(
               "fixed inset-0 z-50 bg-black/50",