@kortix/ui 0.14.7 → 0.14.9

package/dist/internal/files/session-drive-files.js

@@ -38,12 +38,17 @@ export function resolveSessionDriveFile(filePath, mounts) {
     return { driveId: best.driveId, path: `${stripTrailingSlashes(best.subdir)}${rest}` || '/' };
 }
 let scope = null;
-/** Make `next` the session drive paths resolve against; returns its undo. */
+/**
+ * Make `next` the session drive paths resolve against; returns its undo. The
+ * undo restores the scope it replaced: a review item's files open over a
+ * session page, and closing them must not drop that page's scope.
+ */
 export function setSessionDriveFilesScope(next) {
+    const previous = scope;
     scope = next;
     return () => {
         if (scope === next)
-            scope = null;
+            scope = previous;
     };
 }
 /** Make the open session's mounts the ones drive paths resolve against. */

package/dist/internal/hooks/channels/use-channels-installations.d.ts

@@ -1,6 +1,6 @@
 /** @internal Kortix apps only. No semver: it may change in any release. */
-import { type EmailInstallation, type EmailMode, type EmailSenderPolicy, type SlackInstallation, type SlackMode, type ConnectTelegramInput, type TelegramInstallation } from '@kortix/sdk';
-export type { EmailInstallation, EmailMode, EmailSenderPolicy, SlackInstallation, SlackMode, TelegramInstallation };
+import { type EmailDomain, type EmailDomainList, type EmailDomainResult, type EmailInstallation, type EmailMode, type EmailSenderPolicy, type SlackInstallation, type SlackMode, type ConnectTelegramInput, type TelegramInstallation, type ChannelAccessList, type ChannelAccessPlatform, type ChannelUser } from '@kortix/sdk';
+export type { EmailDomain, EmailDomainList, EmailDomainResult, EmailInstallation, EmailMode, EmailSenderPolicy, SlackInstallation, SlackMode, TelegramInstallation, ChannelAccessPlatform, ChannelUser, };
 export declare function useSlackInstall(projectId: string | null): import("@tanstack/react-query").UseQueryResult<SlackInstallation | null, Error>;
 interface ConnectInput {
     projectId: string;
@@ -25,6 +25,21 @@ interface ConnectEmailInput {
     sender_policy?: EmailSenderPolicy;
 }
 export declare function useConnectEmail(): import("@tanstack/react-query").UseMutationResult<EmailInstallation, Error, ConnectEmailInput, unknown>;
+/** The domains an own Resend API key can create inboxes on. A mutation: it runs when the user enters a key. */
+export declare function useListEmailDomains(): import("@tanstack/react-query").UseMutationResult<EmailDomainList, Error, {
+    projectId: string;
+    apiKey: string;
+}, unknown>;
+export declare function useAddEmailDomain(): import("@tanstack/react-query").UseMutationResult<EmailDomainResult, Error, {
+    projectId: string;
+    apiKey: string;
+    domain: string;
+}, unknown>;
+export declare function useVerifyEmailDomain(): import("@tanstack/react-query").UseMutationResult<EmailDomainResult, Error, {
+    projectId: string;
+    apiKey: string;
+    domainId: string;
+}, unknown>;
 export declare function useDisconnectEmail(): import("@tanstack/react-query").UseMutationResult<{
     projectId: string;
     connectorSlug: string | null | undefined;
@@ -37,13 +52,25 @@ export declare function useUpdateEmailPolicy(): import("@tanstack/react-query").
     connectorSlug?: string | null;
     sender_policy: EmailSenderPolicy;
 }, unknown>;
-/** The project's Telegram bot (connectors_v2). Pass null to keep the query off. */
+/** The project's Telegram bot. Pass null to keep the query off. */
 export declare function useTelegramInstall(projectId: string | null): import("@tanstack/react-query").UseQueryResult<TelegramInstallation | null, Error>;
 export declare function useConnectTelegram(): import("@tanstack/react-query").UseMutationResult<TelegramInstallation, Error, {
     projectId: string;
 } & ConnectTelegramInput, unknown>;
-export declare function useSetTelegramAllowedUsers(): import("@tanstack/react-query").UseMutationResult<TelegramInstallation, Error, {
+/** Allowed users and access requests, with their names on the platform. Each fetch can call the platform, so enable it only on demand. */
+export declare function useChannelUsers(projectId: string, platform: ChannelAccessPlatform, enabled: boolean): import("@tanstack/react-query").UseQueryResult<import("@kortix/sdk").ChannelUsers, Error>;
+/** One user's profile photo. Off without a `version`: that user has no photo. */
+export declare function useChannelUserPhoto(projectId: string, platform: ChannelAccessPlatform, userId: string, version: string | null, enabled: boolean): import("@tanstack/react-query").UseQueryResult<Blob | null, Error>;
+export declare const useAllowChannelUser: (platform: ChannelAccessPlatform) => import("@tanstack/react-query").UseMutationResult<ChannelAccessList, Error, {
+    projectId: string;
+    userId: string;
+}, unknown>;
+export declare const useRemoveChannelUser: (platform: ChannelAccessPlatform) => import("@tanstack/react-query").UseMutationResult<ChannelAccessList, Error, {
+    projectId: string;
+    userId: string;
+}, unknown>;
+export declare const useDismissChannelAccessRequest: (platform: ChannelAccessPlatform) => import("@tanstack/react-query").UseMutationResult<ChannelAccessList, Error, {
     projectId: string;
-    userIds: string[];
+    userId: string;
 }, unknown>;
 export declare function useDisconnectTelegram(): import("@tanstack/react-query").UseMutationResult<void, Error, string, unknown>;

package/dist/internal/hooks/channels/use-channels-installations.js

@@ -1,5 +1,5 @@
 'use client';
-import { connectEmail, connectSlack, connectTelegram, disconnectEmail, disconnectSlack, disconnectTelegram, getEmailInstallation, getEmailMode, getSlackInstallation, getSlackManifest, getSlackMode, getTelegramInstallation, setTelegramAllowedUsers, updateEmailPolicy, } from '@kortix/sdk';
+import { addEmailDomain, connectEmail, listEmailDomains, verifyEmailDomain, connectSlack, connectTelegram, disconnectEmail, disconnectSlack, disconnectTelegram, getEmailInstallation, getEmailMode, getSlackInstallation, getSlackManifest, getSlackMode, getTelegramInstallation, getChannelUserPhoto, listChannelUsers, allowChannelUser, removeChannelUser, dismissChannelAccessRequest, updateEmailPolicy, } from '@kortix/sdk';
 import { qk } from '@kortix/sdk/react';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 const key = (projectId) => ['channels', 'slack-install', projectId ?? 'none'];
@@ -73,7 +73,7 @@ export function useEmailMode(projectId) {
         staleTime: 60_000,
         queryFn: () => projectId
             ? getEmailMode(projectId)
-            : { provider: 'agentmail', managed_available: false },
+            : { provider: 'resend', managed_available: false },
     });
 }
 export function useConnectEmail() {
@@ -87,6 +87,22 @@ export function useConnectEmail() {
         },
     });
 }
