@exegia/corpora-ui 1.0.0 → 3.0.0

package/dist-lib/components/composed/chat/flowchart/hooks.d.ts

@@ -0,0 +1,290 @@
+import { default as React } from 'react';
+import { TEdge, TEdgeEnd, IFlowchartProps, TStepNode } from './types';
+import { THeights, TOffsets, TPoint } from './utils';
+export declare const ZOOM_MIN = 0.25;
+export declare const ZOOM_MAX = 2;
+type TOptions = Pick<IFlowchartProps, "edges" | "readOnly" | "zoomable" | "onDrag" | "onAdd" | "onRemove" | "onEdgeRemove" | "onEdgeConnect" | "onEdgeChange" | "onRename" | "onDuplicate"> & {
+    steps: TStepNode[];
+    canvasRef: React.RefObject<HTMLDivElement | null>;
+};
+/** A connector end being dragged towards a new card; `snap` is the card whose anchor is in range. */
+export type TEdgeDrag = {
+    id: string;
+    end: TEdgeEnd;
+    point: TPoint;
+    snap?: string;
+};
+/** Pill text: explicit name, else the kind label, else "Node n" (conditions always count). */
+export declare const nodeLabel: (node: TStepNode, index: number) => string;
+/** Default connectors: a chain through the steps in order. */
+export declare const chainEdges: (steps: TStepNode[]) => TEdge[];
+export declare const useFlowchart: ({ steps, edges: edgesProp, readOnly, zoomable, onDrag, onAdd, onRemove, onEdgeRemove, onEdgeConnect, onEdgeChange, onRename, onDuplicate, canvasRef }: TOptions) => {
+    steps: TStepNode[];
+    edges: TEdge[];
+    readOnly: boolean;
+    zoomable: boolean;
+    scale: number;
+    view: {
+        scale: number;
+        x: number;
+        y: number;
+    };
+    zoomBy: (factor: number) => void;
+    resetZoom: () => void;
+    onCanvasPointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;
+    onCanvasPointerMove: (event: React.PointerEvent<HTMLDivElement>) => void;
+    onCanvasPointerUp: () => void;
+    isPanning: () => boolean;
+    frame: {
+        w: number;
+        h: number;
+    };
+    worldHeight: number;
+    onAdd: ((id: string, side: import('./types').TFlowchartSide) => void) | undefined;
+    removeNode: (id: string) => void;
+    commitRemove: (id: string) => void;
+    cancelRemove: () => void;
+    pendingRemove: {
+        id: string;
+        orphans: string[];
+    } | null;
+    orphansOf: (id: string) => string[];
+    updateHeights: (callback: (prev: THeights) => THeights) => void;
+    offsets: TOffsets;
+    width: number;
+    selected: string | null;
+    drag: React.RefObject<{
+        id: string;
+        startX: number;
+        startY: number;
+        baseDx: number;
+        baseDy: number;
+        moved: boolean;
+    } | null>;
+    updateSelected: (id: string | null) => void;
+    updateFrame: (w: number, h: number) => void;
+    onPointerDown: (node: TStepNode) => (event: React.PointerEvent<HTMLDivElement>) => void;
+    onPointerMove: (node: TStepNode) => (event: React.PointerEvent<HTMLDivElement>) => void;
+    onPointerUp: (node: TStepNode) => () => void;
+    wasDragged: () => boolean;
+    isLit: (edge: TEdge) => boolean;
+    editableEdges: boolean;
+    selectedEdge: string | null;
+    selectEdge: (id: string | null) => void;
+    edgeDrag: TEdgeDrag | null;
+    edgeEnds: (edge: TEdge) => {
+        from: {
+            x: number;
+            y: number;
+        };
+        to: {
+            x: number;
+            y: number;
+        };
+    } | null;
+    onEdgeHandleDown: (edge: TEdge, end: TEdgeEnd) => (event: React.PointerEvent<SVGElement>) => void;
+    onEdgeHandleMove: (event: React.PointerEvent<SVGElement>) => void;
+    onEdgeHandleUp: (event: React.PointerEvent<SVGElement>) => void;
+    ghostCurve: () => string;
+    removeEdge: (id: string) => void;
+    onEdgeChange: ((id: string, patch: Pick<TEdge, "strokeWidth" | "color">) => void) | undefined;
+    snapTarget: string | null;
+    previewNode: string | null;
+    setPreviewNode: React.Dispatch<React.SetStateAction<string | null>>;
+    connectTo: (source: string, target: string) => void;
+    renameNode: (id: string, name: string) => void;
+    duplicateNode: (id: string) => void | undefined;
+    canRename: boolean;
+    canDuplicate: boolean;
+    canConnect: boolean;
+    rowHeight: number[];
+    canvasHeight: number;
+    connectorWidth: number;
+    bezierCurve: (edge: TEdge) => string;
+    handlePlace: (node: TStepNode) => {
+        w: number;
+        cx: number;
+        top: number;
+    };
+};
+export type TFlowchartController = ReturnType<typeof useFlowchart>;
+/** Root owns the one `useFlowchart` instance; nodes read it from here. */
+export declare const FlowchartContext: React.Context<{
+    steps: TStepNode[];
+    edges: TEdge[];
+    readOnly: boolean;
+    zoomable: boolean;
+    scale: number;
+    view: {
+        scale: number;
+        x: number;
+        y: number;
+    };
+    zoomBy: (factor: number) => void;
+    resetZoom: () => void;
+    onCanvasPointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;
+    onCanvasPointerMove: (event: React.PointerEvent<HTMLDivElement>) => void;
+    onCanvasPointerUp: () => void;
+    isPanning: () => boolean;
+    frame: {
+        w: number;
+        h: number;
+    };
+    worldHeight: number;
+    onAdd: ((id: string, side: import('./types').TFlowchartSide) => void) | undefined;
+    removeNode: (id: string) => void;
+    commitRemove: (id: string) => void;
+    cancelRemove: () => void;
+    pendingRemove: {
+        id: string;
+        orphans: string[];
+    } | null;
+    orphansOf: (id: string) => string[];
+    updateHeights: (callback: (prev: THeights) => THeights) => void;
+    offsets: TOffsets;
+    width: number;
+    selected: string | null;
+    drag: React.RefObject<{
+        id: string;
+        startX: number;
+        startY: number;
+        baseDx: number;
+        baseDy: number;
+        moved: boolean;
+    } | null>;
+    updateSelected: (id: string | null) => void;
+    updateFrame: (w: number, h: number) => void;
+    onPointerDown: (node: TStepNode) => (event: React.PointerEvent<HTMLDivElement>) => void;
+    onPointerMove: (node: TStepNode) => (event: React.PointerEvent<HTMLDivElement>) => void;
+    onPointerUp: (node: TStepNode) => () => void;
+    wasDragged: () => boolean;
+    isLit: (edge: TEdge) => boolean;
+    editableEdges: boolean;
+    selectedEdge: string | null;
+    selectEdge: (id: string | null) => void;
+    edgeDrag: TEdgeDrag | null;
+    edgeEnds: (edge: TEdge) => {
+        from: {
+            x: number;
+            y: number;
+        };
+        to: {
+            x: number;
+            y: number;
+        };
+    } | null;
+    onEdgeHandleDown: (edge: TEdge, end: TEdgeEnd) => (event: React.PointerEvent<SVGElement>) => void;
+    onEdgeHandleMove: (event: React.PointerEvent<SVGElement>) => void;
+    onEdgeHandleUp: (event: React.PointerEvent<SVGElement>) => void;
+    ghostCurve: () => string;
+    removeEdge: (id: string) => void;
+    onEdgeChange: ((id: string, patch: Pick<TEdge, "strokeWidth" | "color">) => void) | undefined;
+    snapTarget: string | null;
+    previewNode: string | null;
+    setPreviewNode: React.Dispatch<React.SetStateAction<string | null>>;
+    connectTo: (source: string, target: string) => void;
+    renameNode: (id: string, name: string) => void;
+    duplicateNode: (id: string) => void | undefined;
+    canRename: boolean;
+    canDuplicate: boolean;
+    canConnect: boolean;
+    rowHeight: number[];
+    canvasHeight: number;
+    connectorWidth: number;
+    bezierCurve: (edge: TEdge) => string;
+    handlePlace: (node: TStepNode) => {
+        w: number;
+        cx: number;
+        top: number;
+    };
+} | null>;
+export declare const useFlowchartContext: () => {
+    steps: TStepNode[];
+    edges: TEdge[];
+    readOnly: boolean;
+    zoomable: boolean;
+    scale: number;
+    view: {
+        scale: number;
+        x: number;
+        y: number;
+    };
+    zoomBy: (factor: number) => void;
+    resetZoom: () => void;
+    onCanvasPointerDown: (event: React.PointerEvent<HTMLDivElement>) => void;
+    onCanvasPointerMove: (event: React.PointerEvent<HTMLDivElement>) => void;
+    onCanvasPointerUp: () => void;
+    isPanning: () => boolean;
+    frame: {
+        w: number;
+        h: number;
+    };
+    worldHeight: number;
+    onAdd: ((id: string, side: import('./types').TFlowchartSide) => void) | undefined;
+    removeNode: (id: string) => void;
+    commitRemove: (id: string) => void;
+    cancelRemove: () => void;
+    pendingRemove: {
+        id: string;
+        orphans: string[];
+    } | null;
+    orphansOf: (id: string) => string[];
+    updateHeights: (callback: (prev: THeights) => THeights) => void;
+    offsets: TOffsets;
+    width: number;
+    selected: string | null;
+    drag: React.RefObject<{
+        id: string;
+        startX: number;
+        startY: number;
+        baseDx: number;
+        baseDy: number;
+        moved: boolean;
+    } | null>;
+    updateSelected: (id: string | null) => void;
+    updateFrame: (w: number, h: number) => void;
+    onPointerDown: (node: TStepNode) => (event: React.PointerEvent<HTMLDivElement>) => void;
+    onPointerMove: (node: TStepNode) => (event: React.PointerEvent<HTMLDivElement>) => void;
+    onPointerUp: (node: TStepNode) => () => void;
+    wasDragged: () => boolean;
+    isLit: (edge: TEdge) => boolean;
+    editableEdges: boolean;
+    selectedEdge: string | null;
+    selectEdge: (id: string | null) => void;
+    edgeDrag: TEdgeDrag | null;
+    edgeEnds: (edge: TEdge) => {
+        from: {
+            x: number;
+            y: number;
+        };
+        to: {
+            x: number;
+            y: number;
+        };
+    } | null;
+    onEdgeHandleDown: (edge: TEdge, end: TEdgeEnd) => (event: React.PointerEvent<SVGElement>) => void;
+    onEdgeHandleMove: (event: React.PointerEvent<SVGElement>) => void;
+    onEdgeHandleUp: (event: React.PointerEvent<SVGElement>) => void;
+    ghostCurve: () => string;
+    removeEdge: (id: string) => void;
+    onEdgeChange: ((id: string, patch: Pick<TEdge, "strokeWidth" | "color">) => void) | undefined;
+    snapTarget: string | null;
+    previewNode: string | null;
+    setPreviewNode: React.Dispatch<React.SetStateAction<string | null>>;
+    connectTo: (source: string, target: string) => void;
+    renameNode: (id: string, name: string) => void;
+    duplicateNode: (id: string) => void | undefined;
+    canRename: boolean;
+    canDuplicate: boolean;
+    canConnect: boolean;
+    rowHeight: number[];
+    canvasHeight: number;
+    connectorWidth: number;
+    bezierCurve: (edge: TEdge) => string;
+    handlePlace: (node: TStepNode) => {
+        w: number;
+        cx: number;
+        top: number;
+    };
+};
+export {};

