@kortix/ui 0.14.8 → 0.14.10

package/dist/artifacts/artifact-session.js

@@ -0,0 +1,101 @@
+'use client';
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { getPublicArtifact } from '@kortix/sdk';
+import { useArtifact } from '@kortix/sdk/react';
+import { ArrowSquareOut, BrowserIcon, FileTextIcon, X } from '@phosphor-icons/react';
+import { useEffect, useState } from 'react';
+import { useLocalizedUiCatalog } from '../i18n/ui-catalog/use-localized-ui-catalog.js';
+import { Button } from '../primitives/button.js';
+import Hint from '../primitives/hint.js';
+import { useUiComponents, useUiRouter } from '../providers/ui-provider.js';
+import { ArtifactFrame } from './artifact-frame.js';
+import { artifactFrameKey, parseArtifactUrl } from './frame-policy.js';
+const COPY = {
+    open: 'Open',
+    openArtifact: 'Open in Artifacts',
+    close: 'Close',
+    doc: 'Doc',
+    page: 'Page',
+    unavailable: 'This artifact is not available to you.',
+};
+const TYPE_ICON = { doc: FileTextIcon, html: BrowserIcon };
+/** The artifact a URL names, as the caller may see it: a project artifact, or a public one. */
+function useShownArtifact(url) {
+    const ref = parseArtifactUrl(url);
+    const inProject = useArtifact(ref?.projectId ?? null, ref?.projectId ? ref.artifactId : null);
+    const [shared, setShared] = useState({ artifact: null, failed: false });
+    const publicId = ref && !ref.projectId ? ref.artifactId : null;
+    useEffect(() => {
+        if (!publicId)
+            return;
+        let live = true;
+        getPublicArtifact(publicId)
+            .then((a) => {
+            if (!live)
+                return;
+            if (!a)
+                return setShared({ artifact: null, failed: true });
+            setShared({
+                artifact: { title: a.title, type: a.type, src: a.content_url, frameKey: `artifact:${a.artifact_id}:${a.updated_at}`, href: null },
+                failed: false,
+            });
+        })
+            .catch(() => live && setShared({ artifact: null, failed: true }));
+        return () => {
+            live = false;
+        };
+    }, [publicId]);
+    if (!ref)
+        return { artifact: null, failed: true };
+    if (publicId)
+        return shared;
+    const detail = inProject.data;
+    if (!detail)
+        return { artifact: null, failed: inProject.isError };
+    return {
+        artifact: {
+            title: detail.title,
+            type: detail.type,
+            src: detail.version.view_url,
+            frameKey: artifactFrameKey(detail),
+            href: `/projects/${detail.project_id}/artifacts/${detail.artifact_id}`,
+        },
+        failed: false,
+    };
+}
+/**
+ * An artifact in a chat: what the agent `show`ed when it handed one over. A
+ * live preview, its title and type. It is a link: on a session page the web
+ * app's link interceptor opens it in the session panel, like a Kortix App. A link
+ * the viewer cannot open (no access, flag off) renders `fallback` instead.
+ */
+export function ShowArtifactCard({ url, fallback }) {
+    const copy = useLocalizedUiCatalog(COPY);
+    const { artifact, failed } = useShownArtifact(url);
+    if (failed)
+        return _jsx(_Fragment, { children: fallback });
+    const Icon = artifact ? TYPE_ICON[artifact.type] : FileTextIcon;
+    return (_jsxs("a", { href: url, target: "_blank", rel: "noopener noreferrer", "data-testid": "show-artifact-card", className: "group border-border bg-card hover:border-foreground/20 flex w-full max-w-xl flex-col overflow-hidden rounded-lg border text-left transition-colors", children: [_jsx("span", { className: "bg-muted relative block aspect-[16/9] w-full overflow-hidden border-b", children: artifact ? (_jsx(ArtifactFrame, { preview: true, 
+                    // Its own frame: the chat card keeps its preview while the panel shows the artifact.
+                    frameKey: `${artifact.frameKey}:chat`, src: artifact.src, title: artifact.title, className: "pointer-events-none absolute top-0 left-0 h-[400%] w-[400%] origin-top-left scale-25 border-0" })) : null }), _jsxs("span", { className: "flex items-center gap-3 p-3", children: [_jsx("span", { className: "bg-muted flex size-8 shrink-0 items-center justify-center rounded-md", children: _jsx(Icon, { className: "text-muted-foreground size-4" }) }), _jsxs("span", { className: "min-w-0 flex-1", children: [_jsx("span", { className: "text-foreground block truncate text-sm font-medium", children: artifact?.title ?? ' ' }), _jsx("span", { className: "text-muted-foreground block text-xs", children: artifact ? (artifact.type === 'doc' ? copy.doc : copy.page) : ' ' })] }), _jsx("span", { className: "text-muted-foreground group-hover:text-foreground shrink-0 text-xs font-medium transition-colors", children: copy.open })] })] }));
+}
+/**
+ * An artifact in the session panel: the page itself (a doc read as its page),
+ * with its title, a way to the full viewer (where a doc is edited) and close.
+ */
+export function ArtifactPanelPreview({ url, onClose }) {
+    // The host's full viewer (apps/web: the Artifacts viewer) for a project artifact.
+    const { ArtifactViewer } = useUiComponents();
+    const ref = parseArtifactUrl(url);
+    if (ArtifactViewer && ref?.projectId)
+        return _jsx(ArtifactViewer, { projectId: ref.projectId, artifactId: ref.artifactId, onClose: onClose });
+    return _jsx(ArtifactPagePreview, { url: url, onClose: onClose });
+}
+/** A public artifact, or a host without the viewer: the page itself, read-only. */
+function ArtifactPagePreview({ url, onClose }) {
+    const copy = useLocalizedUiCatalog(COPY);
+    const router = useUiRouter();
+    const { artifact, failed } = useShownArtifact(url);
+    const Icon = artifact ? TYPE_ICON[artifact.type] : FileTextIcon;
+    return (_jsxs("div", { className: "flex h-full min-h-0 flex-col", children: [_jsxs("div", { className: "flex h-10 shrink-0 items-center gap-2 border-b pr-1 pl-3", children: [_jsx(Icon, { className: "text-muted-foreground size-4 shrink-0", "aria-hidden": true }), _jsx("span", { className: "text-foreground min-w-0 flex-1 truncate text-sm font-medium", children: artifact?.title ?? '' }), artifact?.href ? (_jsx(Hint, { label: copy.openArtifact, side: "bottom", children: _jsx(Button, { size: "icon-sm", variant: "ghost", "aria-label": copy.openArtifact, onClick: () => router.push(artifact.href), children: _jsx(ArrowSquareOut, { className: "size-3.5" }) }) })) : null, _jsx(Hint, { label: copy.close, side: "bottom", children: _jsx(Button, { size: "icon-sm", variant: "ghost", "aria-label": copy.close, onClick: onClose, children: _jsx(X, { className: "size-3.5" }) }) })] }), _jsx("div", { className: "bg-muted relative min-h-0 flex-1", children: artifact ? (_jsx(ArtifactFrame, { frameKey: artifact.frameKey, src: artifact.src, title: artifact.title, className: "absolute inset-0 size-full border-0" })) : failed ? (_jsx("p", { className: "text-muted-foreground p-6 text-sm", children: copy.unavailable })) : null })] }));
+}

