@kortix/ui 0.14.4 → 0.14.5

package/dist/workspace/sidebar/session-status-mark.d.ts

@@ -1,5 +1,19 @@
 import type { SessionDisplayStatus } from '../../session/actions/session-label.js';
+/**
+ * A review is overdue when an open change request has not moved for 24h.
+ * The row then turns the review glyph from blue (your turn) to yellow (still
+ * waiting on you). Merged and closed requests never count.
+ */
+export declare function isReviewOverdue(changeRequests: readonly {
+    status: string;
+    updated_at: string;
+}[], now?: number): boolean;
 /** A status glyph with stable 16px geometry across every session state. */
-export declare function SessionStatusMark({ status }: {
+export declare function SessionStatusMark({ status, waitingOn, overdue, }: {
     status: SessionDisplayStatus;
+    /** `needs-you` only: an agent question or permission (`answer`) or a change
+     *  request (`review`). An answer blocks the agent, so callers pass it first. */
+    waitingOn?: 'answer' | 'review';
+    /** `needs-you` review only: it has waited too long, see `isReviewOverdue`. */
+    overdue?: boolean;
 }): import("react").JSX.Element;

package/dist/workspace/sidebar/session-status-mark.js

@@ -1,24 +1,70 @@
 'use client';
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import Loading from '../../primitives/loading.js';
-import { ClockCounterClockwiseIcon } from '@phosphor-icons/react';
-const STATUS_MARK_STYLE = {
-    'needs-you': { color: 'var(--kortix-green)', glyph: 'ring', fill: true },
-    starting: { color: 'var(--kortix-yellow)', glyph: 'ring', fill: false },
-    running: { color: 'var(--kortix-green)', glyph: 'ring', fill: true },
-    done: { color: 'var(--muted-foreground)', glyph: 'check', fill: false },
-    stopped: { color: 'var(--muted-foreground)', glyph: 'ring', fill: false },
-    failed: { color: 'var(--kortix-red)', glyph: 'ring', fill: true },
-    legacy: { color: 'var(--muted-foreground)', glyph: 'ring', fill: false },
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ClockCounterClockwiseIcon, GitDiffIcon, QuestionIcon } from '@phosphor-icons/react';
+/**
+ * Color says who acts: gray nobody, green the agent, blue you (yellow once it waits
+ * over 24h), red broken.
+ * `starting` draws the stopped ring: a wake is meant to be instant, so it gets
+ * no state of its own, and blue and yellow stay reserved for `needs-you`.
+ */
+const RING_STATUS_STYLE = {
+    starting: { color: 'var(--muted-foreground)', fill: false },
+    stopped: { color: 'var(--muted-foreground)', fill: false },
+    failed: { color: 'var(--kortix-red)', fill: true },
 };
+const DOT_COUNT = 8;
+const DOT_RADIUS = 6;
+const DOTS = Array.from({ length: DOT_COUNT }, (_, i) => {
+    const angle = (i * 2 * Math.PI) / DOT_COUNT;
+    return { cx: 8 + DOT_RADIUS * Math.sin(angle), cy: 8 - DOT_RADIUS * Math.cos(angle) };
+});
+/** Behind the arc, clockwise: each dash fainter, so the still glyph reads as
+ *  turning. Nothing animates: many rows can be working at once. */
+const WORKING_TRAIL = [
+    { d: 'M2.84 4.39 A6.3 6.3 0 0 1 4.39 2.84', opacity: 0.85 },
+    { d: 'M1.8 9.1 A6.3 6.3 0 0 1 1.8 6.9', opacity: 0.55 },
+    { d: 'M4.39 13.16 A6.3 6.3 0 0 1 2.84 11.61', opacity: 0.25 },
+];
+const GREEN_GLYPH = {
+    height: '16',
+    width: '16',
+    viewBox: '0 0 16 16',
+    style: { color: 'var(--kortix-green)' },
+    className: 'shrink-0',
+    'aria-hidden': true,
+};
+/** `done` (agent idle, ready for a prompt): the dot ring filled with a core. */
+function ReadyGlyph() {
+    return (_jsxs("svg", { ...GREEN_GLYPH, "data-glyph": "ready", children: [DOTS.map((dot, i) => (_jsx("circle", { "data-dot": "", cx: dot.cx, cy: dot.cy, r: "1", fill: "currentColor" }, i))), _jsx("circle", { "data-core": "", cx: "8", cy: "8", r: "3.6", fill: "currentColor" })] }));
+}
+/** `running`: a solid half arc leading a fading trail of dashes. */
+function WorkingGlyph() {
+    return (_jsxs("svg", { ...GREEN_GLYPH, "data-glyph": "working", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", children: [WORKING_TRAIL.map((dash) => (_jsx("path", { "data-dash": "", d: dash.d, opacity: dash.opacity }, dash.d))), _jsx("path", { d: "M8 1.7 A6.3 6.3 0 0 1 8 14.3" })] }));
+}
+const REVIEW_OVERDUE_MS = 24 * 60 * 60 * 1000;
+/**
+ * A review is overdue when an open change request has not moved for 24h.
+ * The row then turns the review glyph from blue (your turn) to yellow (still
+ * waiting on you). Merged and closed requests never count.
+ */
+export function isReviewOverdue(changeRequests, now = Date.now()) {
+    return changeRequests.some((cr) => cr.status === 'open' && now - Date.parse(cr.updated_at) >= REVIEW_OVERDUE_MS);
+}
 /** A status glyph with stable 16px geometry across every session state. */
-export function SessionStatusMark({ status }) {
-    const style = STATUS_MARK_STYLE[status];
-    if (status === 'starting') {
-        return _jsx(Loading, { className: "text-kortix-yellow size-3.5", "aria-hidden": true });
+export function SessionStatusMark({ status, waitingOn = 'review', overdue = false, }) {
+    if (status === 'done')
+        return _jsx(ReadyGlyph, {});
+    if (status === 'running')
+        return _jsx(WorkingGlyph, {});
+    if (status === 'needs-you' && waitingOn === 'answer') {
+        return (_jsx(QuestionIcon, { "data-glyph": "question", className: "size-4 shrink-0", style: { color: 'var(--kortix-blue)' }, "aria-hidden": true }));
+    }
+    if (status === 'needs-you') {
+        return (_jsx(GitDiffIcon, { "data-glyph": "review", className: "size-4 shrink-0", style: { color: overdue ? 'var(--kortix-yellow)' : 'var(--kortix-blue)' }, "aria-hidden": true }));
     }
     if (status === 'legacy') {
-        return (_jsx(ClockCounterClockwiseIcon, { className: "size-3.5 shrink-0", style: { color: style.color }, "aria-hidden": true }));
+        return (_jsx(ClockCounterClockwiseIcon, { className: "size-3.5 shrink-0", style: { color: 'var(--muted-foreground)' }, "aria-hidden": true }));
     }
-    return (_jsx("svg", { height: "16", width: "16", viewBox: "0 0 16 16", strokeLinejoin: "round", style: { color: style.color }, className: "shrink-0", "aria-hidden": true, children: style.glyph === 'check' ? (_jsx("path", { d: "M4 8.4 L6.8 11.2 L12 5.2", stroke: "currentColor", fill: "none", strokeWidth: "1.5", strokeLinecap: "round" })) : (_jsxs(_Fragment, { children: [_jsx("circle", { cx: "8", cy: "8", r: "6.3", stroke: "currentColor", fill: "none", strokeWidth: "1.5" }), style.fill && (_jsx("circle", { cx: "8", cy: "8", r: status === 'needs-you' ? 3.2 : 4, fill: "currentColor" }))] })) }));
+    const style = RING_STATUS_STYLE[status];
+    return (_jsxs("svg", { height: "16", width: "16", viewBox: "0 0 16 16", style: { color: style.color }, className: "shrink-0", "aria-hidden": true, children: [_jsx("circle", { cx: "8", cy: "8", r: "6.3", stroke: "currentColor", fill: "none", strokeWidth: "1.5" }), style.fill && _jsx("circle", { cx: "8", cy: "8", r: "4", fill: "currentColor" })] }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kortix/ui",
-  "version": "0.14.4",
+  "version": "0.14.5",
   "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",
@@ -1637,6 +1637,10 @@
       "types": "./dist/session/models/model-grouping.d.ts",
       "import": "./dist/session/models/model-grouping.js"
     },
+    "./session/models/model-search-empty": {
+      "types": "./dist/session/models/model-search-empty.d.ts",
+      "import": "./dist/session/models/model-search-empty.js"
+    },
     "./session/models/model-selector": {
       "types": "./dist/session/models/model-selector.d.ts",
       "import": "./dist/session/models/model-selector.js"
@@ -2153,7 +2157,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.4",
+    "@kortix/llm-catalog": "0.14.5",
     "@lezer/highlight": "1.2.3",
     "@paper-design/shaders-react": "^0.0.76",
     "@phosphor-icons/react": "2.1.10",
@@ -2242,7 +2246,7 @@
     "zustand": "^5.0.3"
   },
   "peerDependencies": {
-    "@kortix/sdk": "^0.14.4",
+    "@kortix/sdk": "^0.14.5",
     "@tanstack/react-query": "^5.75.2",
     "@types/react": ">=18",
     "react": ">=19",

package/skills/kortix-ui/SKILL.md

@@ -84,7 +84,7 @@ Theme with `@kortix/ui/theme`, never by forking a component: `themeToCss(theme)`
 
 | Import from | Names |
 | --- | --- |
-| `@kortix/ui` (adapters) | `cn`, `UiProvider`, `defaultUiStrings`, `useUiStrings`, `useUiLink`, `useUiImage`, `useUiBrand`, `UiStrings`, `UiStringsInput`, `UiLinkProps`, `UiLinkComponent`, `UiImageProps`, `UiImageComponent`, `UiBrand`, `UseUiBrand`, `useIsDark`, `useUiRouter`, `useUiShallowNavigate`, `UiShallowNavigate`, `useUiPathname`, `useUiSearchParams`, `useUiParams`, `defaultUiNavigation`, `UiNavigation`, `UiRouter`, `UiRouteParams`, `UiSearchParams`, `useUiViewerId`, `useUiHostConfig`, `defaultUiHostConfig`, `UiHostConfig`, `SessionIdsProvider`, `useSessionIds`, `UiSessionIds` |
+| `@kortix/ui` (adapters) | `cn`, `UiProvider`, `defaultUiStrings`, `useUiStrings`, `useUiLink`, `useUiImage`, `useUiBrand`, `UiStrings`, `UiStringsInput`, `UiLinkProps`, `UiLinkComponent`, `UiImageProps`, `UiImageComponent`, `UiBrand`, `UseUiBrand`, `useIsDark`, `useUiRouter`, `useUiShallowNavigate`, `UiShallowNavigate`, `useUiPathname`, `useUiSearchParams`, `useUiParams`, `defaultUiNavigation`, `UiNavigation`, `UiRouter`, `UiRouteParams`, `UiSearchParams`, `useUiViewerId`, `useUiHostConfig`, `defaultUiHostConfig`, `UiHostConfig`, `UiSlashAction`, `SessionIdsProvider`, `useSessionIds`, `UiSessionIds` |
 | `@kortix/ui` (actions, display) | `Button`, `buttonVariants`, `ButtonProps`, `Badge`, `badgeVariants`, `Card`, `CardAction`, `CardButton`, `CardContent`, `CardDescription`, `CardEyebrow`, `CardFeature`, `CardFooter`, `CardGroup`, `CardHeader`, `CardImage`, `CardMedia`, `CardTitle`, `CardButtonProps`, `CardButtonSize`, `CardButtonVariant`, `CardGroupProps`, `CardLogo`, `CardProps`, `Separator`, `Skeleton` |
 | `@kortix/ui` (forms) | `Input`, `inputFocusClasses`, `inputInvalidClasses`, `inputSurfaceClasses`, `inputTransitionClasses`, `InputProps`, `useAutosizeTextArea`, `Textarea`, `AutosizeTextAreaRef`, `AutosizeTextAreaProps`, `Label`, `Checkbox`, `CheckboxProps`, `CheckboxVariant`, `Switch`, `SwitchProps`, `Select`, `SelectContent`, `SelectGroup`, `SelectItem`, `SelectLabel`, `SelectScrollDownButton`, `SelectScrollUpButton`, `SelectSeparator`, `SelectTrigger`, `SelectValue`, `SelectTriggerProps` |
 | `@kortix/ui` (overlays) | `Modal`, `ModalBody`, `ModalClose`, `ModalContent`, `ModalContentInner`, `ModalDescription`, `ModalFooter`, `ModalHeader`, `ModalOverlay`, `ModalPortal`, `ModalTitle`, `ModalTrigger`, `Hint`, `HintProps`, `Popover`, `PopoverAnchor`, `PopoverContent`, `PopoverTrigger`, `DropdownMenu`, `DropdownMenuCheckboxItem`, `DropdownMenuContent`, `DropdownMenuGroup`, `DropdownMenuItem`, `DropdownMenuLabel`, `DropdownMenuPortal`, `DropdownMenuRadioGroup`, `DropdownMenuRadioItem`, `DropdownMenuSeparator`, `DropdownMenuShortcut`, `DropdownMenuSub`, `DropdownMenuSubContent`, `DropdownMenuSubTrigger`, `DropdownMenuTrigger` |

package/dist/customize/sections/view/sandbox-provider-result.d.ts

@@ -1,47 +0,0 @@
-import { type SandboxProviderTransitionState, type UpdateProjectSandboxProviderResult } from '@kortix/sdk';
-import type { QueryClient } from '@tanstack/react-query';
-/**
- * A provider-migration transition never changes again once it reaches one of
- * these statuses (mirrors the API's TERMINAL_TRANSITION_STATUSES) — plus the
- * immediate `noop`/`cleared` markers a transition row can carry. Polling stops
- * on any of them.
- */
-export declare const SANDBOX_PROVIDER_TERMINAL_STATUSES: Set<string>;
-/** A missing/absent status (no live transition) is treated as terminal too. */
-export declare function isSandboxProviderTransitionTerminal(status: string | null | undefined): boolean;
-type CacheClient = Pick<QueryClient, 'setQueryData' | 'invalidateQueries'>;
-/**
- * FIX-L: apply the PATCH /sandbox-provider result to the query cache.
- *
- * Writes the project caches ONLY for the immediate `kind:'project'` result. A
- * `kind:'preparation'` result is a durable TRANSITION object, not a project —
- * writing it into `qk.project.summary(id)` would corrupt the cached project
- * shape (it has no repo_url / metadata / experimental_features …). On
- * preparation we leave the project cache untouched and return `'preparation'`
- * so the caller polls the transition instead. Returns the result's kind.
- */
-export declare function applySandboxProviderResult(queryClient: CacheClient, projectId: string, result: UpdateProjectSandboxProviderResult): 'project' | 'preparation';
-export interface PollSandboxProviderTransitionOptions {
-    /** Injected for tests; defaults to the SDK poll call. */
-    fetchState?: (projectId: string) => Promise<SandboxProviderTransitionState>;
-    /** Called once when polling stops (terminal status, no transition, or exhausted).
-     *  `null` means the poll ended without a readable state (404/no-transition). */
-    onSettled?: (state: SandboxProviderTransitionState | null) => void;
-    maxAttempts?: number;
-    baseDelayMs?: number;
-    maxDelayMs?: number;
-    /** Cooperative cancellation (e.g. component unmounted). */
-    signal?: {
-        aborted: boolean;
-    };
-    /** Injected for tests; defaults to setTimeout. */
-    sleep?: (ms: number) => Promise<void>;
-}
-/**
- * FIX-L: poll the durable provider-migration transition after a `kind:'preparation'`
- * switch. Bounded (maxAttempts) with exponential backoff; stops on a terminal
- * status, and treats a 404 / no-transition / any read error as terminal (nothing
- * left to poll). Never throws — surfaces progress via `onSettled`.
- */
-export declare function pollSandboxProviderTransition(projectId: string, opts?: PollSandboxProviderTransitionOptions): Promise<SandboxProviderTransitionState | null>;
-export {};

package/dist/customize/sections/view/sandbox-provider-result.js

@@ -1,79 +0,0 @@
-import { getProjectSandboxProviderTransition, } from '@kortix/sdk';
-import { qk } from '@kortix/sdk/react';
-/**
- * A provider-migration transition never changes again once it reaches one of
- * these statuses (mirrors the API's TERMINAL_TRANSITION_STATUSES) — plus the
- * immediate `noop`/`cleared` markers a transition row can carry. Polling stops
- * on any of them.
- */
-export const SANDBOX_PROVIDER_TERMINAL_STATUSES = new Set([
-    'activated',
-    'failed',
-    'superseded',
-    'cancelled',
-    'noop',
-    'cleared',
-]);
-/** A missing/absent status (no live transition) is treated as terminal too. */
-export function isSandboxProviderTransitionTerminal(status) {
-    return status == null || SANDBOX_PROVIDER_TERMINAL_STATUSES.has(status);
-}
-/**
- * FIX-L: apply the PATCH /sandbox-provider result to the query cache.
- *
- * Writes the project caches ONLY for the immediate `kind:'project'` result. A
- * `kind:'preparation'` result is a durable TRANSITION object, not a project —
- * writing it into `qk.project.summary(id)` would corrupt the cached project
- * shape (it has no repo_url / metadata / experimental_features …). On
- * preparation we leave the project cache untouched and return `'preparation'`
- * so the caller polls the transition instead. Returns the result's kind.
- */
-export function applySandboxProviderResult(queryClient, projectId, result) {
-    if (result.kind !== 'project')
-        return 'preparation';
-    // Strip the discriminant so the cached value is a pure KortixProject.
-    const { kind: _kind, ...project } = result;
-    const cached = project;
-    queryClient.setQueryData(qk.project.summary(projectId), cached);
-    queryClient.setQueryData(qk.project.detail(projectId), (c) => c ? { ...c, project: cached } : c);
-    queryClient.invalidateQueries({ queryKey: qk.project.detail(projectId) });
-    // qk.projects.scope(), not the precise per-account form: restores the
-    // reach the old bare projects-literal prefix match had — every account's
-    // list, and the accountless slot the marketplace picker reads. A
-    // sandbox-provider switch is rare — over-invalidating costs nothing.
-    queryClient.invalidateQueries({ queryKey: qk.projects.scope() });
-    return 'project';
-}
-/**
- * FIX-L: poll the durable provider-migration transition after a `kind:'preparation'`
- * switch. Bounded (maxAttempts) with exponential backoff; stops on a terminal
- * status, and treats a 404 / no-transition / any read error as terminal (nothing
- * left to poll). Never throws — surfaces progress via `onSettled`.
- */
-export async function pollSandboxProviderTransition(projectId, opts = {}) {
-    const fetchState = opts.fetchState ?? getProjectSandboxProviderTransition;
-    const maxAttempts = opts.maxAttempts ?? 60;
-    const baseDelayMs = opts.baseDelayMs ?? 2_000;
-    const maxDelayMs = opts.maxDelayMs ?? 15_000;
-    const sleep = opts.sleep ?? ((ms) => new Promise((r) => setTimeout(r, ms)));
-    let last = null;
-    for (let attempt = 0; attempt < maxAttempts; attempt++) {
-        if (opts.signal?.aborted)
-            return last;
-        try {
-            last = await fetchState(projectId);
-        }
-        catch {
-            // 404 / no transition / transient read failure → nothing to keep polling.
-            opts.onSettled?.(null);
-            return null;
-        }
-        if (isSandboxProviderTransitionTerminal(last?.latest?.status)) {
-            opts.onSettled?.(last);
-            return last;
-        }
-        await sleep(Math.min(baseDelayMs * 2 ** attempt, maxDelayMs));
-    }
-    opts.onSettled?.(last);
-    return last;
-}