package/dist-lib/components/composed/chat/flowchart/step-body.d.ts

@@ -0,0 +1,6 @@
+import { TStepNode } from './types';
+export declare function StepBody({ node }: {
+    node: TStepNode;
+}): import("react").JSX.Element;
+/** Default If/Else card body: two chip rows. Picking a value is a TODO until SelectChip's menu lands. */
+export declare function ConditionBody(): import("react").JSX.Element;

package/dist-lib/components/composed/chat/flowchart/types.d.ts

@@ -0,0 +1,91 @@
+import { SVGProps } from 'react';
+export type TFlowchartSide = "top" | "right" | "bottom" | "left";
+export interface IFlowchartProps {
+    /** Cards to lay out. Defaults to the Trigger → If / Else sample. */
+    steps?: TStepNode[];
+    /** Connectors. Defaults to a chain through `steps` in order. */
+    edges?: TEdge[];
+    /** No drag, no add / remove buttons. Selection still works. */
+    readOnly?: boolean;
+    /** Ctrl/⌘ + wheel and the +/− buttons scale the canvas. */
+    zoomable?: boolean;
+    /** A card was dragged; `offset` is its displacement from the laid-out position. */
+    onDrag?: (id: string, offset: {
+        dx: number;
+        dy: number;
+    }) => void;
+    /** The add button on one side of a card was pressed. */
+    onAdd?: (id: string, side: TFlowchartSide) => void;
+    /** The remove button was pressed (already confirmed when children would be orphaned). */
+    onRemove?: (id: string) => void;
+    /**
+     * Canvas min-height in px. The canvas fills its parent; without this it
+     * floors at the content height it loaded with, so zooming out or removing
+     * a card never collapses it.
+     */
+    height?: number;
+    /** Disconnect was pressed on a selected connector. Enables connector editing. */
+    onEdgeRemove?: (id: string) => void;
+    /** A connector end was dropped on another card; `edge` carries the new source / target. */
+    onEdgeConnect?: (edge: TEdge) => void;
+    /** Stroke width or colour picked from the connector toolbar. */
+    onEdgeChange?: (id: string, patch: Pick<TEdge, "strokeWidth" | "color">) => void;
+    /** The pill was renamed inline (double-click, then click away or Enter). */
+    onRename?: (id: string, name: string) => void;
+    /** "Duplicate" in the context menu: copy the card to a new node on its right. */
+    onDuplicate?: (id: string) => void;
+    variant?: string;
+    children?: React.ReactNode;
+    className?: string;
+}
+export type TStepNode = {
+    id: string;
+    row: number;
+    x: number;
+    w: number;
+    kind?: {
+        label: string;
+        hue: string;
+    };
+    /** Pill text; defaults to the kind label, or "Node n" for conditions. */
+    name?: string;
+    hue?: string;
+    title?: string;
+    caption?: string;
+    /** Replaces the icon tile — a person, a manuscript, a corpus cover. */
+    image?: {
+        src: string;
+        alt?: string;
+    };
+    /** Custom tile icon when there is no image. */
+    icon?: React.ReactNode;
+    condition?: boolean;
+    /** Custom card body; replaces the default title / caption body. */
+    children?: React.ReactNode;
+};
+export type TEdge = {
+    id: string;
+    source: string;
+    target: string;
+    bezierCurve?: boolean;
+    strokeWidth?: number;
+    /** Any CSS colour; defaults to the line token, accent when lit. */
+    color?: string;
+};
+export type TEdgeEnd = "source" | "target";
+export interface IConnectorProps extends Omit<SVGProps<SVGPathElement>, "strokeWidth"> {
+    edge: TEdge;
+    isLit: boolean;
+    strokeWidth?: number;
+    /** Selected for editing: bolder hit, toolbar and end handles render in Root. */
+    selected?: boolean;
+    /** Enables the wide click target; called with the edge id. */
+    onPick?: (id: string) => void;
+}
+export interface IChartNodeProps {
+    node: TStepNode;
+    /** Position in `steps`, for the generated "Node n" label. */
+    index?: number;
+    onRef: (el: HTMLDivElement | null) => void;
+    children?: React.ReactNode;
+}