package/dist/artifacts/frame-policy.d.ts

@@ -0,0 +1,30 @@
+/**
+ * The iframe sandbox. It allows same-origin; the content server's CSP sandbox
+ * decides: an opaque origin on the API host, the page's own origin on the
+ * dedicated content host (ARTIFACT_CONTENT_URL), where embedded players work.
+ */
+export declare const ARTIFACT_IFRAME_SANDBOX = "allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-modals allow-downloads";
+/** Features an embedded player in the page may use. */
+export declare const ARTIFACT_FRAME_ALLOW = "fullscreen; clipboard-write; autoplay; encrypted-media; picture-in-picture";
+/** Artifact frames share the Apps frame pool (`@kortix/ui/apps`); their keys start with this. */
+export declare const ARTIFACT_FRAME_PREFIX = "artifact:";
+/** One pooled frame per artifact state: a save (`updated_at`) or an old version gets its own. */
+export declare function artifactFrameKey(artifact: {
+    artifact_id: string;
+    updated_at: string;
+}, version?: string | null): string;
+/**
+ * Print a doc to PDF without leaving the page: its print view (`?print=1`)
+ * loads in a hidden frame and opens the print dialog for that frame alone. The
+ * page posts `artifact-printed` after the dialog closes; the frame then goes.
+ */
+export declare function printArtifact(viewUrl: string): void;
+/**
+ * The artifact an app link names: `/projects/<project>/artifacts/<artifact>`
+ * (the app viewer, on any Kortix host) or `/share/artifact/<artifact>` (a
+ * public link, no project). Null for any other URL.
+ */
+export declare function parseArtifactUrl(url: string): {
+    projectId: string | null;
+    artifactId: string;
+} | null;

package/dist/artifacts/frame-policy.js

@@ -0,0 +1,61 @@
+/**
+ * The iframe sandbox. It allows same-origin; the content server's CSP sandbox
+ * decides: an opaque origin on the API host, the page's own origin on the
+ * dedicated content host (ARTIFACT_CONTENT_URL), where embedded players work.
+ */
+export const ARTIFACT_IFRAME_SANDBOX = 'allow-scripts allow-same-origin allow-forms allow-popups allow-popups-to-escape-sandbox allow-modals allow-downloads';
+/** Features an embedded player in the page may use. */
+export const ARTIFACT_FRAME_ALLOW = 'fullscreen; clipboard-write; autoplay; encrypted-media; picture-in-picture';
+/** Artifact frames share the Apps frame pool (`@kortix/ui/apps`); their keys start with this. */
+export const ARTIFACT_FRAME_PREFIX = 'artifact:';
+/** One pooled frame per artifact state: a save (`updated_at`) or an old version gets its own. */
+export function artifactFrameKey(artifact, version) {
+    return `${ARTIFACT_FRAME_PREFIX}${artifact.artifact_id}:${version ?? artifact.updated_at}`;
+}
+/**
+ * Print a doc to PDF without leaving the page: its print view (`?print=1`)
+ * loads in a hidden frame and opens the print dialog for that frame alone. The
+ * page posts `artifact-printed` after the dialog closes; the frame then goes.
+ */
+export function printArtifact(viewUrl) {
+    const frame = document.createElement('iframe');
+    frame.setAttribute('sandbox', ARTIFACT_IFRAME_SANDBOX);
+    frame.setAttribute('aria-hidden', 'true');
+    frame.tabIndex = -1;
+    frame.style.cssText = 'position:fixed;right:0;bottom:0;width:1px;height:1px;border:0;opacity:0;pointer-events:none';
+    const cleanup = () => {
+        window.removeEventListener('message', onMessage);
+        frame.remove();
+    };
+    const onMessage = (event) => {
+        if (event.source === frame.contentWindow && event.data?.kortix === 'artifact-printed')
+            cleanup();
+    };
+    window.addEventListener('message', onMessage);
+    // A dialog left open past this still prints; the frame is only cleanup.
+    window.setTimeout(cleanup, 10 * 60_000);
+    frame.src = `${viewUrl}?print=1`;
+    document.body.appendChild(frame);
+}
+const UUID = '[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}';
+const IN_PROJECT = new RegExp(`/projects/(${UUID})/artifacts/(${UUID})/?$`, 'i');
+const PUBLIC = new RegExp(`/share/artifact/(${UUID})/?$`, 'i');
+/**
+ * The artifact an app link names: `/projects/<project>/artifacts/<artifact>`
+ * (the app viewer, on any Kortix host) or `/share/artifact/<artifact>` (a
+ * public link, no project). Null for any other URL.
+ */
+export function parseArtifactUrl(url) {
+    let path;
+    try {
+        path = new URL(url, 'http://localhost').pathname;
+    }
+    catch {
+        return null;
+    }
+    const inProject = IN_PROJECT.exec(path);
+    if (inProject)
+        return { projectId: inProject[1].toLowerCase(), artifactId: inProject[2].toLowerCase() };
+    const shared = PUBLIC.exec(path);
+    return shared ? { projectId: null, artifactId: shared[1].toLowerCase() } : null;
+}

