@kortix/ui 0.14.7 → 0.14.8

package/dist/terminal/session-terminal-connect-bar.js

@@ -25,7 +25,8 @@ export function SessionTerminalConnectBar({ projectSessionId }) {
 export function SessionTerminalConnectSteps({ id, projectSessionId, }) {
     const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
     const installCmd = useDeploymentCliInstallCommand(undefined);
-    const connectCmd = `kortix sessions connect ${projectSessionId}`;
+    // A shell through the Kortix PTY: it works on every harness. `sessions connect` attaches OpenCode's own TUI and fails on pi.
+    const connectCmd = `kortix sessions shell ${projectSessionId}`;
     return (_jsxs("ol", { id: id, className: "space-y-3 pr-1.5 pb-3 pl-3", children: [_jsx(CommandStep, { label: tI18nComplete.raw('textd236e9cd730b'), command: installCmd }), _jsx(CommandStep, { label: tI18nComplete.raw('text842bad27af42'), command: connectCmd })] }));
 }
 function CommandStep({ label, command }) {

package/dist/workspace/sidebar/session-brief-hover-card.js

@@ -150,6 +150,33 @@ export function SessionBriefCardHost() {
         el.style.transform = `translate(${rect.right}px, ${top}px)`;
         shown.current = true;
     }, [visible, activeSessionId, anchor, via]);
+    // Native listeners, not React's `onPointerEnter/Leave`. The card's content is
+    // portaled in from the row, so in React's tree it is the row's child, not
+    // this wrapper's: React fired the wrapper's leave the moment the pointer
+    // crossed from the gap onto the content, and the card closed under a pointer
+    // on its way to the Review link. The DOM tree is the one the pointer is in.
+    useEffect(() => {
+        const el = wrapperRef.current;
+        if (!el)
+            return;
+        const active = () => useSessionHoverStore.getState().activeSessionId;
+        const onEnter = () => {
+            const id = active();
+            if (id)
+                openSession(id);
+        };
+        const onLeave = () => {
+            const id = active();
+            if (id)
+                closeSession(id);
+        };
+        el.addEventListener('pointerenter', onEnter);
+        el.addEventListener('pointerleave', onLeave);
+        return () => {
+            el.removeEventListener('pointerenter', onEnter);
+            el.removeEventListener('pointerleave', onLeave);
+        };
+    }, [openSession, closeSession]);
     // WCAG 1.4.13: dismissible without moving the pointer. A scroll moves the
     // row away from the card, so it closes too, unless it scrolls the card itself.
     useEffect(() => {
@@ -169,7 +196,7 @@ export function SessionBriefCardHost() {
             window.removeEventListener('resize', dismiss);
         };
     }, [visible, dismiss]);
-    return createPortal(_jsx("div", { ref: wrapperRef, "data-slot": "session-brief-card", className: cn('fixed top-0 left-0 pl-3.5 starting:opacity-0', !visible && 'hidden'), style: { zIndex: floatingZ(depth) }, onPointerEnter: () => activeSessionId && openSession(activeSessionId), onPointerLeave: () => activeSessionId && closeSession(activeSessionId), children: _jsx("div", { ref: setSlot, className: cn(FLOATING_PANEL_SURFACE, 'w-72 overflow-hidden rounded-md shadow-xs') }) }), container ?? document.body);
+    return createPortal(_jsx("div", { ref: wrapperRef, "data-slot": "session-brief-card", className: cn('fixed top-0 left-0 pl-3.5 starting:opacity-0', !visible && 'hidden'), style: { zIndex: floatingZ(depth) }, children: _jsx("div", { ref: setSlot, className: cn(FLOATING_PANEL_SURFACE, 'w-72 overflow-hidden rounded-md shadow-xs') }) }), container ?? document.body);
 }
 /**
  * A row's trigger plus its brief, rendered into the shared card while the row

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kortix/ui",
-  "version": "0.14.7",
+  "version": "0.14.8",
   "description": "Kortix UI: the shared React component library for apps/web, Kortix Apps and SDK hosts. Tailwind v4 classes, themed by CSS variables.",
   "type": "module",
   "license": "Elastic-2.0",
@@ -911,6 +911,10 @@
       "types": "./dist/internal/capture/use-capture-area.d.ts",
       "import": "./dist/internal/capture/use-capture-area.js"
     },
+    "./internal/components/agent-mark": {
+      "types": "./dist/internal/components/agent-mark.d.ts",
+      "import": "./dist/internal/components/agent-mark.js"
+    },
     "./internal/components/hover-prefetch-link": {
       "types": "./dist/internal/components/hover-prefetch-link.d.ts",
       "import": "./dist/internal/components/hover-prefetch-link.js"
@@ -1463,6 +1467,10 @@
       "types": "./dist/markdown/setup-links/api-base.d.ts",
       "import": "./dist/markdown/setup-links/api-base.js"
     },
+    "./markdown/setup-links/app-credentials-form": {
+      "types": "./dist/markdown/setup-links/app-credentials-form.d.ts",
+      "import": "./dist/markdown/setup-links/app-credentials-form.js"
+    },
     "./markdown/setup-links/approval-decision": {
       "types": "./dist/markdown/setup-links/approval-decision.d.ts",
       "import": "./dist/markdown/setup-links/approval-decision.js"
@@ -2157,7 +2165,7 @@
     "@extend-ai/react-docx": "^0.7.5",
     "@extend-ai/react-xlsx": "0.13.4",
     "@glideapps/glide-data-grid": "6.0.4-alpha24",
-    "@kortix/llm-catalog": "0.14.7",
+    "@kortix/llm-catalog": "0.14.8",
     "@lezer/highlight": "1.2.3",
     "@paper-design/shaders-react": "^0.0.76",
     "@phosphor-icons/react": "2.1.10",
@@ -2246,7 +2254,7 @@
     "zustand": "^5.0.3"
   },
   "peerDependencies": {
-    "@kortix/sdk": "^0.14.7",
+    "@kortix/sdk": "^0.14.8",
     "@tanstack/react-query": "^5.75.2",
     "@types/react": ">=18",
     "react": ">=19",

package/dist/customize/agents/agent-nav.prototype.d.ts

@@ -1,35 +0,0 @@
-import { type ReactNode } from 'react';
-export declare const PROTOTYPE_ENABLED: boolean;
-export declare const NAV_VARIANTS: readonly [{
-    readonly key: "rail";
-}, {
-    readonly key: "tabs";
-}, {
-    readonly key: "groups";
-}, {
-    readonly key: "inline";
-}];
-export type NavVariant = (typeof NAV_VARIANTS)[number]['key'];
-export declare function useNavVariant(): NavVariant;
-export interface NavItem {
-    key: string;
-    label: string;
-    group: string;
-}
-interface NavProps {
-    groups: {
-        group: string;
-        items: NavItem[];
-    }[];
-    section: string;
-    href: (key: string) => string;
-    /** The current value per topic — "All", "2 picked", the model name. */
-    summaries?: Partial<Record<string, string>>;
-}
-export declare function GroupedUnderlineTabs({ groups, section, href }: NavProps): import("react").JSX.Element;
-export declare function GroupSwitchTabs({ groups, section, href }: NavProps): import("react").JSX.Element;
-export declare function InlineVerticalTabs({ groups, section, href, summaries, children, }: NavProps & {
-    children: ReactNode;
-}): import("react").JSX.Element;
-export declare function PrototypeSwitcher(): import("react").JSX.Element | null;
-export {};