package/dist-lib/components/composed/chat/flowchart/utils.d.ts

@@ -0,0 +1,64 @@
+import { TStepNode } from './types';
+export type TOffsets = Record<string, {
+    dx: number;
+    dy: number;
+}>;
+export type THeights = Record<string, number>;
+/** Everything `place`/`bezier` need to position a node, resolved once per render. */
+export type TLayout = {
+    width: number;
+    offsets: TOffsets;
+    rows: number[];
+    rowY: number[];
+    heights: THeights;
+};
+/** Distinct row indices, ascending. */
+export declare const rows: (steps: TStepNode[]) => number[];
+/** Height of each row = tallest node in it. */
+export declare const rowH: (steps: TStepNode[], heights: THeights) => number[];
+/** Y offset of each row, stacked with ROW_GAP. */
+export declare const rowYs: (rowH: number[]) => number[];
+export declare const canvasH: (rowY: number[], rowH: number[]) => number;
+export declare const mix: (hue: string, pct: number, base?: string) => string;
+export declare const cw: (width: number) => number;
+export declare const place: (n: TStepNode, { width, offsets, rows, rowY }: TLayout) => {
+    w: number;
+    cx: number;
+    top: number;
+};
+/** Card anchor points (pills sit above the card, so offset the top). */
+export declare const anchors: (n: TStepNode, layout: TLayout) => {
+    top: {
+        x: number;
+        y: number;
+    };
+    bottom: {
+        x: number;
+        y: number;
+    };
+};
+export type TPoint = {
+    x: number;
+    y: number;
+};
+/** Vertical S-curve between two points. */
+export declare const curve: (from: TPoint, to: TPoint) => string;
+/** Cubic bezier midpoint, where the connector toolbar sits. */
+export declare const midpoint: (from: TPoint, to: TPoint) => TPoint;
+export declare const edgePoints: (edge: {
+    from: string;
+    to: string;
+}, steps: TStepNode[], layout: TLayout) => {
+    from: {
+        x: number;
+        y: number;
+    };
+    to: {
+        x: number;
+        y: number;
+    };
+} | null;
+export declare const bezier: (edge: {
+    from: string;
+    to: string;
+}, steps: TStepNode[], layout: TLayout) => string;