package/dist/artifacts/index.d.ts

@@ -0,0 +1,3 @@
+export { ARTIFACT_FRAME_ALLOW, ARTIFACT_FRAME_PREFIX, ARTIFACT_IFRAME_SANDBOX, artifactFrameKey, parseArtifactUrl, printArtifact, } from './frame-policy.js';
+export { ArtifactFrame, ensureArtifactFrame } from './artifact-frame.js';
+export { ArtifactPanelPreview, ShowArtifactCard } from './artifact-session.js';

package/dist/artifacts/index.js

@@ -0,0 +1,5 @@
+// Kortix Artifacts in any host: the frame policy and link parsing (server-safe),
+// the pooled page frame, and the session views (chat card, panel preview).
+export { ARTIFACT_FRAME_ALLOW, ARTIFACT_FRAME_PREFIX, ARTIFACT_IFRAME_SANDBOX, artifactFrameKey, parseArtifactUrl, printArtifact, } from './frame-policy.js';
+export { ArtifactFrame, ensureArtifactFrame } from './artifact-frame.js';
+export { ArtifactPanelPreview, ShowArtifactCard } from './artifact-session.js';

package/dist/browser/sandbox-browser-chrome.d.ts

@@ -27,7 +27,7 @@ export declare function parseAddressInput(value: string): string | null;
  * controls around it (`BrowserPanel`'s overflow menu, `AppPreview`'s viewer
  * actions and close) — the component is a fragment, so it slots between them.
  */
