@kortix/ui 0.14.8 → 0.14.9

package/dist/internal/stores/file-preview-store.js

@@ -1,10 +1,18 @@
 import { getActivePanelSessionId, openFileInSessionPanel } from './session-browser-store.js';
+import { useSyncExternalStore } from 'react';
 import { create } from 'zustand';
+/** One key per sandbox file, with or without the `/workspace/` prefix. */
+export function fileCaptionKey(path) {
+    return path.trim().replace(/^\/?workspace\//, '').replace(/^\/+/, '');
+}
 export const useFilePreviewStore = create((set) => ({
     isOpen: false,
     filePath: null,
     lineNumber: undefined,
-    openPreview: (filePath, lineNumber) => {
+    captions: {},
+    openPreview: (filePath, lineNumber, caption) => {
+        if (caption)
+            set((s) => ({ captions: { ...s.captions, [fileCaptionKey(filePath)]: caption } }));
         // Inside a session the file opens in the panel's detail layer — the THING,
         // not the file manager around it (see easy-panel.tsx's handleOpenOutput).
         // `…Silently` because Easy must never write `viewBySession`: that key is
@@ -22,3 +30,13 @@ export const useFilePreviewStore = create((set) => ({
         set({ isOpen: false, filePath: null, lineNumber: undefined });
     },
 }));
+/**
+ * The caption the viewer shows under `filePath`, when it was opened with one.
+ * The live state on both snapshots: a static render (tests, a prerender)
+ * reads what was opened, not the store's initial state.
+ */
+export function useFileCaption(filePath) {
+    const key = fileCaptionKey(filePath);
+    const read = () => useFilePreviewStore.getState().captions[key];
+    return useSyncExternalStore(useFilePreviewStore.subscribe, read, read);
+}

package/dist/internal/stores/kortix-computer-store.js

@@ -110,6 +110,9 @@ export const useKortixComputerStore = create()(devtools((set, get) => ({
         if (!open) {
             // The person closed it: coming back must not reopen it.
             forgetActivePanel(get());
+            // A tool closed while the computer boots stays closed after the
+            // boot→ready handoff: drop the intent it would replant.
+            update._bootQuickView = null;
             update.panelSplit = null;
             update.panelAspect = null;
             update.isExpanded = false;

package/dist/internal/stores/sidebar-nav-store.d.ts

@@ -8,7 +8,7 @@
  * (`customize-sidebar-modal.tsx` syncs it). A row a project does not offer (a flag is off, a permission is denied)
  * keeps its place here and simply does not render.
  */
-export declare const SIDEBAR_NAV_ITEM_IDS: readonly ["customize", "apps", "files", "rooms", "goals"];
+export declare const SIDEBAR_NAV_ITEM_IDS: readonly ["customize", "apps", "files", "rooms", "goals", "artifacts"];
 export type SidebarNavItemId = (typeof SIDEBAR_NAV_ITEM_IDS)[number];
 /**
  * `never` moves the row into the More menu (`project-nav-items.tsx`), so its

package/dist/internal/stores/sidebar-nav-store.js

@@ -13,7 +13,7 @@ import { registerPersistedStore, resetPersistedStore } from './persisted-store-r
  */
 // Review (2026-10-17) and Reminders (2026-10-19) left the sidebar for Customize
 // tabs. A saved layout that still names one drops the id in `normalizeSidebarNav`.
-export const SIDEBAR_NAV_ITEM_IDS = ['customize', 'apps', 'files', 'rooms', 'goals'];
+export const SIDEBAR_NAV_ITEM_IDS = ['customize', 'apps', 'files', 'rooms', 'goals', 'artifacts'];
 /** The layout before anyone customizes it. */
 export const SIDEBAR_NAV_DEFAULTS = [
     { id: 'customize', visibility: 'always' },
@@ -24,6 +24,8 @@ export const SIDEBAR_NAV_DEFAULTS = [
     { id: 'rooms', visibility: 'never' },
     // Goals (2026-10-21, flag `goals`): objectives agents own until verified done.
     { id: 'goals', visibility: 'always' },
+    // Artifacts (2026-10-23, flag `artifacts`): published docs, slides, boards, dashboards.
+    { id: 'artifacts', visibility: 'always' },
 ];
 function isItemId(value) {
     return SIDEBAR_NAV_ITEM_IDS.includes(value);

package/dist/lib/routes.d.ts

@@ -6,7 +6,9 @@
  *
  * A route that returns null is a page the host does not serve: every link to
  * it is hidden and no navigation goes there. `project` and `session` are the
- * two pages every session host serves, so they cannot be null.
+ * two pages every session host serves, so they cannot be null. `channel` and
+ * `dm` cannot be null either: the sidebar links them only while the project's
+ * `project_channels` flag is on.
  *
  * Defaults: apps/web's paths.
  */
@@ -24,6 +26,8 @@ export interface UiRoutes {
     rooms: (projectId: string) => string | null;
     /** The project's goals (flag `goals`); a goal is `<goals>/<scope>/<slug>`. */
     goals: (projectId: string) => string | null;
+    /** The project's artifacts (flag `artifacts`); one is `<artifacts>/<artifact_id>`. */
+    artifacts: (projectId: string) => string | null;
     members: (projectId: string) => string | null;
     /** The project settings page, on its sandbox section. */
     sandboxSettings: (projectId: string) => string | null;
@@ -33,11 +37,19 @@ export interface UiRoutes {
      * capability root, for example `models` or `triggers?id=<slug>`.
      */
     customize: (projectId: string, path?: string) => string | null;
+    /** A channel of the project, by slug (`project_channels` flag). */
+    channel: (projectId: string, slug: string) => string;
+    /** The caller's direct messages with one agent, by agent name (`project_channels` flag). */
+    dm: (projectId: string, agentName: string) => string;
+    /** The project's Company memory (`project_channels` flag); a page is `?page=<page_id>`. */
+    memory: (projectId: string) => string | null;
 }
 export declare const defaultUiRoutes: UiRoutes;
 /** Replaces the routes the host passes. Omitted routes keep their default. */
 export declare function setUiRoutes(overrides: Partial<UiRoutes>): void;
 export declare function uiRoutes(): UiRoutes;
+/** A channel slug or DM agent name from its URL segment; null when a hand-typed escape is malformed. */
+export declare function decodeSpaceSegment(segment: string): string | null;
 /**
  * A capability page's URL for the customize pages themselves: they are mounted
  * only by a host that serves them, so a null `customize` route falls back to

package/dist/lib/routes.js

@@ -7,9 +7,13 @@ const DEFAULT_ROUTES = {
     apps: (p) => `/projects/${p}/apps`,
     rooms: (p) => `/projects/${p}/rooms`,
     goals: (p) => `/projects/${p}/goals`,
+    artifacts: (p) => `/projects/${p}/artifacts`,
     members: (p) => `/projects/${p}/members`,
     sandboxSettings: (p) => `/projects/${p}/config?section=sandbox`,
     customize: (p, path) => `/projects/${p}/customize${path ? `/${path}` : ''}`,
+    channel: (p, slug) => `/projects/${p}/c/${slug}`,
+    dm: (p, agentName) => `/projects/${p}/dm/${encodeURIComponent(agentName)}`,
+    memory: (p) => `/projects/${p}/memory`,
 };
 export const defaultUiRoutes = DEFAULT_ROUTES;
 let routes = DEFAULT_ROUTES;
@@ -20,6 +24,15 @@ export function setUiRoutes(overrides) {
 export function uiRoutes() {
     return routes;
 }
+/** A channel slug or DM agent name from its URL segment; null when a hand-typed escape is malformed. */
+export function decodeSpaceSegment(segment) {
+    try {
+        return decodeURIComponent(segment);
+    }
+    catch {
+        return null;
+    }
+}
 /**
  * A capability page's URL for the customize pages themselves: they are mounted
  * only by a host that serves them, so a null `customize` route falls back to

package/dist/markdown/index.d.ts

@@ -10,7 +10,8 @@ export type { MarkdownPolicy, MarkdownTrust, MarkdownVariant } from './markdown-
 export { UnifiedMarkdown } from './unified-markdown.js';
 export type { UnifiedMarkdownProps } from './unified-markdown.js';
 export { CopyOverlay } from './code/index.js';
-export { HighlightedCode } from './code/code-block.js';
+export { CodeHighlight, HighlightedCode } from './code/code-block.js';
+export { INLINE_CODE } from './code/inline-chip.js';
 export { CopyButton } from './copy-button.js';
 export { MarkdownWithFrontmatter } from './markdown-frontmatter.js';
 export { languageLabel, normalizeLanguage } from './unified-markdown-utils.js';

package/dist/markdown/index.js

@@ -8,7 +8,8 @@
 export { markdownPolicy } from './markdown-policy.js';
 export { UnifiedMarkdown } from './unified-markdown.js';
 export { CopyOverlay } from './code/index.js';
-export { HighlightedCode } from './code/code-block.js';
+export { CodeHighlight, HighlightedCode } from './code/code-block.js';
+export { INLINE_CODE } from './code/inline-chip.js';
 export { CopyButton } from './copy-button.js';
 export { MarkdownWithFrontmatter } from './markdown-frontmatter.js';
 export { languageLabel, normalizeLanguage } from './unified-markdown-utils.js';

package/dist/markdown/setup-links/approval-decision.d.ts

@@ -8,6 +8,7 @@ import { type ApprovalLinkDetails } from '@kortix/sdk';
 export declare function approvalIdentity(details: ApprovalLinkDetails): {
     connector: string | null;
     action: string | null;
+    slug: string | null;
     iconUrl: string | null;
 };
 /**

package/dist/markdown/setup-links/approval-decision.js

@@ -12,7 +12,7 @@ import { OutcomeTitle } from '../../internal/auth/auth-consent.js';
 import { Rise, StepHeader } from '../../internal/auth/auth-primitives.js';
 import { useTranslations } from '../../i18n/index.js';
 import { getApprovalLink, resolveApproval } from '@kortix/sdk';
-import { CheckCircleIcon, ClockIcon, EyeIcon, MinusCircleIcon, PencilSimpleIcon, UserIcon, WarningIcon, XCircleIcon, } from '@phosphor-icons/react';
+import { CheckCircleIcon, ClockIcon, EyeIcon, MinusCircleIcon, PencilSimpleIcon, ShieldCheckIcon, UserIcon, WarningIcon, XCircleIcon, } from '@phosphor-icons/react';
 import { UiLink as Link, useUiRouter } from '../../providers/ui-provider.js';
 import { useEffect, useState } from 'react';
 import { isApprovalExpiredError } from '../../internal/lib/approval-expired.js';
@@ -46,6 +46,7 @@ export function approvalIdentity(details) {
         connector: details.connector_name ??
             (details.connector ? details.connector.charAt(0).toUpperCase() + details.connector.slice(1) : null),
         action: actionLabel(details.action),
+        slug: details.connector ?? null,
         iconUrl: connectorLogoUrl(details),
     };
 }
@@ -202,6 +203,7 @@ export function ApprovalDecisionPanel({ details, outcome, busyDecision, error, o
     const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
     const tHardcodedUi = useTranslations('hardcodedUi');
     const t = useTranslations('hardcodedUi.approvalPage');
+    const tSets = useTranslations('connectorPolicySets');
     const priorityWord = useIssuePriorityWord();
     const now = useClock();
     const expiresAt = Date.parse(details.expires_at);
@@ -316,7 +318,9 @@ export function ApprovalDecisionPanel({ details, outcome, busyDecision, error, o
     const risk = details.risk === 'destructive' ? (_jsx(FactRow, { icon: _jsx(WarningIcon, { "aria-hidden": true, className: "text-kortix-red size-4" }), children: t('riskDestructive') })) : details.risk === 'write' ? (_jsx(FactRow, { icon: _jsx(PencilSimpleIcon, { "aria-hidden": true, className: "text-foreground size-4" }), children: t('riskWrite', { action: (readable ?? details.action).toLowerCase() }) })) : details.risk === 'read' ? (_jsx(FactRow, { icon: _jsx(EyeIcon, { "aria-hidden": true, className: "text-foreground size-4" }), children: t('riskRead') })) : null;
     const decidable = details.pending && !resolved && !!onDecision;
     const footer = error || expired || decidable || waiting;
-    return (_jsxs(Rise, { children: [_jsxs("div", { className: "flex flex-col gap-3 px-5 pt-5 pb-4", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-3", title: details.action, children: [_jsx(ConnectorAppMark, { name: connectorName ?? details.action, iconUrl: connectorLogoUrl(details), size: "md" }), _jsxs("div", { className: "flex min-w-0 flex-col", children: [_jsx("p", { className: "text-foreground truncate text-sm leading-5 font-medium", children: connectorName ?? readable ?? details.action }), connectorName ? (_jsx("p", { className: "text-muted-foreground truncate text-xs leading-4", children: readable ?? details.action })) : null] })] }), chip] }), _jsx("h2", { className: "text-foreground text-xl leading-snug font-semibold wrap-anywhere", children: headline }), _jsx(ApprovalAgentContext, { quote: true, context: details.approval_context })] }), showsPreview ? (_jsx("div", { className: "px-5", children: _jsx(ApprovalParameters, { native: true, action: details.action, argsPreview: details.args_preview, reviewComplete: details.review_complete !== false, resolvedPreview: details.resolved_preview, resolvedError: details.resolved_error, className: "overflow-hidden rounded-lg border" }) })) : null, _jsxs("div", { className: cn('flex flex-col gap-2 px-5 pb-4', showsPreview && 'pt-4'), children: [risk, _jsxs(FactRow, { muted: true, icon: _jsx(UserIcon, { "aria-hidden": true, className: "text-muted-foreground size-4" }), children: [asked, expiresWhen ? ` · ${t('expiresAt', { when: expiresWhen })}` : null] })] }), footer ? (_jsxs("div", { className: "border-border flex flex-col gap-3 border-t px-5 pt-4 pb-5", children: [error ? (_jsx(Alert, { variant: "destructive", children: _jsx(AlertDescription, { children: error }) })) : null, expired ? (_jsxs(_Fragment, { children: [_jsx(Alert, { children: _jsx(AlertDescription, { children: tHardcodedUi('approvalPage.expiredHint') }) }), onDecision ? (_jsx(ApprovalDecisionActions, { onDecision: onDecision, disabled: true, sessionId: details.session_id, notePlaceholder: agent ? t('notePlaceholder', { agent }) : t('notePlaceholderAgent'), approveLabel: approveLabel, noteMinHeight: 80, className: "border-0 p-0" })) : null] })) : decidable && onDecision ? (_jsxs(_Fragment, { children: [reviewable ? null : (_jsx(Alert, { variant: "warning", children: _jsx(AlertDescription, { children: previewAuthorized
+    return (_jsxs(Rise, { children: [_jsxs("div", { className: "flex flex-col gap-3 px-5 pt-5 pb-4", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-3", title: details.action, children: [_jsx(ConnectorAppMark, { name: connectorName ?? details.action, slug: details.connector, iconUrl: connectorLogoUrl(details), size: "md" }), _jsxs("div", { className: "flex min-w-0 flex-col", children: [_jsx("p", { className: "text-foreground truncate text-sm leading-5 font-medium", children: connectorName ?? readable ?? details.action }), connectorName ? (_jsx("p", { className: "text-muted-foreground truncate text-xs leading-4", children: readable ?? details.action })) : null] })] }), chip] }), _jsx("h2", { className: "text-foreground text-xl leading-snug font-semibold wrap-anywhere", children: headline }), _jsx(ApprovalAgentContext, { quote: true, context: details.approval_context })] }), showsPreview ? (_jsx("div", { className: "px-5", children: _jsx(ApprovalParameters, { native: true, action: details.action, argsPreview: details.args_preview, reviewComplete: details.review_complete !== false, resolvedPreview: details.resolved_preview, resolvedError: details.resolved_error, className: "overflow-hidden rounded-lg border" }) })) : null, _jsxs("div", { className: cn('flex flex-col gap-2 px-5 pb-4', showsPreview && 'pt-4'), children: [risk, details.policy_set ? (_jsx(FactRow, { muted: true, icon: _jsx(ShieldCheckIcon, { "aria-hidden": true, className: "text-muted-foreground size-4" }), children: details.agent
+                            ? tSets('approvalSetAgent', { agent: details.agent, set: details.policy_set })
+                            : tSets('approvalSet', { set: details.policy_set }) })) : null, _jsxs(FactRow, { muted: true, icon: _jsx(UserIcon, { "aria-hidden": true, className: "text-muted-foreground size-4" }), children: [asked, expiresWhen ? ` · ${t('expiresAt', { when: expiresWhen })}` : null] })] }), footer ? (_jsxs("div", { className: "border-border flex flex-col gap-3 border-t px-5 pt-4 pb-5", children: [error ? (_jsx(Alert, { variant: "destructive", children: _jsx(AlertDescription, { children: error }) })) : null, expired ? (_jsxs(_Fragment, { children: [_jsx(Alert, { children: _jsx(AlertDescription, { children: tHardcodedUi('approvalPage.expiredHint') }) }), onDecision ? (_jsx(ApprovalDecisionActions, { onDecision: onDecision, disabled: true, sessionId: details.session_id, notePlaceholder: agent ? t('notePlaceholder', { agent }) : t('notePlaceholderAgent'), approveLabel: approveLabel, noteMinHeight: 80, className: "border-0 p-0" })) : null] })) : decidable && onDecision ? (_jsxs(_Fragment, { children: [reviewable ? null : (_jsx(Alert, { variant: "warning", children: _jsx(AlertDescription, { children: previewAuthorized
                                         ? tI18nComplete.raw('text7c4a3e7e2251')
                                         : tI18nComplete.raw('textf7873b149941') }) })), _jsx(ApprovalDecisionActions, { onDecision: onDecision, busyDecision: busyDecision, approvable: reviewable, sessionId: details.session_id, notePlaceholder: agent ? t('notePlaceholder', { agent }) : t('notePlaceholderAgent'), approveLabel: approveLabel, noteMinHeight: 80, className: "border-0 p-0" })] })) : waiting ? (_jsx(ApprovalWaitingNotice, { dense: true, resolvers: resolvers })) : null] })) : null] }));
 }

package/dist/markdown/setup-links/connector-handshake.d.ts

@@ -19,8 +19,10 @@ declare const TILE_SIZE: {
  * not contain it: WebKit skips a rounded overflow clip for a composited child
  * (the card animates in), and the logo's square corners painted past the edge.
  */
-export declare function ConnectorAppMark({ name, iconUrl, size, }: {
+export declare function ConnectorAppMark({ name: _name, slug, iconUrl, size, }: {
     name: string;
+    /** The connector's slug, so a Kortix-built connector shows its own mark. */
+    slug?: string | null;
     iconUrl: string | null | undefined;
     size?: keyof typeof TILE_SIZE;
 }): React.JSX.Element;

package/dist/markdown/setup-links/connector-handshake.js

@@ -1,11 +1,10 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { EntityAvatar } from '../../primitives/entity-avatar.js';
+import { ConnectorLogo } from '../../internal/connector-logo/connector-logo.js';
 import { KortixLogo } from '../../primitives/kortix-logo.js';
 import { Skeleton } from '../../primitives/skeleton.js';
 import { cn } from '../../lib/utils.js';
 import { CheckIcon } from '@phosphor-icons/react';
-import { useState } from 'react';
 /**
  * The logo tile is white in both themes. Catalogue logos are third-party art
  * drawn for a white ground: on the dark `bg-popover` a black glyph (Notion,
@@ -13,6 +12,8 @@ import { useState } from 'react';
  * exception, kept here as a named constant rather than inline.
  */
 const LOGO_TILE_BACKGROUND = 'bg-white';
+/** The Kortix tile is the light variant in both themes: white ground, black mark, no edge. */
+const KORTIX_TILE_COLORS = 'bg-white text-black';
 const TILE_SIZE = {
     xl: 'size-14 rounded-xl',
     lg: 'size-10 rounded-md',
@@ -41,15 +42,13 @@ function HandshakeTile({ size, className, children, }) {
  * not contain it: WebKit skips a rounded overflow clip for a composited child
  * (the card animates in), and the logo's square corners painted past the edge.
  */
-export function ConnectorAppMark({ name, iconUrl, size = 'md', }) {
-    const [broken, setBroken] = useState(false);
-    if (iconUrl === undefined) {
+export function ConnectorAppMark({ name: _name, slug, iconUrl, size = 'md', }) {
+    if (iconUrl === undefined && !slug) {
         return _jsx(Skeleton, { "aria-hidden": true, className: cn('shrink-0 py-0', TILE_SIZE[size]) });
     }
-    if (!iconUrl || broken) {
-        return _jsx(EntityAvatar, { label: name, size: size, className: size === 'xl' ? 'rounded-xl' : undefined });
-    }
-    return (_jsx(HandshakeTile, { size: size, className: LOGO_TILE_BACKGROUND, children: _jsx("img", { src: iconUrl, alt: "", referrerPolicy: "no-referrer", draggable: false, onError: () => setBroken(true), className: cn('size-full object-contain select-none', TILE_SIZE[size]) }) }));
+    // The one connector logo (`ConnectorLogo`), so a connect card, an approval and the
+    // connector's own page show the same mark.
+    return _jsx(ConnectorLogo, { source: { slug, icon: iconUrl ?? null }, size: size });
 }
 /** The Kortix glyph inside its tile, per tile size. */
 const KORTIX_MARK_PX = { md: 14, lg: 18, xl: 24 };
@@ -67,5 +66,8 @@ const KORTIX_MARK_PX = { md: 14, lg: 18, xl: 24 };
  * away and the app logo alone leads, which gives the title the room it needs.
  */
 export function ConnectorHandshake({ name, iconUrl, connected = false, size = 'md', collapsible = true, mark, }) {
-    return (_jsxs("span", { className: cn('flex shrink-0 items-center', size === 'xl' ? 'gap-3' : 'gap-1.5'), "aria-hidden": true, children: [_jsx(HandshakeTile, { size: size, className: cn('bg-background text-foreground ring-border ring-1 ring-inset', collapsible && 'hidden @md/connect:flex'), children: _jsx(KortixLogo, { variant: "icon", size: KORTIX_MARK_PX[size] }) }), _jsxs("svg", { width: size === 'xl' ? 36 : 24, height: size === 'xl' ? 9 : 6, viewBox: "0 0 24 6", className: cn('text-muted-foreground shrink-0', collapsible && 'hidden @md/connect:block'), fill: "currentColor", children: [_jsx("circle", { cx: "2", cy: "3", r: "1", opacity: "0.3" }), _jsx("circle", { cx: "7", cy: "3", r: "1.25", opacity: "0.7" }), _jsx("circle", { cx: "12", cy: "3", r: "1.75" }), _jsx("circle", { cx: "17", cy: "3", r: "1.25", opacity: "0.7" }), _jsx("circle", { cx: "22", cy: "3", r: "1", opacity: "0.3" })] }), _jsxs("span", { className: "relative flex", children: [mark ? (_jsx(HandshakeTile, { size: size, className: cn(LOGO_TILE_BACKGROUND, 'ring-border ring-1 ring-inset'), children: mark })) : (_jsx(ConnectorAppMark, { name: name, iconUrl: iconUrl, size: size })), connected ? (_jsx("span", { className: "bg-kortix-green ring-background absolute -right-1 -bottom-1 flex size-3.5 items-center justify-center rounded-full ring-2", children: _jsx(CheckIcon, { weight: "bold", className: "text-background size-2" }) })) : null] })] }));
+    return (_jsxs("span", { className: cn('flex shrink-0 items-center', size === 'xl' ? 'gap-3' : 'gap-1.5'), "aria-hidden": true, children: [_jsx(HandshakeTile, { size: size, className: cn(KORTIX_TILE_COLORS, collapsible && 'hidden @md/connect:flex'), children: _jsx(KortixLogo, { variant: "icon", size: KORTIX_MARK_PX[size] }) }), _jsxs("svg", { width: size === 'xl' ? 36 : 24, height: size === 'xl' ? 9 : 6, viewBox: "0 0 24 6", className: cn('text-muted-foreground shrink-0', collapsible && 'hidden @md/connect:block'), fill: "currentColor", children: [_jsx("circle", { cx: "2", cy: "3", r: "1", opacity: "0.3" }), _jsx("circle", { cx: "7", cy: "3", r: "1.25", opacity: "0.7" }), _jsx("circle", { cx: "12", cy: "3", r: "1.75" }), _jsx("circle", { cx: "17", cy: "3", r: "1.25", opacity: "0.7" }), _jsx("circle", { cx: "22", cy: "3", r: "1", opacity: "0.3" })] }), _jsxs("span", { className: "relative flex", children: [mark ? (_jsx(HandshakeTile, { size: size, className: cn(LOGO_TILE_BACKGROUND, 'ring-border ring-1 ring-inset'), children: mark })) : (
+                    // A white ground behind the bare logo, so a black glyph (GitHub,
+                    // Notion) stays visible on a dark surface.
+                    _jsx("span", { className: cn(iconUrl !== undefined && LOGO_TILE_BACKGROUND, 'flex', TILE_SIZE[size]), children: _jsx(ConnectorAppMark, { name: name, iconUrl: iconUrl, size: size }) })), connected ? (_jsx("span", { className: "bg-kortix-green ring-background absolute -right-1 -bottom-1 flex size-3.5 items-center justify-center rounded-full ring-2", children: _jsx(CheckIcon, { weight: "bold", className: "text-background size-2" }) })) : null] })] }));
 }

package/dist/markdown/setup-links/secret-intake-form.d.ts

@@ -1,13 +1,3 @@
-import type { OutcomeTone } from '../../internal/outcomes/outcome-types.js';
-import { type Icon } from '@phosphor-icons/react';
-import { type ReactElement } from 'react';
-/** Every phase that is not the form: tinted tile, title, one muted line. */
-export declare function StatusNotice({ icon: Glyph, tone, title, description, }: {
-    icon: Icon;
-    tone: OutcomeTone;
-    title: string;
-    description?: string;
-}): ReactElement;
 /**
  * Renders the fields an agent-minted secret link asks for, and submits the
  * values the human types. Shared by the public /secret-intake/[token] page and

package/dist/markdown/setup-links/secret-intake-form.js

@@ -14,7 +14,7 @@ import { Fragment, useEffect, useState } from 'react';
 import { classifySetupLinkError, describeLinkExpiry, describeWithheldSecrets, splitTextLinks, } from './util.js';
 import { setupLinkApiBase } from './api-base.js';
 /** Every phase that is not the form: tinted tile, title, one muted line. */
-export function StatusNotice({ icon: Glyph, tone, title, description, }) {
+function StatusNotice({ icon: Glyph, tone, title, description, }) {
     const tint = outcomeTint(tone);
     return (_jsxs("div", { role: "status", className: "flex flex-col items-center gap-3 py-8 text-center", children: [_jsx("span", { className: cn('flex size-9 items-center justify-center rounded-sm ring-1', tint.ring, tint.bg), children: _jsx(Glyph, { weight: "fill", className: cn('size-5', tint.fg) }) }), _jsxs("div", { className: "max-w-xs space-y-1", children: [_jsx("p", { className: "text-foreground text-sm font-medium", children: title }), description ? (_jsx("p", { className: "text-muted-foreground text-xs text-pretty", children: description })) : null] })] }));
 }

package/dist/markdown/setup-links/show-connect-hero.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+export type ShowConnectTarget = {
+    kind: 'kortix';
+    token: string;
+} | {
+    kind: 'provider';
+    host: string;
+};
+/**
+ * A `show` URL that is a connect step, not a page: a Kortix link, a provider's
+ * sign-in page, or any URL the agent titled "Connect <app>". A connection URL
+ * never falls back to the plain link card.
+ */
+export declare function showConnectTarget(url: string, title?: string): ShowConnectTarget | null;
+/**
+ * The `show` panel for a connect URL (Paper, "Show tool · connect URL panel" 01):
+ * the Kortix ··· app handshake, one title, the agent's sentence, one action.
+ *
+ * A Kortix link opens the host's connect dialog in place and turns into the
+ * connected record once the account lands. A provider page opens in a sign-in
+ * window; its app comes from the agent's title, never the provider's favicon.
+ */
+export declare function ShowConnectHero({ url, target, title, description, }: {
+    url: string;
+    target: ShowConnectTarget;
+    title: string;
+    description: string;
+}): React.JSX.Element;

package/dist/markdown/setup-links/show-connect-hero.js

@@ -0,0 +1,91 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { LockSimpleIcon } from '@phosphor-icons/react';
+import { useCallback, useState } from 'react';
+import { useLocalizedUiCatalog } from '../../i18n/ui-catalog/use-localized-ui-catalog.js';
+import { Button } from '../../primitives/button.js';
+import { useUiComponents } from '../../providers/ui-provider.js';
+import { ConnectorHandshake } from './connector-handshake.js';
+import { connectorHeadline, useConnectorLinkInfo } from './connector-link-info.js';
+import { onSetupLinkModalClose } from './setup-link-close-finalize.js';
+import { parseSetupLinkHref } from './util.js';
+const COPY = {
+    title: 'Connect {app}',
+    connectedTitle: '{app} connected',
+    connectedDescription: 'Your agent can use {app} now and continues on its own.',
+    connect: 'Connect {app}',
+    view: 'View',
+    trust: 'You sign in on {app}. Kortix never sees your password.',
+    secureHost: 'Secure sign-in at {host}',
+    fallbackApp: 'the app',
+};
+/** Provider-hosted sign-in pages an agent may show instead of a Kortix link. */
+const PROVIDER_HOSTS = /(^|\.)(composio\.dev|pipedream\.com)$/i;
+/**
+ * A `show` URL that is a connect step, not a page: a Kortix link, a provider's
+ * sign-in page, or any URL the agent titled "Connect <app>". A connection URL
+ * never falls back to the plain link card.
+ */
+export function showConnectTarget(url, title = '') {
+    const setup = parseSetupLinkHref(url);
+    if (setup?.kind === 'connector')
+        return { kind: 'kortix', token: setup.token };
+    let host;
+    try {
+        host = new URL(url).hostname;
+    }
+    catch {
+        return null;
+    }
+    if (PROVIDER_HOSTS.test(host) || /^connect\s+\S/i.test(title.trim())) {
+        return { kind: 'provider', host };
+    }
+    return null;
+}
+/** "Connect Snaps YouTube" → "Snaps YouTube"; the agent's own title names the app. */
+function appFromTitle(title) {
+    return title.replace(/^connect\s+/i, '').trim();
+}
+function fill(template, values) {
+    return template.replace(/\{(\w+)\}/g, (_, key) => values[key] ?? '');
+}
+/**
+ * The `show` panel for a connect URL (Paper, "Show tool · connect URL panel" 01):
+ * the Kortix ··· app handshake, one title, the agent's sentence, one action.
+ *
+ * A Kortix link opens the host's connect dialog in place and turns into the
+ * connected record once the account lands. A provider page opens in a sign-in
+ * window; its app comes from the agent's title, never the provider's favicon.
+ */
+export function ShowConnectHero({ url, target, title, description, }) {
+    const copy = useLocalizedUiCatalog(COPY);
+    const { ConnectorConnectModal } = useUiComponents();
+    const token = target.kind === 'kortix' ? target.token : null;
+    const info = useConnectorLinkInfo(token);
+    const [settledHere, setSettledHere] = useState(false);
+    const [open, setOpen] = useState(false);
+    const headline = info ? connectorHeadline(info) : null;
+    const app = headline?.app || appFromTitle(title) || copy.fallbackApp;
+    const connected = settledHere || info?.connected === true;
+    // `undefined` while a Kortix link's info loads (skeleton tile). With no icon on
+    // the link, the catalogue logo by slug (as `approval-decision.tsx` does); a
+    // 404 there falls back to the neutral glyph inside `ConnectorLogo`.
+    const logoSlug = info?.slug || app.toLowerCase().replace(/[^a-z0-9]/g, '');
+    const iconUrl = token && info === undefined
+        ? undefined
+        : (info?.icon_url ?? `https://logos.composio.dev/api/${encodeURIComponent(logoSlug)}`);
+    const inApp = token !== null && !!ConnectorConnectModal;
+    const handleSettled = useCallback(() => setSettledHere(true), []);
+    const handleOpenChange = (next) => {
+        setOpen(next);
+        if (token)
+            void onSetupLinkModalClose({ open: next, kind: 'connector', token });
+    };
+    const onAction = () => {
+        if (inApp)
+            setOpen(true);
+        else
+            window.open(url, '_blank', 'noopener,noreferrer,width=520,height=720');
+    };
+    return (_jsxs("div", { className: "flex w-full max-w-sm flex-col items-center gap-4 py-6 text-center", "data-testid": "show-connect-hero", "data-connected": connected || undefined, children: [_jsx(ConnectorHandshake, { name: app, iconUrl: iconUrl, connected: connected, size: "lg", collapsible: false }), _jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("h3", { className: "text-foreground text-sm font-medium", children: fill(connected ? copy.connectedTitle : copy.title, { app }) }), connected || description ? (_jsx("p", { className: "text-muted-foreground text-sm font-normal text-pretty", children: connected ? fill(copy.connectedDescription, { app }) : description })) : null] }), _jsxs("div", { className: "flex flex-col items-center gap-2", children: [_jsx(Button, { size: "sm", variant: connected ? 'outline' : 'default', onClick: onAction, children: connected ? copy.view : fill(copy.connect, { app }) }), connected ? null : (_jsx("p", { className: "text-muted-foreground flex items-center gap-1.5 text-xs font-normal", children: target.kind === 'provider' ? (_jsxs(_Fragment, { children: [_jsx(LockSimpleIcon, { className: "size-3 shrink-0" }), fill(copy.secureHost, { host: target.host })] })) : (fill(copy.trust, { app })) }))] }), token && ConnectorConnectModal ? (_jsx(ConnectorConnectModal, { token: token, open: open, onOpenChange: handleOpenChange, onConnected: handleSettled, fallbackName: app })) : null] }));
+}

package/dist/markdown/unified-markdown.js

@@ -107,7 +107,7 @@ export function MarkdownImage({ src, alt, flush = false, compact = false, onErro
         }
         return (_jsxs(Button, { type: "button", variant: "outline", size: "xs", title: alt || undefined, onClick: () => setLoadRequested(true), className: "text-muted-foreground max-w-full", children: [_jsx(ImageIcon, { className: "size-3.5 shrink-0" }), _jsx("span", { className: "truncate", children: label })] }));
     }
-    return (_jsx("span", { className: cn('block', !flush && 'my-5'), children: _jsx("img", { src: resolvedSrc, alt: alt || '', loading: "lazy", onError: onError, className: "h-auto max-w-full rounded-lg outline outline-1 -outline-offset-1 outline-black/10 dark:outline-white/10" }) }));
+    return (_jsx("span", { className: cn('block', !flush && 'my-5'), children: _jsx("img", { src: resolvedSrc, alt: alt || '', loading: "lazy", onError: onError, className: "h-auto max-w-full rounded-lg outline outline-1 -outline-offset-1 outline-border" }) }));
 }
 /**
  * Every renderer the markdown uses, defined once for the module.
@@ -131,13 +131,13 @@ const MARKDOWN_COMPONENTS = {
     h4: ({ children }) => (_jsx("h4", { className: "text-foreground mt-6 mb-2 text-lg font-semibold first:mt-0", children: children })),
     h5: ({ children }) => (_jsx("h5", { className: "text-foreground mt-4 mb-1 text-base font-semibold first:mt-0", children: children })),
     h6: ({ children }) => (_jsx("h6", { className: "text-foreground mt-4 mb-1 text-base font-semibold tracking-wide first:mt-0", children: children })),
-    p: ({ children }) => (_jsx("div", { className: "text-foreground/95 my-4 leading-relaxed font-medium [overflow-wrap:anywhere] first:mt-0 last:mb-0 [&:has(img)]:my-0", children: wrapChildrenWithPaths(children) })),
-    ul: ({ children }) => (_jsx("ul", { className: "marker:text-muted-foreground/60 my-4 list-outside list-disc space-y-1 pl-6 first:mt-0 last:mb-0 [&_p]:mb-2 [&_p]:last:mb-0", children: children })),
+    p: ({ children }) => (_jsx("div", { className: "text-foreground my-4 leading-relaxed font-medium [overflow-wrap:anywhere] first:mt-0 last:mb-0 [&:has(img)]:my-0", children: wrapChildrenWithPaths(children) })),
+    ul: ({ children }) => (_jsx("ul", { className: "marker:text-muted-foreground my-4 list-outside list-disc space-y-1 pl-6 first:mt-0 last:mb-0 [&_p]:mb-2 [&_p]:last:mb-0", children: children })),
     ol: MarkdownOrderedList,
     // A setup link still inside a list or table is part of a sentence or a row of
     // data (`liftSetupLinkBlocks` lifted the ones that were not), so it renders
     // as an inline chip rather than a full-width card.
-    li: ({ children }) => (_jsx("li", { className: "text-foreground/95 leading-relaxed font-medium [overflow-wrap:anywhere]", children: _jsx(SetupLinkInlineContext.Provider, { value: true, children: wrapChildrenWithPaths(children) }) })),
+    li: ({ children }) => (_jsx("li", { className: "text-foreground leading-relaxed font-medium [overflow-wrap:anywhere]", children: _jsx(SetupLinkInlineContext.Provider, { value: true, children: wrapChildrenWithPaths(children) }) })),
     // Links — brand-blue, routed through next/link. Setup links open an in-app modal.
     a: MarkdownLink,
     // Every fence kind and inline code resolve in one shared place; see
@@ -160,7 +160,7 @@ const MARKDOWN_COMPONENTS = {
     td: ({ children, className: tdClassName, node: _node, ...props }) => (_jsx("td", { className: cn(tdClassName, 'text-foreground px-4 py-2 text-left font-normal break-normal'), ...props, children: _jsx(SetupLinkInlineContext.Provider, { value: true, children: wrapChildrenWithPaths(children) }) })),
     img: MarkdownImage,
     strong: ({ children }) => (_jsx("strong", { className: "text-foreground font-semibold", children: children })),
-    em: ({ children }) => (_jsx("em", { className: "text-foreground/90 italic", children: children })),
+    em: ({ children }) => (_jsx("em", { className: "text-foreground italic", children: children })),
     del: ({ children }) => (_jsx("del", { className: "text-muted-foreground decoration-muted-foreground/50 line-through", children: children })),
     // GFM task-list checkbox.
     // Read-only: the control is shown, never toggled.

package/dist/primitives/badge.d.ts

@@ -1,7 +1,7 @@
 import { type VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 declare const badgeVariants: (props?: ({
-    variant?: "outline" | "accent" | "secondary" | "success" | "warning" | "info" | "beta" | "default" | "kortix" | "destructive" | "new" | "update" | "muted" | "transparent" | "solid" | "badgeSuccess" | "highlight" | null | undefined;
+    variant?: "outline" | "accent" | "secondary" | "success" | "warning" | "info" | "beta" | "default" | "kortix" | "destructive" | "update" | "new" | "muted" | "transparent" | "solid" | "badgeSuccess" | "highlight" | "royal" | null | undefined;
     size?: "default" | "xs" | "sm" | "tabular" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare function Badge({ className, variant, size, asChild, ...props }: React.ComponentProps<'span'> & VariantProps<typeof badgeVariants> & {

package/dist/primitives/badge.js

@@ -22,6 +22,8 @@ const badgeVariants = cva('inline-flex shrink-0 items-center justify-center gap-
             info: 'bg-kortix-blue/15 text-foreground ring-1 ring-inset ring-kortix-blue/15 normal-case [&>svg]:text-kortix-blue',
             muted: 'bg-muted/50 text-muted-foreground ring-1 ring-inset ring-muted/50 normal-case',
             transparent: 'bg-transparent text-foreground ring-0 normal-case',
+            // The owner tier of the role badge hierarchy (decisions.md, R1).
+            royal: 'bg-kortix-purple/15 text-foreground ring-1 ring-inset ring-kortix-purple/15 normal-case',
         },
         size: {
             default: 'px-1.5',

package/dist/primitives/disclosure.js

@@ -89,8 +89,15 @@ export function DisclosureTrigger({ children, className, variant = 'default', })
                 return child;
             const typedChild = child;
             const childClassName = typedChild.props.className;
+            // Composed, never replaced: a tooltip around the trigger closes on its
+            // own onClick. A keyboard toggle is an activation (a native button's
+            // Enter is a click), so it runs the child's onClick too.
+            const activate = (event) => {
+                typedChild.props.onClick?.(event);
+                toggle();
+            };
             return React.cloneElement(typedChild, {
-                onClick: toggle,
+                onClick: activate,
                 role: 'button',
                 'aria-expanded': open,
                 // The region is unmounted while collapsed, so only promise an id that
@@ -98,9 +105,14 @@ export function DisclosureTrigger({ children, className, variant = 'default', })
                 'aria-controls': open ? contentId : undefined,
                 tabIndex: 0,
                 onKeyDown: (e) => {
+                    typedChild.props.onKeyDown?.(e);
+                    if (e.defaultPrevented)
+                        return;
                     if (e.key === 'Enter' || e.key === ' ') {
+                        // Activate before preventing the default: a composed handler
+                        // (Radix's tooltip close) skips a prevented event.
+                        activate(e);
                         e.preventDefault();
-                        toggle();
                     }
                 },
                 className: cn(className, 'select-none', childClassName, variant === 'outline' &&

package/dist/primitives/empty-art.d.ts

@@ -0,0 +1,12 @@
+import type { Icon } from '@phosphor-icons/react';
+/**
+ * The artwork above an `EmptyState`: two cards fanned behind a front card.
+ * Without `icon` the front card is a document (an empty folder); with one,
+ * the icon sits on a plain front card (a channel's empty Memory, Links,
+ * Triggers, Apps and Threads), so every empty tab draws one picture.
+ * `glyphClassName` tints the icon (a channel's setup cards).
+ */
+export declare function EmptyArt({ icon: Glyph, glyphClassName }: {
+    icon?: Icon;
+    glyphClassName?: string;
+}): import("react").JSX.Element;

package/dist/primitives/empty-art.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The artwork above an `EmptyState`: two cards fanned behind a front card.
+ * Without `icon` the front card is a document (an empty folder); with one,
+ * the icon sits on a plain front card (a channel's empty Memory, Links,
+ * Triggers, Apps and Threads), so every empty tab draws one picture.
+ * `glyphClassName` tints the icon (a channel's setup cards).
+ */
+export function EmptyArt({ icon: Glyph, glyphClassName = 'text-muted-foreground' }) {
+    return (_jsxs("svg", { width: "72", height: "60", viewBox: "0 0 72 60", fill: "none", "aria-hidden": "true", children: [[-1, 1].map((side) => (_jsx("rect", { x: "21", y: "10", width: "30", height: "43", rx: "4", transform: `translate(${side * 7} 0) rotate(${side * 8} 36 53)`, className: "fill-card stroke-foreground/10" }, side))), Glyph ? (_jsxs(_Fragment, { children: [_jsx("rect", { x: "21", y: "12", width: "30", height: "43", rx: "4", className: "fill-muted stroke-foreground/20" }), _jsx(Glyph, { x: 27, y: 24.5, size: 18, className: glyphClassName })] })) : (_jsxs("g", { transform: "translate(3 0)", children: [_jsx("path", { d: "M22 12h17l9 9v30a4 4 0 0 1-4 4H22a4 4 0 0 1-4-4V16a4 4 0 0 1 4-4Z", className: "fill-muted stroke-foreground/20" }), _jsx("path", { d: "M39 12v6a3 3 0 0 0 3 3h6", className: "stroke-foreground/20" }), _jsx("path", { d: "M25 30h16M25 36h16M25 42h10", strokeWidth: "1.5", strokeLinecap: "round", className: "stroke-foreground/15" })] }))] }));
+}

package/dist/primitives/mermaid-renderer.d.ts

@@ -8,6 +8,8 @@ interface MermaidRendererProps {
      * still for `CODE_SETTLE_MS`, not once per streamed token.
      */
     isStreaming?: boolean;
+    /** Extra controls beside copy and fullscreen, shown on hover (e.g. "Edit diagram"). */
+    actions?: React.ReactNode;
 }
 export declare const MermaidRenderer: React.FC<MermaidRendererProps>;
 export {};