package/dist-lib/components/composed/chat/index.d.ts

@@ -0,0 +1,15 @@
+export { Attachment, type TAttachmentKind, type TAttachmentProps, type TAttachmentVariant, } from './attachment';
+export * from './chart';
+export { Markdown, markdownViewAtom, removeMarkdownInstance, useMarkdownView, type IMarkdownProps, type TMarkdownView, } from './markdown';
+export { addComposerAttachmentAtom, clearComposerAttachmentsAtom, CommandMenu, Composer, composerAttachmentsAtom, removeComposerAttachmentAtom, removeComposerInstance, useComposerAttachmentActions, useComposerAttachments, } from './composer';
+export type { TComposerAttachment, IComposerModel, IComposerOption, IComposerBaseProps, TComposerMode, IComposerSuggestionsProps, IComposerMenuProps, IComposerProps, IComposerSubmitButtonProps, } from './composer';
+export { Recommendation, RecommendationCard } from './recommendation';
+export type { IRecommendationCardProps, IRecommendationCheckboxProps, IRecommendationEntity, IRecommendationFields, TRecommendationGroupProps, IRecommendationItemProps, IRecommendationOption, TRecommendationState, } from './recommendation';
+export { ContextCards, type IContextCard, type IContextCardsProps, } from './context-cards';
+export { CodeBlock, tokenize, type ICodeBlockProps, type ICodeDiffLine, } from './code-block';
+export { FilterTable, filterTableFilterAtom, removeFilterTableInstance, type IFilterTableColumn, type IFilterTableProps, type IFilterTableStatus, } from './filter-table';
+export { RecordsTable, recordsTableSelectionAtom, removeRecordsTableInstance, type TRecordsColumnKey, type IRecordsRow, type IRecordsTableProps, } from './records-table';
+export * from './flowchart';
+export { type IChartNodeProps, type IFlowchartProps } from './flowchart';
+export { InsightCards, InsightEntity, type IInsight, type IInsightAllocation, type IInsightSegment, type IInsightCardsProps, } from './insight-cards';
+export { SendHint } from './hint';

