@kortix/ui 0.14.4 → 0.14.6

package/dist/session/composer/menus/slash-items.js

@@ -96,7 +96,7 @@ export function buildSlashSections({ commands, actions = SLASH_ACTIONS, files =
     const filteredActions = filterSlashActions(actions, query);
     const filteredFiles = filterSlashFiles(files, query);
     const fileCap = q ? FILE_LIMIT : FILE_PREVIEW_LIMIT;
-    // Render order: Actions, Outputs, Context, Skills, Commands, MCP.
+    // Render order: Actions, the host's groups, Outputs, Context, Skills, Commands, MCP.
     //
     // Actions moved from last to first. They are the fixed, always-present rows
     // (switch model, attach a file, …) — the same six every time, in the same
@@ -112,11 +112,12 @@ export function buildSlashSections({ commands, actions = SLASH_ACTIONS, files =
     // in would desync the highlight from the keyboard.
     let index = 0;
     const sections = [];
-    if (filteredActions.length) {
+    const builtIn = filteredActions.filter((a) => !a.group);
+    if (builtIn.length) {
         sections.push({
             heading: actionsHeading,
             hideHeading: true,
-            rows: filteredActions.map((action) => ({
+            rows: builtIn.map((action) => ({
                 index: index++,
                 type: 'action',
                 name: action.label,
@@ -127,6 +128,21 @@ export function buildSlashSections({ commands, actions = SLASH_ACTIONS, files =
             })),
         });
     }
+    // The host's rows (`UiHostConfig.useSlashActions`), under their own headings, in the order given.
+    const hostGroups = [...new Set(filteredActions.filter((a) => a.group).map((a) => a.group))];
+    for (const heading of hostGroups) {
+        sections.push({
+            heading,
+            rows: filteredActions.filter((a) => a.group === heading).map((action) => ({
+                index: index++,
+                type: 'action',
+                name: action.label,
+                description: action.description,
+                hint: action.hint,
+                action,
+            })),
+        });
+    }
     // Outputs, then Context, then the command buckets.
     //
     // Above the commands because this is the one part of the palette that is

package/dist/session/composer/pasted-text.js

@@ -19,12 +19,13 @@ export function PastedTextCopy({ text }) {
     // The toolbar `ButtonGroup`'s look: `size-7` on the `secondary` fill, as `CloseButton`.
     return (_jsx(CopyButton, { code: text, size: "md", className: "bg-secondary hover:bg-secondary/90 shrink-0", label: t.raw('texte21f935f11d7') }));
 }
+const graphemeSegmenter = typeof Intl !== 'undefined' && 'Segmenter' in Intl ? new Intl.Segmenter() : null;
 /** Word and character counts for the header. Characters are what the user sees: graphemes, else code points. */
 export function pastedTextCounts(text) {
     const words = text.trim() ? text.trim().split(/\s+/).length : 0;
     let chars = 0;
-    if (typeof Intl !== 'undefined' && 'Segmenter' in Intl) {
-        for (const _segment of new Intl.Segmenter().segment(text))
+    if (graphemeSegmenter) {
+        for (const _segment of graphemeSegmenter.segment(text))
             chars++;
     }
     else

package/dist/session/composer/stores/queued-draft-store.js

@@ -18,9 +18,10 @@ export const useQueuedDraftStore = create((set) => ({
     }),
     remove: (sessionId, clientMessageIds) => set((s) => {
         const drafts = s.bySession[sessionId];
-        if (!drafts?.some((d) => clientMessageIds.includes(d.clientMessageId)))
+        const ids = new Set(clientMessageIds);
+        if (!drafts?.some((d) => ids.has(d.clientMessageId)))
             return s;
-        return withSession(s, sessionId, drafts.filter((d) => !clientMessageIds.includes(d.clientMessageId)));
+        return withSession(s, sessionId, drafts.filter((d) => !ids.has(d.clientMessageId)));
     }),
     prune: (sessionId, listedClientMessageIds) => set((s) => {
         const drafts = s.bySession[sessionId];

package/dist/session/header/reminder-parts.d.ts

@@ -0,0 +1,294 @@
+import type { SessionReminder } from '@kortix/sdk';
+import { type ReactNode } from 'react';
+export declare const isFailedReminder: (reminder: SessionReminder) => boolean;
+/** Soonest next fire first; paused ones, which have no next fire, last. */
+export declare function sortReminders(reminders: SessionReminder[]): SessionReminder[];
+/** A ring filled clockwise from the top by `share`; an empty track around a pause glyph while paused. */
+export declare function CountdownRing({ share, size, stroke, tone, paused, children, }: {
+    share: number | null;
+    size: number;
+    stroke: number;
+    tone: 'purple' | 'red';
+    paused: boolean;
+    children?: ReactNode;
+}): import("react").JSX.Element;
+/** "6h" over "12m": the time left in its two largest units, narrow and localized. */
+export declare function countdownParts(ms: number, locale: string): [string, string | null];
+/** What a row and its details show for one reminder at `now`. */
+export declare function useReminderView(now: number): (reminder: SessionReminder) => {
+    paused: boolean;
+    isFailed: boolean;
+    next: string | null;
+    nextAt: number;
+    countdown: [string, string | null];
+    share: number | null;
+    tone: "purple" | "red";
+    pauseLabel: string;
+    schedule: string;
+    meta: string;
+};
+/** Repeats, time zone, last run, and the last error when the run failed. */
+export declare function ReminderFacts({ reminder, now, className, }: {
+    reminder: SessionReminder;
+    now: number;
+    className?: string;
+}): import("react").JSX.Element;
+/** Retry a failed run, pause or resume, remove, and the link into the Reminders tab. */
+export declare function ReminderActions({ reminder, controls, manageHref, onNavigate, className, }: {
+    reminder: SessionReminder;
+    controls: ReminderControls;
+    manageHref: string | null;
+    onNavigate?: () => void;
+    className?: string;
+}): import("react").JSX.Element;
+export interface ReminderControls {
+    pending: boolean;
+    running: boolean;
+    /** Fire the reminder once now. */
+    run: (reminder: SessionReminder) => void;
+    setEnabled: (reminder: SessionReminder, enabled: boolean) => void;
+    requestRemove: (reminder: SessionReminder) => void;
+}
+/**
+ * The session's reminders with run, pause, resume and remove. Remove asks first:
+ * render `confirm` once next to whatever calls `requestRemove`.
+ */
+export declare function useReminderControls(projectId: string | null, sessionId: string | null | undefined): {
+    reminders: {
+        update: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, {
+            reminderId: string;
+            enabled: boolean;
+        }, unknown>;
+        remove: import("@tanstack/react-query").UseMutationResult<{
+            ok: boolean;
+        }, Error, string, unknown>;
+        run: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, string, unknown>;
+        data: {
+            reminders: SessionReminder[];
+        };
+        error: Error;
+        isError: true;
+        isPending: false;
+        isLoading: false;
+        isLoadingError: false;
+        isRefetchError: true;
+        isSuccess: false;
+        isPlaceholderData: false;
+        status: "error";
+        dataUpdatedAt: number;
+        errorUpdatedAt: number;
+        failureCount: number;
+        failureReason: Error | null;
+        errorUpdateCount: number;
+        isFetched: boolean;
+        isFetchedAfterMount: boolean;
+        isFetching: boolean;
+        isInitialLoading: boolean;
+        isPaused: boolean;
+        isRefetching: boolean;
+        isStale: boolean;
+        isEnabled: boolean;
+        refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<{
+            reminders: SessionReminder[];
+        }, Error>>;
+        fetchStatus: import("@tanstack/react-query").FetchStatus;
+    } | {
+        update: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, {
+            reminderId: string;
+            enabled: boolean;
+        }, unknown>;
+        remove: import("@tanstack/react-query").UseMutationResult<{
+            ok: boolean;
+        }, Error, string, unknown>;
+        run: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, string, unknown>;
+        data: {
+            reminders: SessionReminder[];
+        };
+        error: null;
+        isError: false;
+        isPending: false;
+        isLoading: false;
+        isLoadingError: false;
+        isRefetchError: false;
+        isSuccess: true;
+        isPlaceholderData: false;
+        status: "success";
+        dataUpdatedAt: number;
+        errorUpdatedAt: number;
+        failureCount: number;
+        failureReason: Error | null;
+        errorUpdateCount: number;
+        isFetched: boolean;
+        isFetchedAfterMount: boolean;
+        isFetching: boolean;
+        isInitialLoading: boolean;
+        isPaused: boolean;
+        isRefetching: boolean;
+        isStale: boolean;
+        isEnabled: boolean;
+        refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<{
+            reminders: SessionReminder[];
+        }, Error>>;
+        fetchStatus: import("@tanstack/react-query").FetchStatus;
+    } | {
+        update: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, {
+            reminderId: string;
+            enabled: boolean;
+        }, unknown>;
+        remove: import("@tanstack/react-query").UseMutationResult<{
+            ok: boolean;
+        }, Error, string, unknown>;
+        run: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, string, unknown>;
+        data: undefined;
+        error: Error;
+        isError: true;
+        isPending: false;
+        isLoading: false;
+        isLoadingError: true;
+        isRefetchError: false;
+        isSuccess: false;
+        isPlaceholderData: false;
+        status: "error";
+        dataUpdatedAt: number;
+        errorUpdatedAt: number;
+        failureCount: number;
+        failureReason: Error | null;
+        errorUpdateCount: number;
+        isFetched: boolean;
+        isFetchedAfterMount: boolean;
+        isFetching: boolean;
+        isInitialLoading: boolean;
+        isPaused: boolean;
+        isRefetching: boolean;
+        isStale: boolean;
+        isEnabled: boolean;
+        refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<{
+            reminders: SessionReminder[];
+        }, Error>>;
+        fetchStatus: import("@tanstack/react-query").FetchStatus;
+    } | {
+        update: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, {
+            reminderId: string;
+            enabled: boolean;
+        }, unknown>;
+        remove: import("@tanstack/react-query").UseMutationResult<{
+            ok: boolean;
+        }, Error, string, unknown>;
+        run: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, string, unknown>;
+        data: undefined;
+        error: null;
+        isError: false;
+        isPending: true;
+        isLoading: true;
+        isLoadingError: false;
+        isRefetchError: false;
+        isSuccess: false;
+        isPlaceholderData: false;
+        status: "pending";
+        dataUpdatedAt: number;
+        errorUpdatedAt: number;
+        failureCount: number;
+        failureReason: Error | null;
+        errorUpdateCount: number;
+        isFetched: boolean;
+        isFetchedAfterMount: boolean;
+        isFetching: boolean;
+        isInitialLoading: boolean;
+        isPaused: boolean;
+        isRefetching: boolean;
+        isStale: boolean;
+        isEnabled: boolean;
+        refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<{
+            reminders: SessionReminder[];
+        }, Error>>;
+        fetchStatus: import("@tanstack/react-query").FetchStatus;
+    } | {
+        update: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, {
+            reminderId: string;
+            enabled: boolean;
+        }, unknown>;
+        remove: import("@tanstack/react-query").UseMutationResult<{
+            ok: boolean;
+        }, Error, string, unknown>;
+        run: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, string, unknown>;
+        data: undefined;
+        error: null;
+        isError: false;
+        isPending: true;
+        isLoadingError: false;
+        isRefetchError: false;
+        isSuccess: false;
+        isPlaceholderData: false;
+        status: "pending";
+        dataUpdatedAt: number;
+        errorUpdatedAt: number;
+        failureCount: number;
+        failureReason: Error | null;
+        errorUpdateCount: number;
+        isFetched: boolean;
+        isFetchedAfterMount: boolean;
+        isFetching: boolean;
+        isLoading: boolean;
+        isInitialLoading: boolean;
+        isPaused: boolean;
+        isRefetching: boolean;
+        isStale: boolean;
+        isEnabled: boolean;
+        refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<{
+            reminders: SessionReminder[];
+        }, Error>>;
+        fetchStatus: import("@tanstack/react-query").FetchStatus;
+    } | {
+        update: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, {
+            reminderId: string;
+            enabled: boolean;
+        }, unknown>;
+        remove: import("@tanstack/react-query").UseMutationResult<{
+            ok: boolean;
+        }, Error, string, unknown>;
+        run: import("@tanstack/react-query").UseMutationResult<SessionReminder, Error, string, unknown>;
+        data: {
+            reminders: SessionReminder[];
+        };
+        isError: false;
+        error: null;
+        isPending: false;
+        isLoading: false;
+        isLoadingError: false;
+        isRefetchError: false;
+        isSuccess: true;
+        isPlaceholderData: true;
+        status: "success";
+        dataUpdatedAt: number;
+        errorUpdatedAt: number;
+        failureCount: number;
+        failureReason: Error | null;
+        errorUpdateCount: number;
+        isFetched: boolean;
+        isFetchedAfterMount: boolean;
+        isFetching: boolean;
+        isInitialLoading: boolean;
+        isPaused: boolean;
+        isRefetching: boolean;
+        isStale: boolean;
+        isEnabled: boolean;
+        refetch: (options?: import("@tanstack/react-query").RefetchOptions) => Promise<import("@tanstack/react-query").QueryObserverResult<{
+            reminders: SessionReminder[];
+        }, Error>>;
+        fetchStatus: import("@tanstack/react-query").FetchStatus;
+    };
+    controls: ReminderControls;
+    confirm: import("react").JSX.Element;
+};
+/**
+ * A reminder row's cells, for a `REMINDER_ROW_GRID` container: the ring and
+ * the title share the first grid row, so the ring centres on the title line;
+ * the next run sits at the end of that line, the schedule under the title.
+ */
+export declare const REMINDER_ROW_GRID = "grid grid-cols-[auto_minmax(0,1fr)_auto] items-center gap-x-2.5";
+export declare function ReminderRowCells({ reminder, view, trailing, }: {
+    reminder: SessionReminder;
+    view: ReturnType<ReturnType<typeof useReminderView>>;
+    /** Replaces the next-run time in the end column, e.g. a disclosure caret. */
+    trailing?: ReactNode;
+}): import("react").JSX.Element;

package/dist/session/header/reminder-parts.js

@@ -0,0 +1,120 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * The pieces a session reminder is drawn with, shared by the header popover's
+ * hover card and the panel's Reminders view (`session-reminders-panel.tsx`):
+ * the countdown ring, the facts block, the action row, and the pause/remove
+ * mutations with their confirm dialog.
+ */
+import { HoverPrefetchLink } from '../../internal/components/hover-prefetch-link.js';
+import { Button } from '../../primitives/button.js';
+import { ConfirmDialog } from '../../primitives/confirm-dialog.js';
+import Hint from '../../primitives/hint.js';
+import { errorToast, successToast } from '../../primitives/toast.js';
+import { elapsedShare, formatFireTime, reminderTitle, scheduleLabel } from '../../internal/reminders/reminder-format.js';
+import { cn } from '../../internal/lib/utils.js';
+import { useLocale, useTranslations } from '../../i18n/index.js';
+import { useSessionReminders } from '@kortix/sdk/react';
+import { ArrowClockwiseIcon, ArrowUpRightIcon, PauseIcon, PlayIcon } from '@phosphor-icons/react';
+import { useState } from 'react';
+export const isFailedReminder = (reminder) => reminder.last_status === 'failed';
+/** Soonest next fire first; paused ones, which have no next fire, last. */
+export function sortReminders(reminders) {
+    const key = (reminder) => reminder.state === 'active' && reminder.next_fire_at ? Date.parse(reminder.next_fire_at) : Infinity;
+    return [...reminders].sort((a, b) => key(a) - key(b));
+}
+/** A ring filled clockwise from the top by `share`; an empty track around a pause glyph while paused. */
+export function CountdownRing({ share, size, stroke, tone, paused, children, }) {
+    const r = (size - stroke) / 2;
+    const length = 2 * Math.PI * r;
+    return (_jsxs("span", { className: "relative flex shrink-0 items-center justify-center", style: { width: size, height: size }, children: [_jsxs("svg", { "aria-hidden": true, width: size, height: size, className: "absolute inset-0 -rotate-90", children: [_jsx("circle", { cx: size / 2, cy: size / 2, r: r, fill: "none", stroke: "currentColor", strokeWidth: stroke, className: "text-border" }), !paused && share !== null ? (_jsx("circle", { cx: size / 2, cy: size / 2, r: r, fill: "none", stroke: "currentColor", strokeWidth: stroke, strokeLinecap: "round", strokeDasharray: `${length * share} ${length}`, className: tone === 'red' ? 'text-kortix-red' : 'text-kortix-purple' })) : null] }), paused ? (_jsx(PauseIcon, { "aria-hidden": true, weight: "fill", className: "text-muted-foreground", style: { width: Math.round(size * 0.4), height: Math.round(size * 0.4) } })) : (children)] }));
+}
+/** "6h" over "12m": the time left in its two largest units, narrow and localized. */
+export function countdownParts(ms, locale) {
+    const min = Math.max(0, Math.round(ms / 60_000));
+    const unit = (value, name) => new Intl.NumberFormat(locale, { style: 'unit', unit: name, unitDisplay: 'narrow' }).format(value);
+    if (min >= 24 * 60)
+        return [unit(Math.floor(min / (24 * 60)), 'day'), unit(Math.floor((min % (24 * 60)) / 60), 'hour')];
+    if (min >= 60)
+        return [unit(Math.floor(min / 60), 'hour'), unit(min % 60, 'minute')];
+    return [unit(min, 'minute'), null];
+}
+/** What a row and its details show for one reminder at `now`. */
+export function useReminderView(now) {
+    const t = useTranslations('reminders');
+    const locale = useLocale();
+    return (reminder) => {
+        const paused = reminder.state !== 'active';
+        const nextAt = reminder.next_fire_at ? Date.parse(reminder.next_fire_at) : NaN;
+        const failed = isFailedReminder(reminder);
+        return {
+            paused,
+            isFailed: failed,
+            next: !paused && reminder.next_fire_at ? formatFireTime(reminder.next_fire_at, locale, now) : null,
+            nextAt,
+            countdown: countdownParts(nextAt - now, locale),
+            share: elapsedShare(reminder, now),
+            tone: failed ? 'red' : 'purple',
+            pauseLabel: paused ? t('resume') : t('pause'),
+            schedule: scheduleLabel(reminder, (key, values) => t(key, values)),
+            meta: [failed ? t('lastRunFailed') : paused ? t('pausedLabel') : null, scheduleLabel(reminder, (key, values) => t(key, values))]
+                .filter(Boolean)
+                .join(' · '),
+        };
+    };
+}
+/** Repeats, time zone, last run, and the last error when the run failed. */
+export function ReminderFacts({ reminder, now, className, }) {
+    const t = useTranslations('reminders');
+    const locale = useLocale();
+    const failed = isFailedReminder(reminder);
+    return (_jsxs("dl", { className: cn('space-y-1.5 text-xs', className), children: [_jsxs("div", { className: "flex justify-between gap-3", children: [_jsx("dt", { className: "text-muted-foreground", children: t('repeats') }), _jsx("dd", { className: "text-foreground truncate", children: scheduleLabel(reminder, (key, values) => t(key, values)) })] }), _jsxs("div", { className: "flex justify-between gap-3", children: [_jsx("dt", { className: "text-muted-foreground", children: t('timeZone') }), _jsx("dd", { className: "text-foreground truncate", children: reminder.timezone })] }), _jsxs("div", { className: "flex justify-between gap-3", children: [_jsx("dt", { className: "text-muted-foreground", children: t('lastRun') }), _jsx("dd", { className: "text-foreground flex items-center gap-1.5", children: reminder.last_fired_at ? (_jsxs(_Fragment, { children: [_jsx("span", { "aria-hidden": true, className: cn('size-1.5 rounded-full', failed ? 'bg-kortix-red' : 'bg-kortix-green') }), formatFireTime(reminder.last_fired_at, locale, now)] })) : (t('neverRun')) })] }), failed && reminder.last_error ? (_jsx("p", { className: "text-foreground bg-kortix-red/15 mt-2 rounded-md px-2 py-1.5 font-mono break-words", children: reminder.last_error })) : null] }));
+}
+/** Retry a failed run, pause or resume, remove, and the link into the Reminders tab. */
+export function ReminderActions({ reminder, controls, manageHref, onNavigate, className, }) {
+    const t = useTranslations('reminders');
+    const paused = reminder.state !== 'active';
+    return (_jsxs("div", { className: cn('flex items-center gap-1', className), children: [isFailedReminder(reminder) ? (_jsxs(Button, { variant: "secondary", size: "xs", disabled: controls.running, onClick: () => controls.run(reminder), children: [_jsx(ArrowClockwiseIcon, { className: "size-3.5" }), t('retry')] })) : null, _jsxs(Button, { variant: "secondary", size: "xs", disabled: controls.pending, onClick: () => controls.setEnabled(reminder, paused), children: [paused ? _jsx(PlayIcon, { className: "size-3.5" }) : _jsx(PauseIcon, { className: "size-3.5" }), paused ? t('resume') : t('pause')] }), _jsx(Button, { variant: "ghost", size: "xs", className: "text-destructive", onClick: () => controls.requestRemove(reminder), children: t('remove') }), manageHref ? (
+            // An icon, not a label: three text buttons overflow the 288px card.
+            _jsx(Hint, { label: t('openInReminders'), side: "top", sideOffset: 6, alignOffset: 0, children: _jsx(Button, { asChild: true, variant: "ghost", size: "icon-xs", className: "text-muted-foreground ml-auto", "aria-label": t('openInReminders'), children: _jsx(HoverPrefetchLink, { href: manageHref, onClick: onNavigate, children: _jsx(ArrowUpRightIcon, { className: "size-3.5" }) }) }) })) : null] }));
+}
+/**
+ * The session's reminders with run, pause, resume and remove. Remove asks first:
+ * render `confirm` once next to whatever calls `requestRemove`.
+ */
+export function useReminderControls(projectId, sessionId) {
+    const t = useTranslations('reminders');
+    const reminders = useSessionReminders(projectId, sessionId);
+    const [removing, setRemoving] = useState(null);
+    const controls = {
+        pending: reminders.update.isPending,
+        running: reminders.run.isPending,
+        run: (reminder) => reminders.run.mutate(reminder.id, {
+            onSuccess: () => successToast(t('runQueued')),
+            onError: (error) => errorToast(error instanceof Error ? error.message : t('runFailed')),
+        }),
+        setEnabled: (reminder, enabled) => reminders.update.mutate({ reminderId: reminder.id, enabled }, {
+            onSuccess: () => successToast(enabled ? t('resumed') : t('paused')),
+            onError: (error) => errorToast(error instanceof Error ? error.message : t('updateFailed')),
+        }),
+        requestRemove: setRemoving,
+    };
+    const confirm = (_jsx(ConfirmDialog, { open: !!removing, onOpenChange: (next) => !next && setRemoving(null), title: t('removeTitle'), description: t('removeDescription'), confirmLabel: t('remove'), confirmVariant: "destructive", isPending: reminders.remove.isPending, onConfirm: () => removing &&
+            reminders.remove.mutate(removing.id, {
+                onSuccess: () => {
+                    successToast(t('removed'));
+                    setRemoving(null);
+                },
+                onError: (error) => errorToast(error instanceof Error ? error.message : t('updateFailed')),
+            }) }));
+    return { reminders, controls, confirm };
+}
+/**
+ * A reminder row's cells, for a `REMINDER_ROW_GRID` container: the ring and
+ * the title share the first grid row, so the ring centres on the title line;
+ * the next run sits at the end of that line, the schedule under the title.
+ */
+export const REMINDER_ROW_GRID = 'grid grid-cols-[auto_minmax(0,1fr)_auto] items-center gap-x-2.5';
+export function ReminderRowCells({ reminder, view, trailing, }) {
+    return (_jsxs(_Fragment, { children: [_jsx(CountdownRing, { share: view.share, size: 14, stroke: 2, tone: view.tone, paused: view.paused }), _jsx("span", { className: cn('truncate text-sm leading-5', view.paused ? 'text-muted-foreground' : 'text-foreground font-medium'), children: reminderTitle(reminder) }), trailing ?? (view.next ? (_jsx("span", { className: "text-muted-foreground col-start-3 row-start-1 text-xs tabular-nums pointer-coarse:hidden", children: view.next })) : null), _jsx("span", { className: "text-muted-foreground col-start-2 truncate text-xs leading-4", children: view.meta })] }));
+}

package/dist/session/header/session-reminders-indicator.d.ts

@@ -1,3 +1,16 @@
+/** More live reminders than this open in the side panel, not the popover. */
+export declare const REMINDERS_POPOVER_MAX = 30;
+/**
+ * The clock in `BellMark`'s badge-glow style: the glyph, then again in the
+ * count's colour under the bell's corner mask, so the colour reaches in from
+ * the corner the count sits on. Purple for active reminders, red while one's
+ * last run failed. With nothing active the glyph is muted and has no count.
+ */
+export declare function ReminderMark({ count, failed: anyFailed, surface, }: {
+    count: number;
+    failed: boolean;
+    surface?: 'bg-background' | 'bg-sidebar';
+}): import("react").JSX.Element;
 export declare function SessionRemindersIndicator({ runtimeSessionId }: {
     runtimeSessionId: string;
 }): import("react").JSX.Element | null;