-export declare function SandboxAddressBar({ displayValue, hasPreview, isLoading, canGoBack, canGoForward, onBack, onForward, onReload, onHome, onNavigate, suggestions, placeholder, ariaLabel, inputRef, resetOnEscape, trailing, }: {
+export declare function SandboxAddressBar({ displayValue, hasPreview, isLoading, canGoBack, canGoForward, onBack, onForward, onReload, onHome, onNavigate, suggestions, placeholder, ariaLabel, inputRef, resetOnEscape, trailing, disabled, }: {
     /** The URL the bar shows at rest — the surface's current address. */
     displayValue: string;
     hasPreview: boolean;
@@ -58,6 +58,9 @@ export declare function SandboxAddressBar({ displayValue, hasPreview, isLoading,
     /** Actions on the open page, rendered at the address's trailing edge —
      *  `AppPreview` puts `Copy link` here. */
     trailing?: ReactNode;
+    /** The address takes no input (the session's computer is booting). Pair it
+     *  with `hasPreview={false}`, which disables the buttons. */
+    disabled?: boolean;
 }): import("react").JSX.Element;
 /**
  * The "still loading" overlay both preview surfaces paint over the iframe.

package/dist/browser/sandbox-browser-chrome.js

@@ -89,7 +89,7 @@ const NO_SUGGESTIONS = [];
  * controls around it (`BrowserPanel`'s overflow menu, `AppPreview`'s viewer
  * actions and close) — the component is a fragment, so it slots between them.
  */
-export function SandboxAddressBar({ displayValue, hasPreview, isLoading, canGoBack, canGoForward, onBack, onForward, onReload, onHome, onNavigate, suggestions = NO_SUGGESTIONS, placeholder, ariaLabel, inputRef, resetOnEscape = true, trailing, }) {
+export function SandboxAddressBar({ displayValue, hasPreview, isLoading, canGoBack, canGoForward, onBack, onForward, onReload, onHome, onNavigate, suggestions = NO_SUGGESTIONS, placeholder, ariaLabel, inputRef, resetOnEscape = true, trailing, disabled, }) {
     const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
     const [addressValue, setAddressValue] = useState(displayValue);
     const [isEditing, setIsEditing] = useState(false);
@@ -121,7 +121,7 @@ export function SandboxAddressBar({ displayValue, hasPreview, isLoading, canGoBa
         onNavigate(internal);
     }, [addressValue, onNavigate, suggestions]);
     const suggestionsId = useId();
-    return (_jsxs(_Fragment, { children: [_jsxs(ButtonGroup, { className: "shrink-0", children: [_jsx(Hint, { label: tI18nComplete.raw('text76900f1bfd16'), side: "bottom", children: _jsx(Button, { variant: "secondary", size: "icon", onClick: onBack, disabled: !hasPreview || !canGoBack, children: _jsx(ArrowLeft, { className: "size-4" }) }) }), _jsx(Hint, { label: tI18nComplete.raw('textf1c65e14817e'), side: "bottom", children: _jsx(Button, { variant: "secondary", size: "icon", onClick: onForward, disabled: !hasPreview || !canGoForward, children: _jsx(ArrowRight, { className: "size-4" }) }) })] }), _jsx("form", { onSubmit: handleAddressSubmit, className: "flex min-w-0 flex-1 items-center px-1", children: _jsxs(ButtonGroup, { className: "w-full min-w-0", children: [_jsx(Hint, { label: tI18nComplete.raw('text3a78695388b3'), side: "bottom", children: _jsx(Button, { type: "button", variant: "secondary", size: "icon", onClick: onHome, disabled: !hasPreview, "aria-label": tI18nComplete.raw('text3a78695388b3'), children: _jsx(Home, { className: "size-3.5" }) }) }), _jsxs("div", { className: cn('bg-muted flex h-7 min-w-0 flex-1 items-center gap-1 rounded-md border border-transparent px-2 text-xs tracking-tight transition-colors', addressError && 'border-kortix-red/60 focus-within:border-kortix-red/60 animate-shake'), children: [_jsxs("div", { className: "group/address relative flex h-full min-w-0 flex-1 items-center", children: [_jsx(Input, { ref: inputRef, type: "text", size: "xs", value: urlParts ? displayValue : addressValue, "aria-label": ariaLabel, list: suggestions.length ? suggestionsId : undefined, onChange: (e) => {
+    return (_jsxs(_Fragment, { children: [_jsxs(ButtonGroup, { className: "shrink-0", children: [_jsx(Hint, { label: tI18nComplete.raw('text76900f1bfd16'), side: "bottom", children: _jsx(Button, { variant: "secondary", size: "icon", onClick: onBack, disabled: !hasPreview || !canGoBack, children: _jsx(ArrowLeft, { className: "size-4" }) }) }), _jsx(Hint, { label: tI18nComplete.raw('textf1c65e14817e'), side: "bottom", children: _jsx(Button, { variant: "secondary", size: "icon", onClick: onForward, disabled: !hasPreview || !canGoForward, children: _jsx(ArrowRight, { className: "size-4" }) }) })] }), _jsx("form", { onSubmit: handleAddressSubmit, className: "flex min-w-0 flex-1 items-center px-1", children: _jsxs(ButtonGroup, { className: "w-full min-w-0", children: [_jsx(Hint, { label: tI18nComplete.raw('text3a78695388b3'), side: "bottom", children: _jsx(Button, { type: "button", variant: "secondary", size: "icon", onClick: onHome, disabled: !hasPreview, "aria-label": tI18nComplete.raw('text3a78695388b3'), children: _jsx(Home, { className: "size-3.5" }) }) }), _jsxs("div", { className: cn('bg-muted flex h-7 min-w-0 flex-1 items-center gap-1 rounded-md border border-transparent px-2 text-xs tracking-tight transition-colors', addressError && 'border-kortix-red/60 focus-within:border-kortix-red/60 animate-shake'), children: [_jsxs("div", { className: "group/address relative flex h-full min-w-0 flex-1 items-center", children: [_jsx(Input, { ref: inputRef, type: "text", size: "xs", disabled: disabled, value: urlParts ? displayValue : addressValue, "aria-label": ariaLabel, list: suggestions.length ? suggestionsId : undefined, onChange: (e) => {
                                                 setAddressValue(e.target.value);
                                                 if (addressError)
                                                     setAddressError(false);

package/dist/customize/agents/agent-grant-pages.d.ts

@@ -1,13 +1,17 @@
 import type { AgentDraft } from '../sections/view/agent-editor.js';
 import { type ProjectConfigSummary } from '@kortix/sdk';
+import { type PolicySetOption } from './agent-policy-sets.js';
 export declare function SkillsGrantPage({ projectId, config, editor, }: {
     projectId: string;
     config: ProjectConfigSummary;
     editor: AgentDraft;
 }): import("react").JSX.Element;
-export declare function ConnectorsGrantPage({ projectId, editor, }: {
+export declare function ConnectorsGrantPage({ projectId, editor, policySetOptions, }: {
     projectId: string;
     editor: AgentDraft;
+    /** Each connector's policy sets (`connectorPolicySetOptions`), read from the
+     *  manifest the page already holds. */
+    policySetOptions?: Record<string, PolicySetOption[]>;
 }): import("react").JSX.Element;
 export declare function SecretsGrantPage({ projectId, editor }: {
     projectId: string;

package/dist/customize/agents/agent-grant-pages.js

@@ -15,11 +15,15 @@ import { useTranslations as useI18nTranslations } from '../../i18n/index.js';
 import { Badge } from '../../primitives/badge.js';
 import { Button } from '../../primitives/button.js';
 import { Checkbox } from '../../primitives/checkbox.js';
+import Hint from '../../primitives/hint.js';
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue, } from '../../primitives/select.js';
 import { Skeleton } from '../../primitives/skeleton.js';
 import { EmptyState } from '../../primitives/empty-state.js';
 import { ErrorState } from '../../primitives/error-state.js';
 import { connectorDisplayName } from '../connectors/connector-filter.js';
-import { ConnectorAppIcon, ConnectorStatusBadge, } from '../connectors/connector-identity.js';
+import { ConnectorStatusBadge } from '../connectors/connector-identity.js';
+import { ConnectorLogo } from '../../internal/connector-logo/connector-logo.js';
+import { installedConnectorLogoSource } from '../../internal/connector-logo/connector-logo-source.js';
 import { ConnectorModal } from '../connectors/detail/connector-modal.js';
 import { providerLabel } from '../connectors/provider-label.js';
 import { detailSelection } from '../shared/detail-selection.js';
@@ -38,6 +42,7 @@ import { PlusIcon } from '@phosphor-icons/react';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { useState } from 'react';
 import { appGrantRows } from './agent-apps-grant.js';
+import { policySetRows, withPolicySet, } from './agent-policy-sets.js';
 /**
  * All · Pick · None over the project's catalog, as one bordered list. The
  * checkbox exists only in Pick mode, where it is the control; in All and
@@ -97,7 +102,28 @@ export function SkillsGrantPage({ projectId, config, editor, }) {
                 } })] }));
 }
 // ─── Connectors ──────────────────────────────────────────────────────────
-export function ConnectorsGrantPage({ projectId, editor, }) {
+const BASE_SET_VALUE = '__base';
+/**
+ * Which rule set the agent gets on each granted connector that defines sets
+ * (`agents.<a>.policy_sets`). One list for Pick and All alike: under All the
+ * catalog has no per-row controls, and a second rendering for that mode would
+ * be two places to set one value. Choosing a set needs connector write as well
+ * as agent write (the API checks both), so a viewer without it sees the
+ * values but cannot change them.
+ */
+function AgentPolicySetsSection({ editor, catalog, connectors, canWrite, }) {
+    const t = useI18nTranslations('connectorPolicySets');
+    const { draft, set } = editor;
+    const rows = policySetRows(draft.connectors, catalog, draft.policy_sets, connectors.map((connector) => connector.slug));
+    if (rows.length === 0)
+        return null;
+    return (_jsx(EditorSection, { title: t('agentSection'), bare: true, children: _jsx(EditorList, { children: rows.map((row) => {
+                const connector = connectors.find((candidate) => candidate.slug === row.slug);
+                const name = connector ? connectorDisplayName(connector) : row.slug;
+                return (_jsxs("li", { className: "flex min-h-13 items-center gap-3 px-4 py-2", children: [connector ? (_jsx(ConnectorLogo, { source: installedConnectorLogoSource(connector), size: "sm" })) : null, _jsxs("span", { className: "min-w-0 flex-1", children: [_jsx("span", { className: "text-foreground block truncate text-sm font-medium", children: name }), _jsx("span", { className: "text-muted-foreground block truncate font-mono text-xs", children: row.slug })] }), row.missing && row.value ? (_jsx(Hint, { label: t('agentMissingHint', { name: row.value }), children: _jsx(Badge, { variant: "destructive", size: "xs", children: t('agentMissing') }) })) : null, _jsxs(Select, { value: row.value ?? BASE_SET_VALUE, disabled: !canWrite, onValueChange: (next) => set('policy_sets', withPolicySet(draft.policy_sets, row.slug, next === BASE_SET_VALUE ? null : next)), children: [_jsx(SelectTrigger, { size: "sm", className: "w-40 shrink-0", "aria-label": t('agentSelectLabel', { name }), children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { align: "end", children: [_jsx(SelectItem, { value: BASE_SET_VALUE, children: t('baseRules') }), row.options.map((option) => (_jsx(SelectItem, { value: option.name, description: option.description, children: _jsx("span", { className: "font-mono", children: option.name }) }, option.name))), row.missing && row.value ? (_jsx(SelectItem, { value: row.value, children: _jsx("span", { className: "font-mono", children: row.value }) })) : null] })] })] }, row.slug));
+            }) }) }));
+}
+export function ConnectorsGrantPage({ projectId, editor, policySetOptions, }) {
     const tI18nComplete = useI18nTranslations('hardcodedUi.i18nComplete');
     const queryClient = useQueryClient();
     const accountId = useProjectAccountId(projectId);
@@ -131,7 +157,7 @@ export function ConnectorsGrantPage({ projectId, editor, }) {
                                 }
                             }, isLoading: connectorsQuery.isLoading, isError: connectorsQuery.isError, onRetry: () => void connectorsQuery.refetch(), items: connectors.map((connector) => ({
                                 id: connector.slug,
-                                leading: _jsx(ConnectorAppIcon, { connector: connector, size: "sm" }),
+                                leading: _jsx(ConnectorLogo, { source: installedConnectorLogoSource(connector), size: "sm" }),
                                 title: connectorDisplayName(connector),
                                 description: `${providerLabel(connector.provider)} · ${connector.actions.length} ${connector.actions.length === 1 ? 'action' : 'actions'}`,
                                 status: _jsx(ConnectorStatusBadge, { connector: connector }),
@@ -142,7 +168,7 @@ export function ConnectorsGrantPage({ projectId, editor, }) {
                                         ? current.filter((a) => a !== slug)
                                         : [...current, slug];
                                     set('connectors_required', next.length ? next : undefined);
-                                } })), empty: _jsx(EmptyState, { size: "sm", title: tI18nComplete.raw('text51ae0a7e3783'), description: tI18nComplete.raw('text9bf8fe539046') }) }), draft.connectors === 'all' && draft.connectors_required?.length ? (_jsxs("p", { className: "text-muted-foreground text-xs", children: [tI18nComplete.raw('textf39fe0fefce2'), ' ', _jsx("span", { className: "font-mono", children: draft.connectors_required.join(', ') }), tI18nComplete.raw('text954401fb96d1')] })) : null] }) }), _jsx(ConnectorModal, { projectId: projectId, connector: detail.record, canWrite: canWrite, open: detail.open, isResolving: detail.isResolving, onOpenChange: (open) => !open && setDetailSlug(null), onChanged: invalidate, onRemoved: () => {
+                                } })), empty: _jsx(EmptyState, { size: "sm", title: tI18nComplete.raw('text51ae0a7e3783'), description: tI18nComplete.raw('text9bf8fe539046') }) }), draft.connectors === 'all' && draft.connectors_required?.length ? (_jsxs("p", { className: "text-muted-foreground text-xs", children: [tI18nComplete.raw('textf39fe0fefce2'), ' ', _jsx("span", { className: "font-mono", children: draft.connectors_required.join(', ') }), tI18nComplete.raw('text954401fb96d1')] })) : null] }) }), _jsx(AgentPolicySetsSection, { editor: editor, catalog: policySetOptions ?? {}, connectors: connectors, canWrite: canWrite }), _jsx(ConnectorModal, { projectId: projectId, connector: detail.record, canWrite: canWrite, open: detail.open, isResolving: detail.isResolving, onOpenChange: (open) => !open && setDetailSlug(null), onChanged: invalidate, onRemoved: () => {
                     invalidate();
                     setDetailSlug(null);
                 } })] }));

package/dist/customize/agents/agent-page.js

@@ -93,6 +93,7 @@ import { AgentDrivesSection } from './agent-drives-section.js';
 import { AgentAuthorityCard } from './agent-authority-card.js';
 import { AgentModel, AgentScope } from './agent-detail-aside.js';
 import { AppsGrantPage, ConnectorsGrantPage, SecretsGrantPage, SkillsGrantPage, } from './agent-grant-pages.js';
+import { connectorPolicySetOptions } from './agent-policy-sets.js';
 import { AgentPeopleSection } from './agent-people-section.js';
 import { AgentShareControl } from './agent-share-control.js';
 import { AgentTriggersSection } from './agent-triggers-section.js';
@@ -290,6 +291,7 @@ function EditableAgentPage({ projectId, agent, config, initial, schemaVersion, }
     const drivesOn = useFeatureFlag(projectId, 'drives').enabled;
     const sections = useMemo(() => agentConfigSectionKeys(schemaVersion).filter((k) => drivesOn || k !== 'drives'), [schemaVersion, drivesOn]);
     const registryOptions = useMemo(() => registryGrantOptions({ manifest_raw: config.manifest_raw, agents: toArray(config.agents) }, agent.name), [config.manifest_raw, config.agents, agent.name]);
+    const policySetOptions = useMemo(() => connectorPolicySetOptions(config.manifest_raw), [config.manifest_raw]);
     const section = useAgentSection(sections);
     const onSave = useCallback(async () => {
         if (!editor.isDirty || update.isPending)
@@ -308,7 +310,7 @@ function EditableAgentPage({ projectId, agent, config, initial, schemaVersion, }
     // shared across topics and nothing is lost.
     const leaveGuard = useUnsavedChangesGuard(editor.isDirty, pathname);
     useSaveShortcut(onSave);
-    return (_jsx(AgentPageFrame, { header: _jsx(AgentHeader, { projectId: projectId, agent: agent, config: config, canWrite: true }), section: section, sections: sections, sectionHref: sectionHrefFor(pathname), pane: _jsx(AgentConfigSections, { section: section, editor: editor, options: options, skillsOptions: skillsOptions, registryOptions: registryOptions, skills: _jsx(SkillsGrantPage, { projectId: projectId, config: config, editor: editor }), connectors: _jsx(ConnectorsGrantPage, { projectId: projectId, editor: editor }), secrets: _jsx(SecretsGrantPage, { projectId: projectId, editor: editor }), apps: _jsx(AppsGrantPage, { projectId: projectId, editor: editor }), drives: _jsx(AgentDrivesSection, { projectId: projectId, agentName: agent.name }), overview: _jsx(OverviewPane, { description: editor.oc.description ?? '', onDescriptionChange: (next) => editor.setOc('description', next), descriptionHelp: editor.oc.mode === 'subagent'
+    return (_jsx(AgentPageFrame, { header: _jsx(AgentHeader, { projectId: projectId, agent: agent, config: config, canWrite: true }), section: section, sections: sections, sectionHref: sectionHrefFor(pathname), pane: _jsx(AgentConfigSections, { section: section, editor: editor, options: options, skillsOptions: skillsOptions, registryOptions: registryOptions, skills: _jsx(SkillsGrantPage, { projectId: projectId, config: config, editor: editor }), connectors: _jsx(ConnectorsGrantPage, { projectId: projectId, editor: editor, policySetOptions: policySetOptions }), secrets: _jsx(SecretsGrantPage, { projectId: projectId, editor: editor }), apps: _jsx(AppsGrantPage, { projectId: projectId, editor: editor }), drives: _jsx(AgentDrivesSection, { projectId: projectId, agentName: agent.name }), overview: _jsx(OverviewPane, { description: editor.oc.description ?? '', onDescriptionChange: (next) => editor.setOc('description', next), descriptionHelp: editor.oc.mode === 'subagent'
                     ? 'Required. This is how other agents decide to call it.'
                     : 'One line on what this agent is for. Other agents read it when picking a subagent.', prompt: editor.oc.prompt ?? '', onPromptChange: (next) => editor.setOc('prompt', next) }), triggers: _jsx(AgentTriggersSection, { projectId: projectId, agentName: agent.name, defaultAgent: config.default_agent ?? config.open_code_default_agent }), people: _jsx(AgentPeopleSection, { projectId: projectId, agentName: agent.name }), authority: _jsx(AgentAuthorityCard, { projectId: projectId, agentName: agent.name, grant: editor.draft.kortix_permissions ?? editor.draft.kortix_cli }) }), footer: _jsxs(_Fragment, { children: [_jsx(SaveBar, { dirty: editor.isDirty, pending: update.isPending, onDiscard: () => setConfirmDiscard(true), onSave: onSave }), _jsx(ConfirmDialog, { open: confirmDiscard, onOpenChange: setConfirmDiscard, title: tI18nComplete.raw('text3b13192b9d88'), description: tI18nComplete('text8a36cce34f68', { value0: capitalizeWords(agent.name) }), confirmLabel: tI18nComplete.raw('texteb1a70e39274'), cancelLabel: tI18nComplete.raw('texte76fd2add010'), confirmVariant: "destructive", onConfirm: () => {
                         setConfirmDiscard(false);

package/dist/customize/agents/agent-policy-sets.d.ts

@@ -0,0 +1,43 @@
+import type { AgentGrantSetV2 } from '@kortix/sdk';
+/**
+ * The agent side of connector policy sets: `agents.<a>.policy_sets` maps a
+ * connector slug to one of that connector's sets (`connectors[].policy_sets`).
+ * An absent key means the base rules.
+ */
+export interface PolicySetOption {
+    name: string;
+    description?: string;
+}
+/**
+ * Every connector's set names, read from the root kortix.yaml. The agent page
+ * already holds the raw manifest, so the editor needs no request per connector.
+ * ponytail: connectors declared in an `imports:` file are not read; an agent
+ * that names a set on one still shows its value, flagged as missing.
+ */
+export declare function connectorPolicySetOptions(manifestRaw: string | null | undefined): Record<string, PolicySetOption[]>;
+/**
+ * One connector's set choice; `null` (or `base`) clears it. Clearing the last
+ * entry returns `{}`, never `undefined`: the config PUT keeps the declared
+ * `policy_sets` when the key is omitted, so `{}` is what removes it.
+ *
+ * Entries on connectors the agent no longer holds are kept on purpose: they
+ * are inert until the connector is granted again, and dropping one is a set
+ * change that needs project.connector.write.
+ */
+export declare function withPolicySet(policySets: Record<string, string> | undefined, slug: string, name: string | null): Record<string, string>;
+export interface PolicySetRow {
+    slug: string;
+    options: PolicySetOption[];
+    /** The set the agent names, or null for the base rules. */
+    value: string | null;
+    /** The agent names a set the connector does not define: calls are blocked. */
+    missing: boolean;
+}
+/**
+ * The rows of the agent's "Rule sets" list: every granted connector that
+ * defines at least one set, plus every connector the agent already names a set
+ * on (so a stale entry is visible and can be cleared).
+ */
+export declare function policySetRows(grant: AgentGrantSetV2 | undefined, catalog: Record<string, PolicySetOption[]>, policySets: Record<string, string> | undefined, 
+/** Slugs of the project's connectors, in display order. */
+connectorSlugs: readonly string[]): PolicySetRow[];

package/dist/customize/agents/agent-policy-sets.js

@@ -0,0 +1,72 @@
+import { parseManifestText } from '../../_vendor/kortix-shared.js';
+/**
+ * Every connector's set names, read from the root kortix.yaml. The agent page
+ * already holds the raw manifest, so the editor needs no request per connector.
+ * ponytail: connectors declared in an `imports:` file are not read; an agent
+ * that names a set on one still shows its value, flagged as missing.
+ */
+export function connectorPolicySetOptions(manifestRaw) {
+    let manifest = {};
+    try {
+        manifest = manifestRaw ? parseManifestText(manifestRaw, 'yaml') : {};
+    }
+    catch {
+        return {};
+    }
+    const out = Object.create(null);
+    const connectors = Array.isArray(manifest.connectors) ? manifest.connectors : [];
+    for (const entry of connectors) {
+        if (!entry || typeof entry !== 'object')
+            continue;
+        const { slug, policy_sets: sets } = entry;
+        if (typeof slug !== 'string' || !sets || typeof sets !== 'object' || Array.isArray(sets))
+            continue;
+        const options = Object.entries(sets).map(([name, set]) => {
+            const description = set?.description;
+            return typeof description === 'string' && description ? { name, description } : { name };
+        });
+        if (options.length > 0)
+            out[slug] = options;
+    }
+    return out;
+}
+/**
+ * One connector's set choice; `null` (or `base`) clears it. Clearing the last
+ * entry returns `{}`, never `undefined`: the config PUT keeps the declared
+ * `policy_sets` when the key is omitted, so `{}` is what removes it.
+ *
+ * Entries on connectors the agent no longer holds are kept on purpose: they
+ * are inert until the connector is granted again, and dropping one is a set
+ * change that needs project.connector.write.
+ */
+export function withPolicySet(policySets, slug, name) {
+    const next = Object.fromEntries(Object.entries(policySets ?? {}).filter(([key]) => key !== slug));
+    if (name && name !== 'base')
+        next[slug] = name;
+    return next;
+}
+/**
+ * The rows of the agent's "Rule sets" list: every granted connector that
+ * defines at least one set, plus every connector the agent already names a set
+ * on (so a stale entry is visible and can be cleared).
+ */
+export function policySetRows(grant, catalog, policySets, 
+/** Slugs of the project's connectors, in display order. */
+connectorSlugs) {
+    const granted = (slug) => grant === 'all' || (Array.isArray(grant) && grant.includes(slug));
+    const assigned = policySets ?? {};
+    const slugs = [
+        ...connectorSlugs.filter((slug) => granted(slug) && (catalog[slug]?.length || Object.hasOwn(assigned, slug))),
+        ...Object.keys(assigned).filter((slug) => !connectorSlugs.includes(slug)),
+    ];
+    return slugs.map((slug) => {
+        const options = catalog[slug] ?? [];
+        const value = Object.hasOwn(assigned, slug) ? (assigned[slug] ?? null) : null;
+        return {
+            slug,
+            options,
+            value,
+            missing: value !== null && !options.some((option) => option.name === value),
+        };
+    });
+}

package/dist/customize/agents/agent-triggers-section.js

@@ -34,7 +34,7 @@ import { useProjectFeatureFlags } from '../../internal/lib/use-project-feature-f
 import { cn } from '../../internal/lib/utils.js';
 import { listProjectTriggers } from '@kortix/sdk';
 import { contract, qk } from '@kortix/sdk/react';
-import { LightningIcon, PlusIcon, PulseIcon, TimerIcon, WebhooksLogoIcon, } from '@phosphor-icons/react';
+import { AppWindowIcon, LightningIcon, PlusIcon, PulseIcon, TimerIcon, WebhooksLogoIcon, } from '@phosphor-icons/react';
 import { useQuery, useQueryClient } from '@tanstack/react-query';
 import { useCallback, useMemo, useState } from 'react';
 const KIND_ICON = {
@@ -42,6 +42,7 @@ const KIND_ICON = {
     webhook: WebhooksLogoIcon,
     monitor: PulseIcon,
     event: LightningIcon,
+    app: AppWindowIcon,
 };
 /**
  * Whether `trigger` starts `agentName`. A trigger that names no agent is

package/dist/customize/connectors/add-mcp/add-mcp-server-dialog.d.ts

@@ -6,11 +6,16 @@ import type { McpServerApp } from '../install/mcp-first.js';
  * provider's consent page. It replaced eight steps through the custom
  * connector form, Sign in and Add account.
  */
-export declare function AddMcpServerDialog({ projectId, open, onOpenChange, takenSlugs, onAdded, app, }: {
+export declare function AddMcpServerDialog({ projectId, open, onOpenChange, takenSlugs, onAdded, app, initial, }: {
     projectId: string;
     /** A catalogue app's own MCP server: the URL is filled in and the dialog
      *  is titled for the app. Null for a server the user pastes. */
     app?: McpServerApp | null;
+    /** A pasted server prefilled from a link (an agent's `setup_url`): a person confirms it here. */
+    initial?: {
+        url: string;
+        name?: string;
+    } | null;
     open: boolean;
     onOpenChange: (open: boolean) => void;
     /** Slugs of the project's connectors: a new server never reuses one. */

package/dist/customize/connectors/add-mcp/add-mcp-server-dialog.js

@@ -28,7 +28,7 @@ const NO_PICKS = { memberIds: [], groupIds: [], agentIds: [] };
  * provider's consent page. It replaced eight steps through the custom
  * connector form, Sign in and Add account.
  */
-export function AddMcpServerDialog({ projectId, open, onOpenChange, takenSlugs, onAdded, app = null, }) {
+export function AddMcpServerDialog({ projectId, open, onOpenChange, takenSlugs, onAdded, app = null, initial = null, }) {
     const t = useTranslations('connectorPages');
     const tSharing = useTranslations('accessSharing');
     const tI18nComplete = useTranslations('hardcodedUi.i18nComplete');
@@ -46,7 +46,7 @@ export function AddMcpServerDialog({ projectId, open, onOpenChange, takenSlugs,
     const everyoneLabel = projectName
         ? tSharing('everyone', { project: projectName })
         : tSharing('visibilityEveryone');
-    const [url, setUrl] = useState(app?.url ?? '');
+    const [url, setUrl] = useState(app?.url ?? initial?.url ?? '');
     const [audience, setAudience] = useState({ audience: 'private', picked: NO_PICKS });
     // The catalogue app's own server, unchanged: named after the app, and its
     // sign-in is known to be one click (`mcpServerFor`).
@@ -57,10 +57,14 @@ export function AddMcpServerDialog({ projectId, open, onOpenChange, takenSlugs,
             ? mcpAppIdentity(app.name, takenSlugs)
             : mcpServerIdentity(url, takenSlugs);
     const urlInvalid = url.trim() !== '' && identity === null;
+    // The profile's name: proposed from the app or the URL until the user edits it.
+    const [nameEdit, setNameEdit] = useState(initial?.name ?? null);
+    const name = (nameEdit ?? identity?.name ?? '').trim();
     const add = useMutation({
         mutationFn: () => addMcpServer(projectId, {
             url,
-            ...(appServer ? { appName: app.name, signIn: true } : {}),
+            ...(name ? { appName: name } : {}),
+            ...(appServer ? { signIn: true } : {}),
             audience: audience.audience,
             grantees: newAccountGrantees(audience.picked),
             takenSlugs,
@@ -94,6 +98,7 @@ export function AddMcpServerDialog({ projectId, open, onOpenChange, takenSlugs,
         audience.picked.groupIds.length +
         (audience.picked.agentIds?.length ?? 0);
     const canSubmit = identity !== null &&
+        /[a-z0-9]/i.test(name) &&
         !add.isPending &&
         (audience.audience === 'private' ||
             (canManageConnections && (audience.audience === 'project' || (Boolean(accountId) && picks > 0))));
@@ -103,6 +108,7 @@ export function AddMcpServerDialog({ projectId, open, onOpenChange, takenSlugs,
         onOpenChange(next);
         if (!next) {
             setUrl(app?.url ?? '');
+            setNameEdit(null);
             setAudience({ audience: 'private', picked: NO_PICKS });
         }
     };
@@ -110,5 +116,5 @@ export function AddMcpServerDialog({ projectId, open, onOpenChange, takenSlugs,
                         event.preventDefault();
                         if (canSubmit)
                             add.mutate();
-                    }, children: [_jsxs(ModalBody, { className: "max-h-[60vh] space-y-4 overflow-y-auto", children: [_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: `${id}-url`, children: t('addMcpUrlLabel') }), _jsx(Input, { id: `${id}-url`, type: "url", inputMode: "url", autoComplete: "off", spellCheck: false, value: url, onChange: (event) => setUrl(event.target.value), placeholder: "https://mcp.example.com/mcp", "aria-invalid": urlInvalid || undefined, disabled: add.isPending, autoFocus: !app }), urlInvalid ? (_jsx(FieldDescription, { className: "text-destructive", role: "alert", children: t('addMcpUrlInvalid') })) : (_jsx(FieldDescription, { children: identity ? t('addMcpUrlNamed', { name: identity.name }) : t('addMcpUrlHint') }))] }), _jsx(AudienceFields, { projectId: projectId, value: audience, onChange: setAudience, canShare: canManageConnections, accountId: accountId, everyoneLabel: everyoneLabel, shareRequiresLabel: tSharing('shareRequiresManage'), disabled: add.isPending })] }), _jsxs(ModalFooter, { className: "sm:justify-between", children: [_jsx(Button, { type: "button", variant: "outline-ghost", onClick: () => close(false), disabled: add.isPending, children: tI18nComplete.raw('text19766ed6ccb2') }), _jsxs(Button, { type: "submit", disabled: !canSubmit, children: [add.isPending ? _jsx(Loading, { className: "size-4 shrink-0" }) : null, t('addMcpConnect')] })] })] })] }) }));
+                    }, children: [_jsxs(ModalBody, { className: "max-h-[60vh] space-y-4 overflow-y-auto", children: [app ? null : (_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: `${id}-url`, children: t('addMcpUrlLabel') }), _jsx(Input, { id: `${id}-url`, type: "url", inputMode: "url", autoComplete: "off", spellCheck: false, value: url, onChange: (event) => setUrl(event.target.value), placeholder: "https://mcp.example.com/mcp", "aria-invalid": urlInvalid || undefined, disabled: add.isPending, autoFocus: !app }), urlInvalid ? (_jsx(FieldDescription, { className: "text-destructive", role: "alert", children: t('addMcpUrlInvalid') })) : (_jsx(FieldDescription, { children: t('addMcpUrlHint') }))] })), app && nameEdit === null ? null : (_jsxs(Field, { children: [_jsx(FieldLabel, { htmlFor: `${id}-name`, children: t('installNameLabel') }), _jsx(Input, { id: `${id}-name`, value: nameEdit ?? identity?.name ?? '', onChange: (event) => setNameEdit(event.target.value), autoComplete: "off", disabled: add.isPending || identity === null }), _jsx(FieldDescription, { children: t('installProfileHint') })] })), _jsx(AudienceFields, { projectId: projectId, value: audience, onChange: setAudience, canShare: canManageConnections, accountId: accountId, everyoneLabel: everyoneLabel, shareRequiresLabel: tSharing('shareRequiresManage'), disabled: add.isPending })] }), _jsxs(ModalFooter, { className: "sm:justify-between", children: [app && nameEdit === null ? (_jsx(Button, { type: "button", variant: "text", size: "sm", className: "px-0", onClick: () => setNameEdit(identity?.name ?? app.name), disabled: add.isPending, children: t('installRename') })) : null, _jsx(Button, { type: "button", variant: "outline-ghost", className: app && nameEdit === null ? 'sm:ml-auto' : undefined, onClick: () => close(false), disabled: add.isPending, children: tI18nComplete.raw('text19766ed6ccb2') }), _jsxs(Button, { type: "submit", disabled: !canSubmit, children: [add.isPending ? _jsx(Loading, { className: "size-4 shrink-0" }) : null, t('addMcpConnect')] })] })] })] }) }));
 }