package/dist-lib/components/composed/chat/insight-cards.d.ts

@@ -0,0 +1,54 @@
+import { TDotTone, IStatProps } from '../../ui/chat';
+import { TChartDatum, IChartSeries } from './chart';
+import * as React from "react";
+export interface IInsight {
+    /** Sentence; `entity` is highlighted with a dot in front. */
+    summary: React.ReactNode;
+    stats?: IStatProps[];
+    snapshot?: {
+        label?: React.ReactNode;
+        badge?: React.ReactNode;
+        data: TChartDatum[];
+        series: IChartSeries[];
+    };
+    /** Share breakdown: tile + big value, a segmented bar, selectable legend pills and a detail panel. */
+    allocation?: IInsightAllocation;
+    followUp?: string;
+}
+export interface IInsightSegment {
+    key: string;
+    label: React.ReactNode;
+    value: number;
+    tone?: TDotTone;
+    /** Detail panel heading; falls back to `label`. */
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+}
+export interface IInsightAllocation {
+    label: React.ReactNode;
+    value: React.ReactNode;
+    /** Letter in the tile; takes the first segment's tone. */
+    initials?: string;
+    segments: IInsightSegment[];
+    defaultSelected?: string;
+}
+export interface IInsightCardsProps extends React.ComponentPropsWithoutRef<"div"> {
+    header?: React.ReactNode;
+    insights: IInsight[];
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    onFollowUp?: (text: string) => void;
+}
+/**
+ * Paged insights: header with count and prev/next, summary, stats,
+ * a trend snapshot (line plot + legend) or an allocation breakdown, and a follow-up prompt.
+ *
+ * @sketch "Component / Insight Cards"
+ */
+export declare function InsightCards({ header, insights, index, defaultIndex, onIndexChange, onFollowUp, className, ...props }: IInsightCardsProps): React.ReactElement;
+/** Inline entity marker for `Insight.summary`: dot + name. */
+export declare function InsightEntity({ tone, children }: {
+    tone?: TDotTone;
+    children: React.ReactNode;
+}): React.ReactElement;

