@exegia/corpora-ui 1.0.0 → 3.0.0

package/src/components/composed/tree/type.ts

@@ -2,7 +2,7 @@ import type * as React from "react"
 
 /** One node in the tree. Nesting depth carries meaning per variant — see
  * `TreeProps["variant"]`. */
-export interface TreeNode {
+export interface ITreeNode {
   id: string
   label: string
   /** Leading icon. Required in practice for `sidebar` — it is all that
@@ -22,31 +22,31 @@ export interface TreeNode {
   badge?: React.ReactNode
   /** Fires on selection, before the tree-level `onNavigate`. */
   onSelect?: () => void
-  children?: TreeNode[]
+  children?: ITreeNode[]
 }
 
-export type TreeVariant = "navigation" | "toc" | "sidebar" | "files"
+export type TTreeVariant = "navigation" | "toc" | "sidebar" | "files"
 
 /** Where a dragged row lands relative to its drop target. */
-export type TreeDropPosition = "before" | "after" | "inside"
+export type TTreeDropPosition = "before" | "after" | "inside"
 
 /** Key for one tree’s state in the store. Any stable string; `useTree`
  * generates one when you don't pass it. */
-export type TreeInstanceId = string
+export type TTreeInstanceId = string
 
 /** Row a drag hovers, and where the drop would land. */
-export interface TreeDropTarget {
+export interface ITreeDropTarget {
   id: string
-  position: TreeDropPosition
+  position: TTreeDropPosition
 }
 
-interface TreeBaseProps {
-  items: TreeNode[]
+interface ITreeBaseProps {
+  items: ITreeNode[]
   /** Key this tree's state under a name your app can address —
    * `useTreeState("app-nav")` / `useTreeActions("app-nav")` reach it from
    * anywhere under `ExegiaProvider`. Without one the tree generates a key
    * and its state is dropped when it unmounts. */
-  treeId?: TreeInstanceId
+  treeId?: TTreeInstanceId
   /** Never set on the data form — `tree` selects the controller form. */
   tree?: never
   /** `id` of the current entry — matches any depth. Its ancestors expand. */
@@ -55,14 +55,14 @@ interface TreeBaseProps {
    * own `onSelect`. Rows are buttons, so this is the routing path — wire
    * your router's navigate here. `toc` rows below the route level still jump
    * to `#{id}` natively, after this fires. */
-  onNavigate?: (node: TreeNode) => void
+  onNavigate?: (node: ITreeNode) => void
   /** Expand/collapse cues. Silent until `bindSounds()`. */
   sound?: boolean
   ariaLabel?: string
   className?: string
 }
 
-interface TreeReadonlyProps {
+interface ITreeReadonlyProps {
   collapsed?: never
   onMove?: never
   onRename?: never
@@ -72,42 +72,42 @@ interface TreeReadonlyProps {
 /** Drive the tree from a `useTree` controller instead of raw props. The
  * controller carries the variant, the data and every handler; only the
  * presentational props stay here. */
-export interface TreeControllerProps {
-  tree: TreeController
+export interface ITreeControllerProps {
+  tree: ITreeController
   items?: never
   ariaLabel?: string
   className?: string
   /** Row actions revealed on hover/focus (`files` only — ignored by the
    * other variants, which the controller form cannot type-gate). */
-  renderTrailing?: (node: TreeNode) => React.ReactNode
+  renderTrailing?: (node: ITreeNode) => React.ReactNode
 }
 
 /** Either form: raw props, or a `useTree` controller via `tree`. */
-export type TreeProps = TreeDataProps | TreeControllerProps
+export type TTreeProps = TTreeDataProps | ITreeControllerProps
 
 /** The four shapes a Tree takes. Editing props only exist on `files`;
  * `collapsed` only on `sidebar` — the union is the contract. */
-export type TreeDataProps = TreeBaseProps &
+export type TTreeDataProps = ITreeBaseProps &
   (
     | ({
         /** Nested app navigation. With 3 levels of nodes the top level
          * becomes collapsible section names (styled as headings, not
          * rows); with 2 it renders plain selectable rows. */
         variant: "navigation"
-      } & TreeReadonlyProps)
+      } & ITreeReadonlyProps)
     | ({
         /** Table of contents: top-level nodes are routes (handled in
          * `onNavigate`); rows below jump to `#{id}` after select, like an
          * anchor would. Parents select on the row and expand from a
          * separate overlay chevron. */
         variant: "toc"
-      } & TreeReadonlyProps)
+      } & ITreeReadonlyProps)
     | ({
         /** Single-level icon rail. `collapsed` shrinks rows to their
          * leading icon; nested children are ignored. */
         variant: "sidebar"
         collapsed?: boolean
-      } & Omit<TreeReadonlyProps, "collapsed">)
+      } & Omit<ITreeReadonlyProps, "collapsed">)
     | {
         /** File explorer: only leaves navigate, folders toggle. Compact
          * spacing; rename, drag-and-drop and trailing actions enabled. */
@@ -119,7 +119,7 @@ export type TreeDataProps = TreeBaseProps &
         /** Enables inline rename (double-click or F2). */
         onRename?: (id: string, label: string) => void
         /** Row actions revealed on hover/focus — a menu, a delete icon. */
-        renderTrailing?: (node: TreeNode) => React.ReactNode
+        renderTrailing?: (node: ITreeNode) => React.ReactNode
         collapsed?: never
       }
   )
@@ -127,29 +127,29 @@ export type TreeDataProps = TreeBaseProps &
 /** Options for `useTree`. Each of `items`, `activeId` and `collapsed` is
  * controlled when passed and hook-owned when its `default*` twin is used
  * instead. */
-export interface UseTreeOptions {
+export interface IUseTreeOptions {
   /** Key this tree's state under a name your app can address —
    * `useTreeState("app-nav")` / `useTreeActions("app-nav")` reach it from
    * anywhere under `ExegiaProvider`. Without one the hook generates a key
    * and the state is dropped when the component unmounts. */
-  treeId?: TreeInstanceId
+  treeId?: TTreeInstanceId
   /** Which shape the tree takes — gates rename/reorder (`files`) and the
    * collapsible rail (`sidebar`). */
-  variant: TreeVariant
+  variant: TTreeVariant
   /** Controlled data. With it, `rename`/`move` only report the edit unless
    * you also pass `onItemsChange`. */
-  items?: TreeNode[]
+  items?: ITreeNode[]
   /** Hook-owned data — `rename` and `move` apply the edit themselves. */
-  defaultItems?: TreeNode[]
+  defaultItems?: ITreeNode[]
   /** Next tree after a `rename`/`move`. Also enables self-applying edits
    * on top of controlled `items`. */
-  onItemsChange?: (items: TreeNode[]) => void
+  onItemsChange?: (items: ITreeNode[]) => void
   /** Controlled selection. Ancestors of the active node expand. */
   activeId?: string
   defaultActiveId?: string
   /** Fires for every selection (rows and leaves alike), after the node's
    * own `onSelect` — wire your router's navigate here. */
-  onNavigate?: (node: TreeNode) => void
+  onNavigate?: (node: ITreeNode) => void
   /** Start with these ids expanded instead of the `defaultOpen` set. */
   defaultExpandedIds?: Iterable<string>
   onExpandedChange?: (ids: string[]) => void
@@ -169,18 +169,18 @@ export interface UseTreeOptions {
 
 /** Everything the tree can do, callable from outside the component.
  * Returned by `useTree` and accepted by `<Tree tree={…} />`. */
-export interface TreeController {
+export interface ITreeController {
   /** The key this tree's state is stored under. */
-  treeId: TreeInstanceId
-  variant: TreeVariant
-  items: TreeNode[]
+  treeId: TTreeInstanceId
+  variant: TTreeVariant
+  items: ITreeNode[]
   /** `navigation` with 3 levels of nodes — depth 0 renders as sections. */
   sectioned: boolean
   /** Ids of the section headings, empty unless `sectioned`. Pass one to
    * `expand`/`collapse`/`toggleExpanded` to work a whole section. */
   sectionIds: string[]
   sound: boolean
-  getNode: (id: string) => TreeNode | null
+  getNode: (id: string) => ITreeNode | null
 
   expandedIds: ReadonlySet<string>
   isExpanded: (id: string) => boolean
@@ -219,7 +219,7 @@ export interface TreeController {
   /** Back to the values the tree mounted with. */
   reset: () => void
 
-  dnd: TreeDndContextValue
+  dnd: ITreeDndContextValue
 }
 
 /** @internal What a row needs from the root, threaded through context so
@@ -228,36 +228,36 @@ export interface TreeController {
  * Deliberately free of tree state. Rows read state from per-node atoms, so
  * this value keeps its identity for the life of the tree and expanding one
  * branch no longer re-renders every row through context. */
-export interface TreeContextValue {
-  treeId: TreeInstanceId
-  renderTrailing?: (node: TreeNode) => React.ReactNode
-  dnd: TreeDndHandlers
+export interface ITreeContextValue {
+  treeId: TTreeInstanceId
+  renderTrailing?: (node: ITreeNode) => React.ReactNode
+  dnd: ITreeDndHandlers
 }
 
 /** @internal The drag event handlers, stable for the life of the tree —
  * they read drag state out of the store instead of closing over it, so
  * handing them to every row costs no re-renders. */
-export interface TreeDndHandlers {
+export interface ITreeDndHandlers {
   enabled: boolean
   onRowDragStart: (event: React.DragEvent, id: string) => void
-  onRowDragOver: (event: React.DragEvent, node: TreeNode) => void
+  onRowDragOver: (event: React.DragEvent, node: ITreeNode) => void
   onRowDragLeave: (event: React.DragEvent) => void
-  onRowDrop: (event: React.DragEvent, node: TreeNode) => void
+  onRowDrop: (event: React.DragEvent, node: ITreeNode) => void
   onRowDragEnd: () => void
 }
 
 /** @internal Handlers plus live drag state — what `TreeController.dnd`
  * exposes (all `null`/no-op outside `files`). */
-export interface TreeDndContextValue extends TreeDndHandlers {
+export interface ITreeDndContextValue extends ITreeDndHandlers {
   draggedId: string | null
   /** Row the pointer is over and where the drop would land. */
-  dropTarget: TreeDropTarget | null
+  dropTarget: ITreeDropTarget | null
 }
 
 /** Everything observable about one tree, for consumers reading it by id. */
-export interface TreeState {
-  variant: TreeVariant
-  items: TreeNode[]
+export interface ITreeState {
+  variant: TTreeVariant
+  items: ITreeNode[]
   activeId?: string
   expandedIds: ReadonlySet<string>
   collapsed: boolean
@@ -267,11 +267,11 @@ export interface TreeState {
   canRename: boolean
   canMove: boolean
   draggedId: string | null
-  dropTarget: TreeDropTarget | null
+  dropTarget: ITreeDropTarget | null
 }
 
 /** Everything doable to one tree from outside its component. */
-export interface TreeActions {
+export interface ITreeActions {
   expand: (id: string) => void
   collapse: (id: string) => void
   toggleExpanded: (id: string) => void
@@ -285,14 +285,14 @@ export interface TreeActions {
   cancelRename: () => void
   rename: (id: string, label: string) => void
   move: (id: string, parentId: string | null, index: number) => void
-  setItems: (items: TreeNode[]) => void
+  setItems: (items: ITreeNode[]) => void
   reset: () => void
 }
 
 /** @internal Projection of `useTree`'s options — primitives only, so the
  * store write runs once per real change instead of once per render. */
-export interface TreeConfig {
-  variant: TreeVariant
+export interface ITreeConfig {
+  variant: TTreeVariant
   sound: boolean
   controlsItems: boolean
   controlsActiveId: boolean
@@ -304,9 +304,9 @@ export interface TreeConfig {
 
 /** @internal Latest option callbacks. Only write atoms read this, so it
  * can be refreshed every commit without re-rendering anything. */
-export interface TreeHandlers {
-  onNavigate?: (node: TreeNode) => void
-  onItemsChange?: (items: TreeNode[]) => void
+export interface ITreeHandlers {
+  onNavigate?: (node: ITreeNode) => void
+  onItemsChange?: (items: ITreeNode[]) => void
   onExpandedChange?: (ids: string[]) => void
   onCollapsedChange?: (collapsed: boolean) => void
   onRename?: (id: string, label: string) => void
@@ -314,8 +314,8 @@ export interface TreeHandlers {
 }
 
 /** @internal What an instance starts from, replayed by `resetTreeAtom`. */
-export interface TreeSeed {
-  items: TreeNode[]
+export interface ITreeSeed {
+  items: ITreeNode[]
   activeId?: string
   collapsed: boolean
   expandedIds?: string[]

package/src/components/composed/tree/use-tree-dnd.ts

@@ -12,11 +12,11 @@ import {
   treeItemsAtom,
 } from "./tree-atom"
 import type {
-  TreeDndContextValue,
-  TreeDndHandlers,
-  TreeDropPosition,
-  TreeInstanceId,
-  TreeNode,
+  ITreeDndContextValue,
+  ITreeDndHandlers,
+  TTreeDropPosition,
+  TTreeInstanceId,
+  ITreeNode,
 } from "./type"
 import { containsNode, findNode, locateNode } from "./utils"
 
@@ -37,7 +37,7 @@ const EDGE_RATIO = 0.25
  * never read, so the flow also works where the store is unavailable (tests,
  * some webviews).
  */
-export function useTreeDndHandlers(treeId: TreeInstanceId): TreeDndHandlers {
+export function useTreeDndHandlers(treeId: TTreeInstanceId): ITreeDndHandlers {
   const store = useStore()
   const enabled = useAtomValue(treeCanMoveAtom(treeId))
   const setDraggedId = useSetAtom(treeDraggedIdAtom(treeId))
@@ -72,7 +72,7 @@ export function useTreeDndHandlers(treeId: TreeInstanceId): TreeDndHandlers {
   )
 
   const onRowDragOver = React.useCallback(
-    (event: React.DragEvent, node: TreeNode) => {
+    (event: React.DragEvent, node: ITreeNode) => {
       const draggedId = readDraggedId()
       if (!enabled || draggedId === null) return
       // A node never drops onto itself or into its own subtree.
@@ -87,7 +87,7 @@ export function useTreeDndHandlers(treeId: TreeInstanceId): TreeDndHandlers {
       // Any node carrying a children array is a folder — an empty one still
       // accepts drops "inside".
       const folder = node.children !== undefined
-      const position: TreeDropPosition = folder
+      const position: TTreeDropPosition = folder
         ? ratio < EDGE_RATIO
           ? "before"
           : ratio > 1 - EDGE_RATIO
@@ -116,7 +116,7 @@ export function useTreeDndHandlers(treeId: TreeInstanceId): TreeDndHandlers {
   )
 
   const onRowDrop = React.useCallback(
-    (event: React.DragEvent, node: TreeNode) => {
+    (event: React.DragEvent, node: ITreeNode) => {
       if (!enabled) return
       event.preventDefault()
       event.stopPropagation()
@@ -167,7 +167,7 @@ export function useTreeDndHandlers(treeId: TreeInstanceId): TreeDndHandlers {
 
 /** The handlers plus live drag state, for `TreeController.dnd`. Rows take the
  * handlers alone and read the state per node instead. */
-export function useTreeDnd(treeId: TreeInstanceId): TreeDndContextValue {
+export function useTreeDnd(treeId: TTreeInstanceId): ITreeDndContextValue {
   const handlers = useTreeDndHandlers(treeId)
   const draggedId = useAtomValue(treeDraggedIdAtom(treeId))
   const dropTarget = useAtomValue(treeDropTargetAtom(treeId))

package/src/components/composed/tree/use-tree-state.ts

@@ -21,7 +21,7 @@ import {
   toggleTreeNodeAtom,
   treeStateAtom,
 } from "./tree-atom"
-import type { TreeActions, TreeInstanceId, TreeState } from "./type"
+import type { ITreeActions, TTreeInstanceId, ITreeState } from "./type"
 
 /**
  * Read the tree registered under `treeId` from anywhere below
@@ -35,7 +35,7 @@ import type { TreeActions, TreeInstanceId, TreeState } from "./type"
  * change. A component that reads one field should subscribe to that field's
  * atom instead: `useAtomValue(treeCollapsedAtom("app-nav"))`.
  */
-export function useTreeState(treeId: TreeInstanceId): TreeState {
+export function useTreeState(treeId: TTreeInstanceId): ITreeState {
   return useAtomValue(treeStateAtom(treeId))
 }
 
@@ -49,7 +49,7 @@ export function useTreeState(treeId: TreeInstanceId): TreeState {
  * <Button onClick={nav.collapseAll}>Collapse all</Button>
  * ```
  */
-export function useTreeActions(treeId: TreeInstanceId): TreeActions {
+export function useTreeActions(treeId: TTreeInstanceId): ITreeActions {
   const expand = useSetAtom(expandTreeNodeAtom(treeId))
   const collapse = useSetAtom(collapseTreeNodeAtom(treeId))
   const toggleExpanded = useSetAtom(toggleTreeNodeAtom(treeId))

package/src/components/composed/tree/use-tree.ts

@@ -34,11 +34,11 @@ import {
   treeRenamingIdAtom,
 } from "./tree-atom"
 import type {
-  TreeConfig,
-  TreeController,
-  TreeHandlers,
-  TreeSeed,
-  UseTreeOptions,
+  ITreeConfig,
+  ITreeController,
+  ITreeHandlers,
+  ITreeSeed,
+  IUseTreeOptions,
 } from "./type"
 import { useTreeDnd } from "./use-tree-dnd"
 import { findNode, hasThreeLevels } from "./utils"
@@ -65,7 +65,7 @@ import { findNode, hasThreeLevels } from "./utils"
  * `ExegiaProvider` can drive this tree without the controller — name it and
  * reach for `useTreeState(treeId)` / `useTreeActions(treeId)` elsewhere.
  */
-export function useTree(options: UseTreeOptions): TreeController {
+export function useTree(options: IUseTreeOptions): ITreeController {
   const {
     variant,
     onNavigate,
@@ -93,7 +93,7 @@ export function useTree(options: UseTreeOptions): TreeController {
 
   // Primitives only, so this object is stable and the store write below runs
   // once per real change rather than once per render.
-  const config = React.useMemo<TreeConfig>(
+  const config = React.useMemo<ITreeConfig>(
     () => ({
       variant,
       sound,
@@ -116,7 +116,7 @@ export function useTree(options: UseTreeOptions): TreeController {
     ]
   )
 
-  const handlers = React.useMemo<TreeHandlers>(
+  const handlers = React.useMemo<ITreeHandlers>(
     () => ({
       onNavigate,
       onItemsChange,
@@ -136,7 +136,7 @@ export function useTree(options: UseTreeOptions): TreeController {
   )
 
   // Read once: the `default*` options describe the mount, not every render.
-  const [seed] = React.useState<TreeSeed>(() => ({
+  const [seed] = React.useState<ITreeSeed>(() => ({
     items: options.items ?? options.defaultItems ?? [],
     activeId: options.activeId ?? options.defaultActiveId,
     collapsed: options.collapsed ?? options.defaultCollapsed ?? false,
@@ -244,7 +244,7 @@ export function useTree(options: UseTreeOptions): TreeController {
 
   const dnd = useTreeDnd(treeId)
 
-  return React.useMemo<TreeController>(
+  return React.useMemo<ITreeController>(
     () => ({
       treeId,
       variant,

package/src/components/composed/tree/utils.ts

@@ -1,8 +1,8 @@
-import type { TreeNode } from "./type"
+import type { ITreeNode } from "./type"
 
 /** Depth-0 nodes read as sections only when the data actually nests three
  * levels — a two-level tree keeps its top level as plain link rows. */
-export function hasThreeLevels(items: readonly TreeNode[]): boolean {
+export function hasThreeLevels(items: readonly ITreeNode[]): boolean {
   return items.some((node) =>
     node.children?.some((child) => (child.children?.length ?? 0) > 0)
   )
@@ -10,10 +10,10 @@ export function hasThreeLevels(items: readonly TreeNode[]): boolean {
 
 /** Ids of every ancestor of `id` (nearest last); empty when absent. */
 export function ancestorIdsOf(
-  items: readonly TreeNode[],
+  items: readonly ITreeNode[],
   id: string
 ): string[] {
-  const walk = (nodes: readonly TreeNode[], trail: string[]): string[] | null => {
+  const walk = (nodes: readonly ITreeNode[], trail: string[]): string[] | null => {
     for (const node of nodes) {
       if (node.id === id) return trail
       if (node.children) {
@@ -29,11 +29,11 @@ export function ancestorIdsOf(
 /** Ids that start expanded: `defaultOpen` nodes plus every ancestor of the
  * active entry, so the current location is never folded away. */
 export function initialExpandedIds(
-  items: readonly TreeNode[],
+  items: readonly ITreeNode[],
   activeId?: string
 ): Set<string> {
   const expanded = new Set<string>()
-  const walk = (nodes: readonly TreeNode[]) => {
+  const walk = (nodes: readonly ITreeNode[]) => {
     for (const node of nodes) {
       if (node.defaultOpen) expanded.add(node.id)
       if (node.children) walk(node.children)
@@ -48,11 +48,11 @@ export function initialExpandedIds(
 /** Ids of every node that can hold children — the set `expandAll` opens.
  * In `files` an empty `children: []` still counts (it is a folder). */
 export function expandableIdsOf(
-  items: readonly TreeNode[],
+  items: readonly ITreeNode[],
   filesVariant = false
 ): string[] {
   const ids: string[] = []
-  const walk = (nodes: readonly TreeNode[]) => {
+  const walk = (nodes: readonly ITreeNode[]) => {
     for (const node of nodes) {
       const branch = filesVariant
         ? node.children !== undefined
@@ -67,10 +67,10 @@ export function expandableIdsOf(
 
 /** Immutably relabel `id`. Returns the same array reference when absent. */
 export function renameNode(
-  items: readonly TreeNode[],
+  items: readonly ITreeNode[],
   id: string,
   label: string
-): TreeNode[] {
+): ITreeNode[] {
   return items.map((node) => {
     if (node.id === id) return { ...node, label }
     return node.children
@@ -82,7 +82,7 @@ export function renameNode(
 /** Whether `candidateId` is `id` itself or nests anywhere under it — the
  * guard that keeps a folder from being dropped into its own subtree. */
 export function containsNode(
-  items: readonly TreeNode[],
+  items: readonly ITreeNode[],
   id: string,
   candidateId: string
 ): boolean {
@@ -93,9 +93,9 @@ export function containsNode(
 }
 
 export function findNode(
-  items: readonly TreeNode[],
+  items: readonly ITreeNode[],
   id: string
-): TreeNode | null {
+): ITreeNode | null {
   for (const node of items) {
     if (node.id === id) return node
     if (node.children) {
@@ -108,11 +108,11 @@ export function findNode(
 
 /** Parent id (`null` at root) and index of `id` among its siblings. */
 export function locateNode(
-  items: readonly TreeNode[],
+  items: readonly ITreeNode[],
   id: string
 ): { parentId: string | null; index: number } | null {
   const walk = (
-    nodes: readonly TreeNode[],
+    nodes: readonly ITreeNode[],
     parentId: string | null
   ): { parentId: string | null; index: number } | null => {
     for (const [index, node] of nodes.entries()) {
@@ -132,15 +132,15 @@ export function locateNode(
  * consumers don't each rebuild it. `index` addresses the sibling list
  * *after* the node has been lifted out. */
 export function moveNode(
-  items: readonly TreeNode[],
+  items: readonly ITreeNode[],
   id: string,
   parentId: string | null,
   index: number
-): TreeNode[] {
+): ITreeNode[] {
   // Dropping into the node's own subtree would orphan it — refuse.
   if (parentId !== null && containsNode(items, id, parentId)) return [...items]
-  let moved: TreeNode | null = null
-  const strip = (nodes: readonly TreeNode[]): TreeNode[] =>
+  let moved: ITreeNode | null = null
+  const strip = (nodes: readonly ITreeNode[]): ITreeNode[] =>
     nodes.flatMap((node) => {
       if (node.id === id) {
         moved = node
@@ -152,14 +152,14 @@ export function moveNode(
     })
   const stripped = strip(items)
   if (!moved) return [...items]
-  const captured = moved as TreeNode
+  const captured = moved as ITreeNode
 
   if (parentId === null) {
     const next = [...stripped]
     next.splice(Math.min(index, next.length), 0, captured)
     return next
   }
-  const insert = (nodes: readonly TreeNode[]): TreeNode[] =>
+  const insert = (nodes: readonly ITreeNode[]): ITreeNode[] =>
     nodes.map((node) => {
       if (node.id === parentId) {
         const children = [...(node.children ?? [])]

package/src/components/composed/types.ts

@@ -0,0 +1,9 @@
+export type TSocialProvider = "google" | "apple" | "github" | "x"
+
+
+export type * from "./action-bar/types"
+export type * from "./ai/types"
+export type * from "./chat/flowchart/types"
+export type * from "./chat/recommendation/types"
+export type * from "./user/types"
+export type * from "./verse/types"

package/src/components/composed/user/__tests__/message.test.tsx

@@ -0,0 +1,79 @@
+import { describe, expect, test } from "bun:test"
+import { render, screen } from "@testing-library/react"
+import User from "../index"
+import { Attachment } from "@/components/composed/chat/attachment"
+
+describe("User.Message", () => {
+  test("uses the user's direction and identity for the whole message", () => {
+    const { container } = render(
+      <User.Message
+        variant="info"
+        user={{
+          firstName: "Marcus",
+          lastName: "Lee",
+          role: "Reviewer",
+          direction: "recipient",
+          description: "10 min ago",
+        }}
+      >
+        Compare the passage.
+      </User.Message>
+    )
+    expect(
+      container
+        .querySelector('[data-slot="bubble"]')
+        ?.getAttribute("data-variant")
+    ).toBe("recipient")
+    expect(screen.getByText("Marcus Lee")).toBeDefined()
+    expect(screen.getByText("Reviewer")).toBeDefined()
+    expect(screen.getByText("10 min ago")).toBeDefined()
+    expect(
+      screen
+        .getByText("Compare the passage.")
+        .closest('[data-slot="bubble-message"]')
+    ).not.toBeNull()
+  })
+
+  test("continued messages omit the identity and keep reactions outside the surface", () => {
+    const { container } = render(
+      <User.Message
+        variant="info"
+        continued
+        user={{ firstName: "Jenny", direction: "sender" }}
+        reactions={{ reactions: [{ emoji: "❤️", label: "heart", count: 1 }] }}
+      >
+        A follow-up.
+      </User.Message>
+    )
+    expect(container.querySelector('[data-slot="bubble-header"]')).toBeNull()
+    expect(
+      container
+        .querySelector('[data-slot="bubble"]')
+        ?.hasAttribute("data-continued")
+    ).toBe(true)
+    expect(
+      screen
+        .getByRole("button", { name: "heart" })
+        .closest('[data-slot="bubble-message"]')
+    ).toBeNull()
+  })
+
+  test("attachment-only user messages retain the bare attachment surface", () => {
+    const { container } = render(
+      <User.Message
+        variant="info"
+        user={{ firstName: "Jenny", direction: "sender" }}
+      >
+        <Attachment kind="image" title="scan.jpg" src="/scan.jpg" />
+      </User.Message>
+    )
+    expect(
+      container
+        .querySelector('[data-slot="bubble-message"]')
+        ?.hasAttribute("data-unstyled")
+    ).toBe(true)
+    expect(
+      container.querySelector('[data-slot="preview-card-trigger"]')
+    ).not.toBeNull()
+  })
+})