package/dist/customize/agents/agent-nav.prototype.js

@@ -1,95 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * PROTOTYPE — throwaway. Answers one question: what replaces the agent page's
- * left rail? Rendered on the real agent page, switched with `?variant=`:
- *
- *   rail     — today's left rail (the baseline; no param)
- *   tabs     — grouped underline tabs under the header, no rail
- *   groups   — General / Access / Runtime switch + that group's tabs
- *   inline   — vertical tabs beside the content column, each with its value
- *
- * Read-only navigation over the same `?section=` links; nothing here mutates.
- * Once a variant wins, fold it into `agent-page.tsx` properly and delete this
- * file and the switcher. Dev builds only (`PROTOTYPE_ENABLED`).
- */
-import { CaretLeftIcon, CaretRightIcon } from '@phosphor-icons/react';
-import { useCallback, useEffect } from 'react';
-import { useTranslations } from '../../i18n/index.js';
-import { cn } from '../../internal/lib/utils.js';
-import { Tabs, TabsList, TabsTrigger } from '../../primitives/tabs.js';
-import { UiLink as Link, useUiPathname as usePathname, useUiRouter as useRouter, useUiSearchParams as useSearchParams, } from '../../providers/ui-provider.js';
-export const PROTOTYPE_ENABLED = process.env.NODE_ENV !== 'production';
-export const NAV_VARIANTS = [{ key: 'rail' }, { key: 'tabs' }, { key: 'groups' }, { key: 'inline' }];
-export function useNavVariant() {
-    const raw = useSearchParams().get('variant');
-    if (!PROTOTYPE_ENABLED)
-        return 'rail';
-    return NAV_VARIANTS.some((v) => v.key === raw) ? raw : 'rail';
-}
-/** `?section=` link that keeps `?variant=` so switching topics stays in the variant. */
-function useVariantHref(href) {
-    const variant = useSearchParams().get('variant');
-    return (key) => (variant ? `${href(key)}&variant=${variant}` : href(key));
-}
-// ─── tabs: grouped underline tabs ──────────────────────────────────────────
-export function GroupedUnderlineTabs({ groups, section, href }) {
-    const to = useVariantHref(href);
-    return (_jsx("nav", { className: "border-border/60 flex shrink-0 items-end gap-8 overflow-x-auto border-b px-5 pt-1", children: groups.map((g) => (_jsxs("div", { className: "flex shrink-0 flex-col gap-1", children: [_jsx("span", { className: "text-muted-foreground px-2 text-xs", children: g.group }), _jsx(Tabs, { value: section, children: _jsx(TabsList, { type: "underline", className: "h-auto gap-1 border-b-0", children: g.items.map((item) => (_jsx(TabsTrigger, { value: item.key, asChild: true, className: "w-fit flex-none px-2", children: _jsx(Link, { href: to(item.key), prefetch: true, children: item.label }) }, item.key))) }) })] }, g.group))) }));
-}
-// ─── groups: group switch + sub tabs ───────────────────────────────────────
-export function GroupSwitchTabs({ groups, section, href }) {
-    const to = useVariantHref(href);
-    const active = groups.find((g) => g.items.some((i) => i.key === section)) ?? groups[0];
-    return (_jsxs("nav", { className: "border-border/60 flex shrink-0 items-center gap-5 overflow-x-auto border-b px-5 py-2", children: [_jsx(Tabs, { value: active?.group, children: _jsx(TabsList, { children: groups.map((g) => (_jsx(TabsTrigger, { value: g.group, asChild: true, className: "w-fit flex-none", children: _jsx(Link, { href: to(g.items[0].key), prefetch: true, children: g.group }) }, g.group))) }) }), _jsx(Tabs, { value: section, children: _jsx(TabsList, { type: "underline", className: "h-auto gap-1 border-b-0", children: active?.items.map((item) => (_jsx(TabsTrigger, { value: item.key, asChild: true, className: "w-fit flex-none px-2", children: _jsx(Link, { href: to(item.key), prefetch: true, children: item.label }) }, item.key))) }) })] }));
-}
-// ─── inline: vertical tabs beside the content, with values ────────────────
-export function InlineVerticalTabs({ groups, section, href, summaries, children, }) {
-    const to = useVariantHref(href);
-    return (_jsxs("div", { className: "mx-auto flex w-full max-w-5xl items-start gap-14 px-4 py-10 pb-32 lg:py-14", children: [_jsx("nav", { className: "sticky top-0 flex w-52 shrink-0 flex-col gap-4", children: groups.map((g) => (_jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("span", { className: "text-muted-foreground px-2.5 pb-1 text-xs", children: g.group }), g.items.map((item) => {
-                            const isActive = item.key === section;
-                            return (_jsxs(Link, { href: to(item.key), prefetch: true, "aria-current": isActive ? 'page' : undefined, className: cn('flex items-center justify-between gap-3 rounded-md px-2.5 py-1.5 text-sm transition-none', isActive
-                                    ? 'bg-active text-foreground font-medium'
-                                    : 'text-muted-foreground hover:bg-hover hover:text-foreground'), children: [_jsx("span", { className: "truncate", children: item.label }), summaries?.[item.key] ? (_jsx("span", { className: "text-muted-foreground shrink-0 text-xs font-normal tabular-nums", children: summaries[item.key] })) : null] }, item.key));
-                        })] }, g.group))) }), _jsx("div", { className: "min-w-0 max-w-2xl flex-1", children: children })] }));
-}
-// ─── the floating switcher ────────────────────────────────────────────────
-export function PrototypeSwitcher() {
-    const router = useRouter();
-    const pathname = usePathname();
-    const search = useSearchParams();
-    const current = useNavVariant();
-    const t = useTranslations('agentNavPrototype');
-    const labels = {
-        rail: t('variantRail'),
-        tabs: t('variantTabs'),
-        groups: t('variantGroups'),
-        inline: t('variantInline'),
-    };
-    const index = NAV_VARIANTS.findIndex((v) => v.key === current);
-    const go = useCallback((step) => {
-        const next = NAV_VARIANTS[(index + step + NAV_VARIANTS.length) % NAV_VARIANTS.length];
-        const params = new URLSearchParams(search.toString());
-        if (next.key === 'rail')
-            params.delete('variant');
-        else
-            params.set('variant', next.key);
-        router.replace(`${pathname}?${params.toString()}`, { scroll: false });
-    }, [index, pathname, router, search]);
-    useEffect(() => {
-        const onKey = (event) => {
-            const target = event.target;
-            if (target?.closest('input, textarea, select, [contenteditable="true"]'))
-                return;
-            if (event.key === 'ArrowLeft')
-                go(-1);
-            if (event.key === 'ArrowRight')
-                go(1);
-        };
-        window.addEventListener('keydown', onKey);
-        return () => window.removeEventListener('keydown', onKey);
-    }, [go]);
-    if (!PROTOTYPE_ENABLED)
-        return null;
-    return (_jsx("div", { className: "pointer-events-none fixed inset-x-0 bottom-20 z-50 flex justify-center", children: _jsxs("div", { className: "bg-foreground text-background pointer-events-auto flex items-center gap-1 rounded-full p-1 shadow-lg", children: [_jsx("button", { type: "button", "aria-label": t('previousVariant'), onClick: () => go(-1), className: "flex size-7 items-center justify-center rounded-full hover:bg-background/15", children: _jsx(CaretLeftIcon, { className: "size-3.5" }) }), _jsxs("span", { className: "min-w-56 px-2 text-center text-xs tabular-nums", children: [String.fromCharCode(65 + index), " \u00B7 ", labels[NAV_VARIANTS[index].key]] }), _jsx("button", { type: "button", "aria-label": t('nextVariant'), onClick: () => go(1), className: "flex size-7 items-center justify-center rounded-full hover:bg-background/15", children: _jsx(CaretRightIcon, { className: "size-3.5" }) })] }) }));
-}