package/dist-lib/components/composed/chat/markdown-atom.d.ts

@@ -0,0 +1,7 @@
+export type TMarkdownView = "preview" | "markup";
+/** Which pane a Markdown card shows, keyed by its `markdownId`; `null` until first toggled (the card then falls back to its `defaultView`). */
+export declare const markdownViewAtom: import('../../../lib/keyed-atom').TFamily<import('jotai').PrimitiveAtom<TMarkdownView | null> & {
+    init: TMarkdownView | null;
+}>;
+export declare const removeMarkdownInstance: (id: string) => void;
+export declare function useMarkdownView(markdownId: string): [TMarkdownView | null, (args_0: TMarkdownView | ((prev: TMarkdownView | null) => TMarkdownView | null) | null) => void];

package/dist-lib/components/composed/chat/markdown.d.ts

@@ -0,0 +1,22 @@
+import { markdownViewAtom, removeMarkdownInstance, TMarkdownView, useMarkdownView } from './markdown-atom';
+import * as React from "react";
+export { markdownViewAtom, removeMarkdownInstance, useMarkdownView, type TMarkdownView, };
+export interface IMarkdownProps extends Omit<React.ComponentPropsWithoutRef<"div">, "onCopy"> {
+    /** Markdown source; rendered in Preview, shown raw in Markup. */
+    source: string;
+    /** Stable id for the view atom. Unnamed cards key off `useId()`. */
+    markdownId?: string;
+    view?: TMarkdownView;
+    defaultView?: TMarkdownView;
+    onViewChange?: (view: TMarkdownView) => void;
+    onCopy?: (source: string) => void;
+    onExpand?: () => void;
+    /** Drop the card border (inside an AiBubble the bubble supplies it). */
+    bare?: boolean;
+}
+/**
+ * Rendered markdown behind a Preview | Markup toggle, with copy and expand.
+ *
+ * @sketch "Component / Markdown / Preview", "Component / Markdown / Markup"
+ */
+export declare function Markdown({ source, markdownId, view, defaultView, onViewChange, onCopy, onExpand, bare, className, ...props }: IMarkdownProps): React.ReactElement;

package/dist-lib/components/composed/chat/recommendation/checkbox.d.ts

@@ -0,0 +1,9 @@
+import { IRecommendationCheckboxProps } from './types';
+import type * as React from "react";
+/**
+ * Outcome mark after beautiful-ui's Task Rows: a Sparkle while the proposal
+ * waits for approval, a spinning ring once the agent is running (with the
+ * step number inside), then a filled badge that pops in — green check when
+ * accepted, red cross when rejected.
+ */
+export declare function Checkbox({ state, step, className, }: IRecommendationCheckboxProps): React.ReactElement;

package/dist-lib/components/composed/chat/recommendation/constant.d.ts