+/** The domains an own Resend API key can create inboxes on. A mutation: it runs when the user enters a key. */
+export function useListEmailDomains() {
+    return useMutation({
+        mutationFn: ({ projectId, apiKey }) => listEmailDomains(projectId, { apiKey }),
+    });
+}
+export function useAddEmailDomain() {
+    return useMutation({
+        mutationFn: ({ projectId, apiKey, domain }) => addEmailDomain(projectId, { apiKey, domain }),
+    });
+}
+export function useVerifyEmailDomain() {
+    return useMutation({
+        mutationFn: ({ projectId, apiKey, domainId }) => verifyEmailDomain(projectId, { apiKey, domainId }),
+    });
+}
 export function useDisconnectEmail() {
     const qc = useQueryClient();
     return useMutation({
@@ -112,8 +128,11 @@ export function useUpdateEmailPolicy() {
         },
     });
 }
-const telegramKey = (projectId) => ['channels', 'telegram-install', projectId ?? 'none'];
-/** The project's Telegram bot (connectors_v2). Pass null to keep the query off. */
+const installKey = (platform, projectId) => ['channels', `${platform}-install`, projectId ?? 'none'];
+const usersKey = (platform, projectId) => ['channels', `${platform}-users`, projectId];
+const telegramKey = (projectId) => installKey('telegram', projectId);
+const telegramUsersKey = (projectId) => usersKey('telegram', projectId);
+/** The project's Telegram bot. Pass null to keep the query off. */
 export function useTelegramInstall(projectId) {
     return useQuery({
         queryKey: telegramKey(projectId),
@@ -128,23 +147,52 @@ export function useConnectTelegram() {
         mutationFn: ({ projectId, ...body }) => connectTelegram(projectId, body),
         onSuccess: (_data, { projectId }) => {
             qc.invalidateQueries({ queryKey: telegramKey(projectId) });
+            // Another bot sees other users: never show the old bot's list.
+            qc.removeQueries({ queryKey: telegramUsersKey(projectId) });
             qc.invalidateQueries({ queryKey: qk.project.connectors(projectId) });
         },
     });
 }
-export function useSetTelegramAllowedUsers() {
+/** Allowed users and access requests, with their names on the platform. Each fetch can call the platform, so enable it only on demand. */
+export function useChannelUsers(projectId, platform, enabled) {
+    return useQuery({
+        queryKey: usersKey(platform, projectId),
+        enabled,
+        queryFn: () => listChannelUsers(projectId, platform),
+    });
+}
+/** One user's profile photo. Off without a `version`: that user has no photo. */
+export function useChannelUserPhoto(projectId, platform, userId, version, enabled) {
+    return useQuery({
+        queryKey: ['channels', `${platform}-photo`, projectId, userId, version],
+        enabled: enabled && !!version,
+        // The version is in the key: a new photo is a new key.
+        staleTime: Infinity,
+        retry: false,
+        queryFn: ({ signal }) => getChannelUserPhoto(projectId, platform, userId, version, signal),
+    });
+}
+function useChannelUserMutation(platform, action) {
     const qc = useQueryClient();
     return useMutation({
-        mutationFn: ({ projectId, userIds }) => setTelegramAllowedUsers(projectId, userIds),
-        onSuccess: (_data, { projectId }) => qc.invalidateQueries({ queryKey: telegramKey(projectId) }),
+        mutationFn: ({ projectId, userId }) => action(projectId, platform, userId),
+        // Returned so the mutation stays pending until the list shows the change.
+        onSuccess: (_data, { projectId }) => Promise.all([
+            qc.invalidateQueries({ queryKey: installKey(platform, projectId) }),
+            qc.invalidateQueries({ queryKey: usersKey(platform, projectId) }),
+        ]),
     });
 }
+export const useAllowChannelUser = (platform) => useChannelUserMutation(platform, allowChannelUser);
+export const useRemoveChannelUser = (platform) => useChannelUserMutation(platform, removeChannelUser);
+export const useDismissChannelAccessRequest = (platform) => useChannelUserMutation(platform, dismissChannelAccessRequest);
 export function useDisconnectTelegram() {
     const qc = useQueryClient();
     return useMutation({
         mutationFn: (projectId) => disconnectTelegram(projectId),
         onSuccess: (_data, projectId) => {
             qc.invalidateQueries({ queryKey: telegramKey(projectId) });
+            qc.removeQueries({ queryKey: telegramUsersKey(projectId) });
             qc.invalidateQueries({ queryKey: qk.project.connectors(projectId) });
         },
     });

package/dist/internal/hooks/channels/use-email-inboxes.d.ts

@@ -0,0 +1,19 @@
+/** @internal Kortix apps only. No semver: it may change in any release. */
+import { type AddEmailInboxInput, type EmailInbox, type EmailSenderPolicy } from '@kortix/sdk';
+export type { AddEmailInboxInput, EmailInbox };
+/** The inboxes the viewer can use. Pass null to keep the query off (flag off). */
+export declare function useEmailInboxes(projectId: string | null): import("@tanstack/react-query").UseQueryResult<EmailInbox[], Error>;
+export declare function useAddEmailInbox(): import("@tanstack/react-query").UseMutationResult<EmailInbox, Error, AddEmailInboxInput & {
+    projectId: string;
+}, unknown>;
+export declare function useUpdateEmailInbox(): import("@tanstack/react-query").UseMutationResult<EmailInbox, Error, {
+    projectId: string;
+    connectionId: string;
+    sender_policy?: EmailSenderPolicy;
+    display_name?: string;
+    label?: string;
+}, unknown>;
+export declare function useRemoveEmailInbox(): import("@tanstack/react-query").UseMutationResult<import("@kortix/sdk").RemoveEmailInboxResult, Error, {
+    projectId: string;
+    connectionId: string;
+}, unknown>;

package/dist/internal/hooks/channels/use-email-inboxes.js

@@ -0,0 +1,48 @@
+'use client';
+import { addEmailInbox, listEmailInboxes, removeEmailInbox, updateEmailInbox, } from '@kortix/sdk';
+import { qk } from '@kortix/sdk/react';
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+/**
+ * The project's email inboxes. Each inbox is one ACCOUNT on the `kortix_email`
+ * connector profile, so the standard account surfaces (default, who can use
+ * it) apply to it; these hooks add what only email has: the Resend inbox
+ * behind the account, its address and who may email it.
+ */
+const inboxesKey = (projectId) => ['channels', 'email-inboxes', projectId ?? 'none'];
+/** Everything that shows an inbox: the inbox list, the account list, the connector page. */
+function refreshInboxViews(qc, projectId) {
+    void qc.invalidateQueries({ queryKey: inboxesKey(projectId) });
+    void qc.invalidateQueries({ queryKey: ['connections', projectId] });
+    void qc.invalidateQueries({ queryKey: qk.project.connectors(projectId) });
+    void qc.invalidateQueries({ queryKey: ['channels', 'email-install'] });
+}
+/** The inboxes the viewer can use. Pass null to keep the query off (flag off). */
+export function useEmailInboxes(projectId) {
+    return useQuery({
+        queryKey: inboxesKey(projectId),
+        enabled: !!projectId,
+        staleTime: 30_000,
+        queryFn: async () => (projectId ? listEmailInboxes(projectId) : []),
+    });
+}
+export function useAddEmailInbox() {
+    const qc = useQueryClient();
+    return useMutation({
+        mutationFn: ({ projectId, ...input }) => addEmailInbox(projectId, input),
+        onSuccess: (_inbox, { projectId }) => refreshInboxViews(qc, projectId),
+    });
+}
+export function useUpdateEmailInbox() {
+    const qc = useQueryClient();
+    return useMutation({
+        mutationFn: ({ projectId, connectionId, ...patch }) => updateEmailInbox(projectId, connectionId, patch),
+        onSuccess: (_inbox, { projectId }) => refreshInboxViews(qc, projectId),
+    });
+}
+export function useRemoveEmailInbox() {
+    const qc = useQueryClient();
+    return useMutation({
+        mutationFn: ({ projectId, connectionId }) => removeEmailInbox(projectId, connectionId),
+        onSuccess: (_result, { projectId }) => refreshInboxViews(qc, projectId),
+    });
+}

package/dist/internal/hooks/connectors/use-add-account.js

@@ -33,7 +33,7 @@ export function useAddAccount({ projectId, connector, displayName, onAdded, onCr
         queryFn: () => listConnections(projectId),
         staleTime: 30_000,
         // A channel connector has no accounts: same guard as `useConnectorDetail`.
-        enabled: connector.provider !== 'channel',
+        enabled: connector.provider !== 'channel' || connector.platform === 'email',
     });
     const addManaged = useAddManagedAccount(projectId, connector.slug, accountId, onAdded);
     // Direct providers: create the account, narrow it before it holds a

package/dist/internal/hooks/index.d.ts

@@ -2,6 +2,6 @@
 /**
  * Utility Hooks
  */
-export { useMediaQuery } from './use-media-query.js';
+export { useMediaQuery } from '../../hooks/use-media-query.js';
 export { useIsMobile } from '../../hooks/use-mobile.js';
 export { useSlashFocus } from './use-slash-focus.js';

package/dist/internal/hooks/index.js

@@ -1,6 +1,6 @@
 /**
  * Utility Hooks
  */
-export { useMediaQuery } from './use-media-query.js';
+export { useMediaQuery } from '../../hooks/use-media-query.js';
 export { useIsMobile } from '../../hooks/use-mobile.js';
 export { useSlashFocus } from './use-slash-focus.js';

package/dist/internal/hooks/projects/use-new-project-session.d.ts

@@ -40,6 +40,9 @@ import { type PendingSessionPrompt, type SessionConnectorBindingsInput } from '@
  */
 /**
  * Options for a new-session start.
+ * `create.space_id` files the session in a channel or DM (`project_channels`).
+ * It never claims a warm session, shows no toast, and does not navigate: the
+ * space view stays and `onNavigate(sessionId)` opens the thread beside it.
  * `agent_name` chooses the session's boot agent. Later prompts can name another
  * agent; the API re-scopes its grants before forwarding the prompt.
  * `connector_bindings` binds specific connections; `inherit_unbound`
@@ -52,11 +55,17 @@ import { type PendingSessionPrompt, type SessionConnectorBindingsInput } from '@
  */
 export type NewProjectSessionOpts = {
     onNavigate?: (sessionId: string) => void;
+    /**
+     * Runs with the client-minted id right before the create POST (never on the
+     * warm path). A space draws its optimistic thread row here; `onError` takes it back.
+     */
+    onCreating?: (sessionId: string) => void;
     onError?: () => void;
     scope?: SessionScopeCommit;
     create?: {
         sandbox_slug?: string;
         agent_name?: string;
+        space_id?: string;
         pending_prompt?: PendingSessionPrompt;
         connector_bindings?: SessionConnectorBindingsInput;
         inherit_unbound?: boolean;

package/dist/internal/hooks/projects/use-new-project-session.js

@@ -25,11 +25,14 @@ function makeTakeOrCreateSession(projectId, opts, router, queryClient, onAdopt)
     // null whenever there is nothing suitable, so the create path below stays
     // the authority on billing and connector requirements.
     async function takeOrCreateSession() {
-        const warm = takeWarmSessionEntry(projectId, {
-            create: opts?.create,
-            // Replenish after /start, not beside the claim and /start requests.
-            replenish: false,
-        });
+        // A space thread always creates: a warm session belongs to no space.
+        const warm = opts.create?.space_id
+            ? null
+            : takeWarmSessionEntry(projectId, {
+                create: opts?.create,
+                // Replenish after /start, not beside the claim and /start requests.
+                replenish: false,
+            });
         if (warm) {
             // The first prompt is a DURABLE inbox row, never a client-side
             // replay (the start stash carries picks only — see the producers).
@@ -61,7 +64,9 @@ function makeTakeOrCreateSession(projectId, opts, router, queryClient, onAdopt)
         }
         const sessionId = randomUUID();
         markSessionFresh(sessionId);
-        router.prefetch(uiRoutes().session(projectId, sessionId));
+        opts.onCreating?.(sessionId);
+        if (!opts.create?.space_id)
+            router.prefetch(uiRoutes().session(projectId, sessionId));
         let created;
         try {
             created = await createProjectSession(projectId, {
@@ -92,6 +97,7 @@ function makeTakeOrCreateSession(projectId, opts, router, queryClient, onAdopt)
 }
 export function useNewProjectSession(projectId) {
     const t = useTranslations('threads');
+    const tSpaces = useTranslations('spaces.view');
     const router = useUiRouter();
     const pathname = useUiPathname();
     const queryClient = useQueryClient();
@@ -186,7 +192,8 @@ export function useNewProjectSession(projectId) {
         const takeOrCreateSession = makeTakeOrCreateSession(projectId, opts, router, queryClient, (session) => {
             adoptedWarmSession = session;
         });
-        const createSession = () => 
+        // A space thread shows up in the timeline at once, so it gets no toast.
+        const inSpace = Boolean(opts.create?.space_id);
         // `threads.*`, not `hardcodedUi.i18nComplete.*`. The two
         // i18nComplete slots these used to read hold the literal strings
         // "startingSession" and "sessionStarted" in en, fr, de, pt, sr and
@@ -194,9 +201,11 @@ export function useNewProjectSession(projectId) {
         // rendered its own key name. `threads.startingSession` /
         // `threads.sessionStarted` are the canonical entries and are
         // correctly translated in all nine catalogs.
-        loadingToast(t('startingSession'), takeOrCreateSession(), {
-            success: t('sessionStarted'),
-        });
+        const createSession = () => inSpace
+            ? takeOrCreateSession()
+            : loadingToast(t('startingSession'), takeOrCreateSession(), {
+                success: t('sessionStarted'),
+            });
         createScopedSession({
             create: createSession,
             draft: opts?.scope?.draft,
@@ -243,6 +252,11 @@ export function useNewProjectSession(projectId) {
                     invalidate: () => queryClient.invalidateQueries({ queryKey: qk.project.sessionsScope(projectId) }),
                 });
                 opts?.onNavigate?.(sessionId);
+                // The space view stays on screen, so no navigation lands to release the claim.
+                if (inSpace) {
+                    release();
+                    return;
+                }
                 // nav-contract: prefetch-only — the session id is minted or returned
                 // by the create POST, so no anchor can name it. `takeOrCreateSession`
                 // prefetches the route the moment the id exists.
@@ -251,6 +265,7 @@ export function useNewProjectSession(projectId) {
         }).catch((err) => {
             const code = err?.code;
             const action = resolveCreateFailure(code, err instanceof ApiError);
+            const failed = inSpace ? tSpaces('sendFailed') : t('failedToStartSession');
             if (action === 'upgrade') {
                 openUpgradeDialog({ reason: 'subscription_required', accountId });
             }
@@ -264,11 +279,11 @@ export function useNewProjectSession(projectId) {
                     });
                 }
                 else {
-                    errorToast(err instanceof Error ? err.message : t('failedToStartSession'));
+                    errorToast(err instanceof Error ? err.message : failed);
                 }
             }
             else if (action === 'toast') {
-                errorToast(err instanceof Error ? err.message : t('failedToStartSession'));
+                errorToast(err instanceof Error ? err.message : failed);
             }
             // No navigation happened, so release the claim now — the user stays
             // where they are and must be able to try again immediately.
@@ -286,6 +301,7 @@ export function useNewProjectSession(projectId) {
         openUpgradeDialog,
         accountId,
         t,
+        tSpaces,
         queryClient,
         openConnectorGate,
     ]);

package/dist/internal/hooks/use-auto-scroll.d.ts

@@ -6,6 +6,13 @@ interface UseAutoScrollOptions {
      *  until then (the area is conditionally rendered), so the observers and
      *  listeners attach on this edge. */
     hasContent?: boolean;
+    /**
+     * FACT 1's room under the newest turn. False keeps only the bottom gap: the
+     * end is the end of the content, as in a chat thread (a channel's thread
+     * panel). A transcript shorter than the viewport then rests at the top,
+     * never below an empty screen. Default true.
+     */
+    room?: boolean;
 }
 interface UseAutoScrollReturn {
     scrollRef: React.RefObject<HTMLDivElement | null>;
@@ -27,4 +34,4 @@ interface UseAutoScrollReturn {
      *  turns follow off until the reader comes to the end themselves. */
     startAtTop: () => void;
 }
-export declare function useAutoScroll({ hasContent, }?: UseAutoScrollOptions): UseAutoScrollReturn;
+export declare function useAutoScroll({ hasContent, room, }?: UseAutoScrollOptions): UseAutoScrollReturn;

package/dist/internal/hooks/use-auto-scroll.js

@@ -1,6 +1,6 @@
 'use client';
 import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react';
-import { OWN_SCROLL_MS, chevronVisible, isAtEnd, keyScrollIntentFor, pickAnchorIndex, prefersReducedMotion, roomUnderNewestTurn, settleMotion, shouldReleaseFollow, } from './use-auto-scroll-physics.js';
+import { BOTTOM_GAP_PX, OWN_SCROLL_MS, chevronVisible, isAtEnd, keyScrollIntentFor, pickAnchorIndex, prefersReducedMotion, roomUnderNewestTurn, settleMotion, shouldReleaseFollow, } from './use-auto-scroll-physics.js';
 export { AT_END_PX, BOTTOM_GAP_PX, CHEVRON_PX, GLIDE_MIN_PX, OWN_SCROLL_MS, TURN_TOP_OFFSET, chevronVisible, classifyScrollKey, isAtEnd, isEditableTarget, isSpaceActivatedTarget, keyScrollIntentFor, pickAnchorIndex, roomUnderNewestTurn, settleMotion, shouldReleaseFollow, } from './use-auto-scroll-physics.js';
 /**
  * useAutoScroll — the session transcript's scroll physics, from first
@@ -75,7 +75,7 @@ const SEND_GLIDE_ARM_MS = 1000;
 function distanceFromEnd(el) {
     return el.scrollHeight - el.scrollTop - el.clientHeight;
 }
-export function useAutoScroll({ hasContent = false, } = {}) {
+export function useAutoScroll({ hasContent = false, room = true, } = {}) {
     const scrollRef = useRef(null);
     const contentRef = useRef(null);
     const spacerElRef = useRef(null);
@@ -149,7 +149,7 @@ export function useAutoScroll({ hasContent = false, } = {}) {
         const span = anchor
             ? spacer.getBoundingClientRect().top - anchor.getBoundingClientRect().top
             : null;
-        const h = roomUnderNewestTurn(el.clientHeight, span);
+        const h = room ? roomUnderNewestTurn(el.clientHeight, span) : BOTTOM_GAP_PX;
         if (spacer.style.height !== `${h}px`)
             spacer.style.height = `${h}px`;
         const anchorChanged = previous !== null && anchor !== previous.el;
@@ -161,7 +161,7 @@ export function useAutoScroll({ hasContent = false, } = {}) {
             }
             : null;
         return { room: h, anchorChanged };
-    }, []);
+    }, [room]);
     const settleRef = useRef(null);
     const cancelGlide = useCallback(() => {
         const glide = glideRef.current;

package/dist/internal/icons/telegram.d.ts

@@ -1,4 +1,9 @@
 /** @internal Kortix apps only. No semver: it may change in any release. */
+/**
+ * The official Telegram logo (telegram.org brand mark): a blue gradient
+ * circle with a white paper plane. Static gradient id: the mark is identical
+ * wherever it sits, so a shared id resolves to the same fill.
+ */
 export declare const Telegram: ({ className }: {
     className?: string;
 }) => import("react").JSX.Element;

package/dist/internal/icons/telegram.js

@@ -1,6 +1,11 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from '../lib/utils.js';
+/**
+ * The official Telegram logo (telegram.org brand mark): a blue gradient
+ * circle with a white paper plane. Static gradient id: the mark is identical
+ * wherever it sits, so a shared id resolves to the same fill.
+ */
 export const Telegram = ({ className }) => {
-    return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 240 240", className: cn('size-4', className), children: [_jsx("defs", { children: _jsxs("linearGradient", { id: "tg-a", x1: "0.667", x2: "0.417", y1: "0.167", y2: "0.75", children: [_jsx("stop", { offset: "0", stopColor: "#37aee2" }), _jsx("stop", { offset: "1", stopColor: "#1e96c8" })] }) }), _jsx("circle", { cx: "120", cy: "120", r: "120", fill: "url(#tg-a)" }), _jsx("path", { fill: "#c8daea", d: "M98 175c-3.888 0-3.227-1.468-4.568-5.17L82 132.207 170 80" }), _jsx("path", { fill: "#a9c9dd", d: "M98 175c3 0 4.325-1.372 6-3l16-15.558-19.958-12.035" }), _jsx("path", { fill: "#fff", d: "M100.04 144.41l48.36 35.729c5.519 3.045 9.501 1.468 10.876-5.123l19.685-92.763c2.015-8.08-3.08-11.746-8.36-9.349l-115.59 44.571c-7.89 3.165-7.844 7.567-1.438 9.528l29.663 9.259 68.673-43.325c3.242-1.966 6.218-.91 3.776 1.258" })] }));
+    return (_jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 240 240", className: cn('size-4', className), children: [_jsx("defs", { children: _jsxs("linearGradient", { id: "kortix-telegram-logo", x1: "0.5", y1: "0", x2: "0.5", y2: "1", children: [_jsx("stop", { offset: "0", stopColor: "#2AABEE" }), _jsx("stop", { offset: "1", stopColor: "#229ED9" })] }) }), _jsx("circle", { cx: "120", cy: "120", r: "120", fill: "url(#kortix-telegram-logo)" }), _jsx("path", { fill: "#FFFFFF", d: "M54.3 118.8c35-15.2 58.3-25.3 70-30.2 33.3-13.9 40.3-16.3 44.8-16.4 1 0 3.2.2 4.7 1.4 1.2 1 1.5 2.3 1.7 3.3s.4 3.1.2 4.7c-1.8 19-9.6 65.1-13.6 86.3-1.7 9-5 12-8.2 12.3-7 .6-12.3-4.6-19-9-10.6-6.9-16.5-11.2-26.8-18-11.9-7.8-4.2-12.1 2.6-19.1 1.8-1.8 32.5-29.8 33.1-32.3.1-.3.1-1.5-.6-2.1-.7-.6-1.7-.4-2.5-.2-1.1.2-17.9 11.4-50.6 33.5-4.8 3.3-9.1 4.9-13 4.8-4.3-.1-12.5-2.4-18.7-4.4-7.5-2.4-13.5-3.7-13-7.9.3-2.2 3.3-4.4 8.9-6.7z" })] }));
 };

package/dist/internal/layout/nav-hover-card.d.ts

@@ -0,0 +1,35 @@
+/** @internal Kortix apps only. No semver: it may change in any release. */
+import { PopoverContent } from '../../primitives/popover.js';
+import { type ComponentProps, type PointerEvent, type RefObject } from 'react';
+/**
+ * The hover card of a sidebar nav row (Apps, Customize): a mouse that rests on
+ * the row opens a list of where the row leads, so one click lands on the
+ * thing instead of two. The row stays a plain link: the card is a Popover
+ * anchored to it (`anchorRef` as `PopoverAnchor virtualRef`), not a menu
+ * trigger, which would take Enter and Space for itself.
+ *
+ * It opens only where hover exists (the session list's gate) and only on the
+ * expanded sidebar: the collapsed rail shows the row's tooltip there.
+ * `holdRef` names an input that keeps the card open while it has focus.
+ */
+export declare function useNavHoverCard({ enabled, holdRef, }: {
+    enabled: boolean;
+    holdRef?: RefObject<HTMLElement | null>;
+}): {
+    open: boolean;
+    setOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    anchorRef: RefObject<HTMLElement>;
+    rowProps: {
+        onPointerEnter: (event: PointerEvent<HTMLElement>) => void;
+        onPointerLeave: (event: PointerEvent<HTMLElement>) => void;
+        onClick: () => void;
+    };
+    contentProps: {
+        onPointerEnter: (event: PointerEvent<HTMLElement>) => void;
+        onPointerLeave: (event: PointerEvent<HTMLElement>) => void;
+    };
+};
+/** The card's panel: to the right of the row, top edges aligned, never taking focus. */
+export declare function NavHoverCardContent({ className, ...props }: ComponentProps<typeof PopoverContent>): import("react").JSX.Element;
+/** The card's list: the floating-list padding. A list that can grow long sets its own cap. */
+export declare function NavHoverCardList({ className, ...props }: ComponentProps<'ul'>): import("react").JSX.Element;

package/dist/internal/layout/nav-hover-card.js

@@ -0,0 +1,84 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMediaQuery } from '../hooks/index.js';
+import { PopoverContent } from '../../primitives/popover.js';
+import { useSidebar } from '../../primitives/sidebar.js';
+import { cn } from '../../lib/utils.js';
+import { useEffect, useRef, useState, } from 'react';
+/** Time the pointer rests on the row before the card opens, so passing over it does nothing. */
+const HOVER_OPEN_DELAY_MS = 400;
+/** Time to cross the gap between the row and its card before it closes. Same as the More row. */
+const HOVER_CLOSE_DELAY_MS = 150;
+/**
+ * The hover card of a sidebar nav row (Apps, Customize): a mouse that rests on
+ * the row opens a list of where the row leads, so one click lands on the
+ * thing instead of two. The row stays a plain link: the card is a Popover
+ * anchored to it (`anchorRef` as `PopoverAnchor virtualRef`), not a menu
+ * trigger, which would take Enter and Space for itself.
+ *
+ * It opens only where hover exists (the session list's gate) and only on the
+ * expanded sidebar: the collapsed rail shows the row's tooltip there.
+ * `holdRef` names an input that keeps the card open while it has focus.
+ */
+export function useNavHoverCard({ enabled, holdRef, }) {
+    const canHover = useMediaQuery('(min-width: 768px) and (hover: hover) and (pointer: fine)');
+    const { state } = useSidebar();
+    const [open, setOpen] = useState(false);
+    const anchorRef = useRef(null);
+    const openTimer = useRef(undefined);
+    const closeTimer = useRef(undefined);
+    const active = enabled && canHover && state === 'expanded';
+    const cancelTimers = () => {
+        clearTimeout(openTimer.current);
+        clearTimeout(closeTimer.current);
+    };
+    useEffect(() => cancelTimers, []);
+    // An open card stays open while the pointer crosses between row and card;
+    // a closed one opens only after the pointer rests on the row.
+    const hoverOpen = (event) => {
+        if (event.pointerType !== 'mouse' || !active)
+            return;
+        cancelTimers();
+        if (open)
+            return;
+        openTimer.current = setTimeout(() => setOpen(true), HOVER_OPEN_DELAY_MS);
+    };
+    const hoverClose = (event) => {
+        if (event.pointerType !== 'mouse')
+            return;
+        cancelTimers();
+        closeTimer.current = setTimeout(() => {
+            // Typing in the card keeps it; a click outside or Escape closes it.
+            if (holdRef?.current && document.activeElement === holdRef.current)
+                return;
+            setOpen(false);
+        }, HOVER_CLOSE_DELAY_MS);
+    };
+    return {
+        open: open && active,
+        setOpen,
+        anchorRef: anchorRef,
+        rowProps: {
+            onPointerEnter: (event) => {
+                anchorRef.current = event.currentTarget;
+                hoverOpen(event);
+            },
+            onPointerLeave: hoverClose,
+            onClick: () => {
+                cancelTimers();
+                setOpen(false);
+            },
+        },
+        contentProps: { onPointerEnter: hoverOpen, onPointerLeave: hoverClose },
+    };
+}
+/** The card's panel: to the right of the row, top edges aligned, never taking focus. */
+export function NavHoverCardContent({ className, ...props }) {
+    return (_jsx(PopoverContent, { side: "right", align: "start", sideOffset: 8, className: cn('w-60 overflow-hidden p-0', className), 
+        // Hover must not move focus: the row keeps it, and so does the page.
+        onOpenAutoFocus: (event) => event.preventDefault(), onCloseAutoFocus: (event) => event.preventDefault(), ...props }));
+}
+/** The card's list: the floating-list padding. A list that can grow long sets its own cap. */
+export function NavHoverCardList({ className, ...props }) {
+    return _jsx("ul", { className: cn('p-1', className), ...props });
+}

package/dist/internal/layout/project-nav-row.d.ts

@@ -2,8 +2,10 @@
 import { HoverPrefetchLink } from '../components/hover-prefetch-link.js';
 import type { ComponentProps, ReactNode } from 'react';
 /** Keep the anchor's intent handlers and the caller's active-route semantics. */
-export declare function ProjectNavRow({ active, label, children, ...link }: ComponentProps<typeof HoverPrefetchLink> & {
+export declare function ProjectNavRow({ active, label, className, children, ...link }: ComponentProps<typeof HoverPrefetchLink> & {
     active: boolean;
     label: string;
+    /** Added to the row button's classes. */
+    className?: string;
     children: ReactNode;
 }): import("react").JSX.Element;