@@ -0,0 +1,52 @@
+import { TSignalLevel, TTagTone } from '../../../ui/chat';
+import { TRecommendationState } from './types';
+export declare const CONFIDENCE: Record<TSignalLevel, string>;
+export declare const STATE_LABEL: Record<Exclude<TRecommendationState, "pending" | "running">, string>;
+/** Status pill tones, shared with the presentation Tag atom. */
+export declare const STATE_TONE: Record<Exclude<TRecommendationState, "pending" | "running">, TTagTone>;
+export declare const ACTION_MOTION: {
+    readonly animate: {
+        readonly opacity: 1;
+        readonly y: 0;
+    };
+    readonly exit: {
+        readonly opacity: 0;
+        readonly y: 4;
+    };
+    readonly initial: {
+        readonly opacity: 0;
+        readonly y: 4;
+    };
+    readonly transition: {
+        readonly duration: 0.18;
+        readonly ease: readonly [0.77, 0, 0.175, 1];
+    };
+};
+/** Row entrance, driven by the Group's staggered `visible` variant. */
+export declare const ROW_VARIANTS: {
+    readonly hidden: {
+        readonly opacity: 0;
+        readonly y: 8;
+    };
+    readonly visible: {
+        readonly opacity: 1;
+        readonly y: 0;
+        readonly transition: {
+            readonly duration: 0.45;
+            readonly ease: readonly [0.23, 1, 0.32, 1];
+        };
+    };
+};
+/** Rows enter staggered 80ms apart; each Item picks up `row` from `ROW_VARIANTS`. */
+export declare const GROUP_VARIANTS: {
+    readonly hidden: {};
+    readonly visible: {
+        readonly transition: {
+            readonly staggerChildren: 0.08;
+        };
+    };
+};
+export declare const SIZE = 18;
+export declare const STROKE = 1.5;
+export declare const R: number;
+export declare const C: number;

package/dist-lib/components/composed/chat/recommendation/default.d.ts

@@ -0,0 +1,7 @@
+import { IRecommendationCardProps } from './types';
+import type * as React from "react";
+/**
+ * One-card convenience: a Group with a single Item, so existing
+ * `<RecommendationCard />` call sites keep working.
+ */
+export declare function RecommendationCard({ value, defaultOpen, ...props }: IRecommendationCardProps): React.ReactElement;

package/dist-lib/components/composed/chat/recommendation/group.d.ts

@@ -0,0 +1,7 @@
+import { TRecommendationGroupProps } from './types';
+import type * as React from "react";
+/**
+ * Accordion root for a stack of recommendation items. Defaults to `multiple`
+ * so each proposal can stay open on its own, like independent suggestion cards.
+ */
+export declare function Group({ className, multiple, ...props }: TRecommendationGroupProps): React.ReactElement;

package/dist-lib/components/composed/chat/recommendation/index.d.ts

@@ -0,0 +1,13 @@
+import { Checkbox } from './checkbox';
+import { RecommendationCard } from './default';
+import { Group } from './group';
+import { Item } from './item';
+export type * from './types';
+export { RecommendationCard };
+export declare const Recommendation: {
+    Group: typeof Group;
+    Item: typeof Item;
+    Checkbox: typeof Checkbox;
+    Card: typeof RecommendationCard;
+};
+export default Group;

package/dist-lib/components/composed/chat/recommendation/item.d.ts

@@ -0,0 +1,12 @@
+import { IRecommendationItemProps } from './types';
+import type * as React from "react";
+/**
+ * Human-in-the-loop proposal: title, description with entity + lead-time
+ * pills, other options with signal bars, confidence + Accept / Alternatives.
+ * Outcome mark, badge, and the pending ↔ undo swap come from SuggestionCard.
+ *
+ * Must render inside `Recommendation.Group`.
+ *
+ * @sketch "Component / Recommendation Card"
+ */
+export declare function Item({ value, title, description, entity, leadTime, reference, options, optionsLabel, confidence, confidenceLabel, acceptLabel, rejectLabel, alternativesLabel, state, step, onAccept, onReject, onAlternatives, onUndo, onSelectOption, children, className, ...props }: IRecommendationItemProps): React.ReactElement;