@exegia/corpora-ui 3.0.0 → 3.1.0

package/src/components/composed/chat/__tests__/chart.test.tsx

@@ -1,316 +0,0 @@
-import { describe, expect, mock, test } from "bun:test"
-import { fireEvent, render, screen } from "@testing-library/react"
-
-import {
-  Chart,
-  useChartActions,
-  useChartState,
-  removeChartInstance,
-} from "../chart"
-import { StrictMode } from "react"
-import { Provider, createStore } from "jotai"
-import { chartSelectedKeyAtom } from "../chart/chart-atom"
-import { buildChartConfig } from "../chart/utils"
-import { createChartTooltip } from "../chart/chart-tooltip"
-
-function Controls({ id }: { id: string }) {
-  const actions = useChartActions(id)
-  const { selectedKey } = useChartState(id)
-  return (
-    <>
-      <output data-testid={`${id}-selection`}>{selectedKey ?? "none"}</output>
-      <button onClick={() => actions.select("v")}>Select {id}</button>
-      <button onClick={actions.clearSelection}>Clear {id}</button>
-      <button onClick={actions.reset}>Reset {id}</button>
-      <button onClick={() => actions.select("missing")}>Invalid {id}</button>
-    </>
-  )
-}
-
-const data = [
-  { label: "A", v: 1 },
-  { label: "B", v: 2 },
-]
-const series = [{ key: "v", label: "Value" }]
-
-describe("Chart", () => {
-  test("renders every type with its pill and legend", () => {
-    render(
-      <>
-        <Chart
-          type="pie"
-          title="Pie"
-          data={data}
-          series={series}
-          center={{ value: "3" }}
-        />
-        <Chart type="area" title="Area" data={data} series={series} />
-        <Chart type="line" title="Line" data={data} series={series} />
-        <Chart type="bar" title="Bar" data={data} series={series} />
-      </>
-    )
-    for (const t of ["Pie", "Area", "Line", "Bar"])
-      expect(screen.getAllByText(t).length).toBeGreaterThan(0)
-    expect(screen.getAllByText("Value").length).toBe(3)
-    expect(screen.getByText("3")).toBeDefined()
-  })
-
-  test("empty data keeps the chrome and drops the legend", () => {
-    const { container } = render(
-      <Chart type="bar" title="Empty" data={[]} series={series} />
-    )
-    expect(screen.getByText("Empty")).toBeDefined()
-    expect(container.querySelectorAll('[data-slot="legend-item"]').length).toBe(
-      0
-    )
-  })
-
-  test("uses the supplied reference instead of the type badge and routes selection", () => {
-    const onClick = mock(() => {})
-    const { container } = render(
-      <Chart
-        type="area"
-        title="Cross-reference coverage"
-        reference={{ children: "John 3:14–18", onClick }}
-        data={data}
-        series={series}
-      />
-    )
-    expect(screen.queryByText("Area")).toBeNull()
-    expect(
-      container.querySelectorAll('[data-slot="reference-chip"]').length
-    ).toBe(1)
-    fireEvent.click(screen.getByRole("button", { name: "John 3:14–18" }))
-    expect(onClick).toHaveBeenCalledTimes(1)
-  })
-})
-
-describe("Chart selection", () => {
-  test("named instances stay isolated and external actions update legend selection", () => {
-    const onChange = mock(() => {})
-    render(
-      <Provider>
-        <Chart
-          chartId="one"
-          type="bar"
-          data={data}
-          series={series}
-          interactive
-          onSelectionChange={onChange}
-        />
-        <Chart
-          chartId="two"
-          type="line"
-          data={data}
-          series={series}
-          interactive
-        />
-        <Controls id="one" />
-        <Controls id="two" />
-      </Provider>
-    )
-    fireEvent.click(screen.getByText("Select one"))
-    expect(screen.getByTestId("one-selection").textContent).toBe("v")
-    expect(screen.getByTestId("two-selection").textContent).toBe("none")
-    expect(
-      screen
-        .getAllByRole("button", { name: "Value" })[0]
-        .getAttribute("aria-pressed")
-    ).toBe("true")
-    expect(onChange).toHaveBeenCalledTimes(1)
-    fireEvent.click(screen.getByText("Invalid one"))
-    expect(onChange).toHaveBeenCalledTimes(1)
-    fireEvent.click(screen.getByText("Clear one"))
-    expect(screen.getByTestId("one-selection").textContent).toBe("none")
-  })
-  test("controlled props remain authoritative until parent accepts selection", () => {
-    const onChange = mock(() => {})
-    const { rerender } = render(
-      <Chart
-        type="area"
-        data={data}
-        series={series}
-        interactive
-        selectedKey={null}
-        onSelectionChange={onChange}
-      />
-    )
-    fireEvent.click(screen.getByRole("button", { name: "Value" }))
-    expect(onChange).toHaveBeenCalledWith("v")
-    expect(
-      screen.getByRole("button", { name: "Value" }).getAttribute("aria-pressed")
-    ).toBe("false")
-    rerender(
-      <Chart
-        type="area"
-        data={data}
-        series={series}
-        interactive
-        selectedKey="v"
-        onSelectionChange={onChange}
-      />
-    )
-    expect(
-      screen.getByRole("button", { name: "Value" }).getAttribute("aria-pressed")
-    ).toBe("true")
-  })
-  test("reset restores the default and removed series clear selection", () => {
-    const store = createStore()
-    const { rerender } = render(
-      <Provider store={store}>
-        <Chart
-          chartId="reset"
-          type="bar"
-          data={data}
-          series={series}
-          defaultSelectedKey="v"
-        />
-        <Controls id="reset" />
-      </Provider>
-    )
-    fireEvent.click(screen.getByText("Clear reset"))
-    fireEvent.click(screen.getByText("Reset reset"))
-    expect(store.get(chartSelectedKeyAtom("reset"))).toBe("v")
-    rerender(
-      <Provider store={store}>
-        <Chart
-          chartId="reset"
-          type="bar"
-          data={data}
-          series={[]}
-          defaultSelectedKey="v"
-        />
-      </Provider>
-    )
-    expect(store.get(chartSelectedKeyAtom("reset"))).toBeNull()
-  })
-  test("generated identity survives StrictMode effect replay", async () => {
-    render(
-      <StrictMode>
-        <Chart type="line" data={data} series={series} interactive />
-      </StrictMode>
-    )
-    await Promise.resolve()
-    fireEvent.click(screen.getByRole("button", { name: "Value" }))
-    expect(
-      screen.getByRole("button", { name: "Value" }).getAttribute("aria-pressed")
-    ).toBe("true")
-  })
-  test("pie selection uses category labels", () => {
-    const callback = mock(() => {})
-    render(
-      <Chart
-        type="pie"
-        data={data}
-        series={series}
-        interactive
-        onSelectionChange={callback}
-      />
-    )
-    fireEvent.click(screen.getByRole("button", { name: "A 1" }))
-    expect(callback).toHaveBeenCalledWith("A")
-  })
-  test("instance removal releases the atom family", () => {
-    const original = chartSelectedKeyAtom("removed")
-    removeChartInstance("removed")
-    expect(chartSelectedKeyAtom("removed")).not.toBe(original)
-  })
-})
-describe("Chart adapters", () => {
-  test("config preserves CSS tokens and custom series colors", () => {
-    expect(
-      buildChartConfig("bar", data, [{ ...series[0], color: "var(--primary)" }])
-        .v.colors?.light
-    ).toEqual(["var(--primary)"])
-    expect(Object.keys(buildChartConfig("pie", data, series))).toEqual([
-      "A",
-      "B",
-    ])
-  })
-  test("tooltip escapes data and preserves React formatters", () => {
-    const tooltip = createChartTooltip("bar", data, [
-      {
-        key: "v",
-        label: "<script>",
-        format: (value) => <strong>{value}%</strong>,
-      },
-    ])
-    const html = tooltip({ seriesIndex: 0, dataIndex: 1 })
-    expect(html).toContain("&lt;script&gt;")
-    expect(html).toContain("<strong>2%</strong>")
-  })
-})
-
-test("tooltip defaults to frosted glass with one surface shadow", () => {
-  const params = { seriesIndex: 0, dataIndex: 1 }
-  const html = createChartTooltip("bar", data, series)(params)
-  expect(html).toContain("bg-background/50")
-  expect(html).toContain("backdrop-blur-md")
-  expect(html).toContain("box-shadow:0 4px 12px rgb(0 0 0 / 0.12)")
-  const solid = createChartTooltip("bar", data, series, { variant: "default" })(
-    params
-  )
-  expect(solid).not.toContain("backdrop-blur-md")
-})
-
-describe("Chart consumer layout", () => {
-  test("accepts CSS dimensions and replaces the framed root", () => {
-    const { container } = render(
-      <Chart
-        type="bar"
-        data={[]}
-        series={series}
-        width="100%"
-        height={360}
-        render={<section aria-label="Research chart" />}
-      />
-    )
-    const root = screen.getByRole("region", { name: "Research chart" })
-    expect(root.getAttribute("data-slot")).toBe("chart")
-    expect(root.style.width).toBe("100%")
-    expect(root.style.height).toBe("360px")
-    expect(
-      (container.querySelector('[role="group"]') as HTMLElement).style.height
-    ).toBe("100%")
-  })
-  test("explicit plot height and consumer styles take precedence", () => {
-    const { container } = render(
-      <Chart
-        type="bar"
-        data={[]}
-        series={series}
-        width={320}
-        height={360}
-        plotHeight="12rem"
-        style={{ width: "90%" }}
-      />
-    )
-    expect(
-      (container.querySelector('[data-slot="chart"]') as HTMLElement).style
-        .width
-    ).toBe("90%")
-    expect(
-      (container.querySelector('[role="group"]') as HTMLElement).style.height
-    ).toBe("12rem")
-  })
-  test("custom components receive props and children in headerless mode", () => {
-    function Surface(props: React.ComponentProps<"section">) {
-      return <section {...props} data-surface="custom" />
-    }
-    render(
-      <Chart
-        type="pie"
-        data={[]}
-        series={series}
-        headerless
-        render={<Surface aria-label="Bare chart" />}
-        width={480}
-        height={240}
-      />
-    )
-    const root = screen.getByRole("region", { name: "Bare chart" })
-    expect(root.getAttribute("data-surface")).toBe("custom")
-    expect(root.style.width).toBe("480px")
-    expect(screen.getByRole("status").textContent).toBe("No data")
-  })
-})

package/src/components/composed/chat/__tests__/code-block.test.tsx

@@ -1,12 +0,0 @@
-import { expect, test } from "bun:test"
-import { renderToStaticMarkup } from "react-dom/server"
-
-import { tokenize } from "../code-block"
-
-test("tokenize highlights keywords and escaped strings in linear time", () => {
-  const source = `const value = "${'\\"'.repeat(10_000)}"`
-  const html = renderToStaticMarkup(<>{tokenize(source, new Set(["const"]))}</>)
-
-  expect(html).toContain('class="text-code-keyword">const</span>')
-  expect(html).toContain('class="text-code-string">')
-})

package/src/components/composed/chat/__tests__/composer-attachments.test.tsx

@@ -1,101 +0,0 @@
-import { describe, expect, mock, test } from "bun:test"
-import { act, fireEvent, render, screen } from "@testing-library/react"
-import { Provider } from "jotai"
-import userEvent from "@testing-library/user-event"
-
-import { Composer, type TComposerAttachment } from "../composer"
-
-const SEED: TComposerAttachment[] = [
-  { id: "a", kind: "document", title: "Q3.pdf", meta: "PDF" },
-  { id: "b", kind: "image", title: "IMG.jpg" },
-]
-
-describe("Composer attachments", () => {
-  test("renders the tray, removes a chip and sends with ⌘↵", async () => {
-    const onSubmit = mock(() => {})
-    render(
-      <Provider>
-        <Composer
-          attachments={SEED}
-          defaultValue="hello"
-          onSubmit={onSubmit}
-          safetyNote={null}
-        />
-      </Provider>
-    )
-    // The tray seeds from a passive effect; flush the re-render it schedules.
-    await act(async () => {})
-    expect(screen.getAllByRole("button", { name: "Remove" }).length).toBe(2)
-    fireEvent.click(screen.getAllByRole("button", { name: "Remove" })[0])
-    expect(screen.queryByText("Q3.pdf")).toBeNull()
-
-    fireEvent.keyDown(screen.getByRole("textbox", { name: "Message" }), {
-      key: "Enter",
-      metaKey: true,
-    })
-    expect(onSubmit).toHaveBeenCalledTimes(1)
-    const [draft, , attachments] = onSubmit.mock.calls[0] as unknown as [
-      string,
-      string,
-      TComposerAttachment[],
-    ]
-    expect(draft).toBe("hello")
-    expect(attachments.map((a) => a.id)).toEqual(["b"])
-  })
-
-  test("empty tray renders no tray row", () => {
-    const { container } = render(
-      <Provider>
-        <Composer safetyNote={null} />
-      </Provider>
-    )
-    expect(container.querySelector('[data-slot="composer-tray"]')).toBeNull()
-  })
-
-  test("selects local files and submits an attachment-only message once", async () => {
-    const user = userEvent.setup()
-    const onSubmit = mock(() => {})
-    const onFilesChange = mock(() => {})
-    render(
-      <Provider>
-        <Composer onSubmit={onSubmit} onFilesChange={onFilesChange} />
-      </Provider>
-    )
-    const file = new File(["passage"], "passage.txt", { type: "text/plain" })
-    await user.upload(screen.getByLabelText("Attach files"), file)
-    expect(onFilesChange).toHaveBeenCalledWith([file])
-    expect(screen.getByText("passage.txt")).toBeDefined()
-    await user.click(screen.getByRole("button", { name: "Send message" }))
-    expect(onSubmit).toHaveBeenCalledWith("", "answer", [
-      expect.objectContaining({ file, title: "passage.txt" }),
-    ])
-    expect(screen.queryByText("passage.txt")).toBeNull()
-    expect(
-      screen
-        .getByRole("button", { name: "Send message" })
-        .hasAttribute("disabled")
-    ).toBe(true)
-  })
-
-  test("preserves image, video and audio file types when sending", async () => {
-    const user = userEvent.setup()
-    const onSubmit = mock(() => {})
-    render(
-      <Provider>
-        <Composer onSubmit={onSubmit} />
-      </Provider>
-    )
-    const files = [
-      new File(["image"], "scan.JPG"),
-      new File(["video"], "lecture.mp4", { type: "video/mp4" }),
-      new File(["audio"], "reading.m4a", { type: "audio/mp4" }),
-    ]
-    await user.upload(screen.getByLabelText("Attach files"), files)
-    await user.click(screen.getByRole("button", { name: "Send message" }))
-    expect(onSubmit).toHaveBeenCalledWith("", "answer", [
-      expect.objectContaining({ kind: "image", file: files[0] }),
-      expect.objectContaining({ kind: "media", audio: false, file: files[1] }),
-      expect.objectContaining({ kind: "media", audio: true, file: files[2] }),
-    ])
-  })
-})

package/src/components/composed/chat/__tests__/composer.test.tsx

@@ -1,248 +0,0 @@
-import { describe, expect, mock, test } from "bun:test"
-import { act, fireEvent, render, screen } from "@testing-library/react"
-import userEvent from "@testing-library/user-event"
-import { Provider } from "jotai"
-
-import {
-  CommandMenu,
-  Composer,
-  SuggestedPrompts,
-  type IComposerSuggestionsProps,
-} from "../composer"
-import { SuggestedPrompt } from "@/components/composed/ai/suggested-prompt"
-
-describe("Composer", () => {
-  test("shows the prompt bar controls at rest and preserves keyboard sending", async () => {
-    const user = userEvent.setup()
-    const onSubmit = mock(() => {})
-    render(
-      <Provider>
-        <Composer
-          ComposerMenu={() => <CommandMenu items={[]} />}
-          onSubmit={onSubmit}
-          safetyNote={null}
-        />
-      </Provider>
-    )
-
-    expect(screen.queryByText("to send message")).toBeNull()
-    expect(
-      screen
-        .getByRole("button", { name: "Send message" })
-        .hasAttribute("disabled")
-    ).toBe(true)
-    expect(screen.getByRole("combobox", { name: "Choose model" })).toBeDefined()
-
-    const field = screen.getByRole("textbox", { name: "Message" })
-    await user.click(field)
-    expect(
-      await screen.findByRole("button", { name: "Send message" })
-    ).toBeDefined()
-    expect(screen.getByRole("button", { name: "Add attachment" })).toBeDefined()
-
-    await user.type(field, "Validate ¶12")
-    await user.keyboard("{Meta>}{Enter}{/Meta}")
-    expect(onSubmit).toHaveBeenCalledWith("Validate ¶12", "answer", [])
-  })
-
-  test("folds the suggested prompts behind the disclosure and routes a pick", async () => {
-    const user = userEvent.setup()
-    const onSelect = mock(() => {})
-    const Suggestions = (props: IComposerSuggestionsProps) => (
-      <SuggestedPrompts onOpenChange={props.onOpenChange} open={props.open}>
-        <SuggestedPrompt onSelect={onSelect}>Check ¶12</SuggestedPrompt>
-      </SuggestedPrompts>
-    )
-    render(
-      <Provider>
-        <Composer safetyNote={null} Suggestions={Suggestions} />
-      </Provider>
-    )
-
-    const trigger = screen.getByRole("button", { name: /Suggestions \(1\)/ })
-    expect(trigger.getAttribute("aria-expanded")).toBe("true")
-
-    await user.click(await screen.findByRole("button", { name: /Check ¶12/ }))
-    expect(onSelect).toHaveBeenCalledTimes(1)
-
-    // Only the disclosure state is asserted: the panel leaves through an
-    // AnimatePresence exit, and happy-dom's stubbed `Element.animate` never
-    // finishes it, so the row stays mounted here but not in a browser.
-    await user.click(trigger)
-    expect(trigger.getAttribute("aria-expanded")).toBe("false")
-  })
-
-  test("shows Stop while streaming and routes it to onStop", async () => {
-    const user = userEvent.setup()
-    const onStop = mock(() => {})
-    render(
-      <Provider>
-        <Composer expanded isStreaming onStop={onStop} safetyNote={null} />
-      </Provider>
-    )
-    await user.click(screen.getByRole("button", { name: "Stop" }))
-    expect(onStop).toHaveBeenCalledTimes(1)
-  })
-
-  test("filters commands and sources and inserts a keyboard selection without sending", async () => {
-    const user = userEvent.setup()
-    const onSubmit = mock(() => {})
-    const onCommand = mock(() => {})
-    const onSourceSelect = mock(() => {})
-    const command = {
-      id: "validate",
-      label: "/validate",
-      insertText: "/validate ",
-    }
-    const source = { id: "corpus", label: "Corpus", insertText: "@corpus " }
-    render(
-      <Provider>
-        <Composer
-          commands={[command, { id: "compare", label: "/compare" }]}
-          sources={[source]}
-          onSubmit={onSubmit}
-          onCommand={onCommand}
-          onSourceSelect={onSourceSelect}
-        />
-      </Provider>
-    )
-    const field = screen.getByRole("textbox", {
-      name: "Message",
-    }) as HTMLTextAreaElement
-    await user.type(field, "/val")
-    expect(
-      await screen.findByRole("option", { name: "/validate" })
-    ).toBeDefined()
-    expect(screen.queryByRole("option", { name: "/compare" })).toBeNull()
-    await user.keyboard("{Tab}")
-    expect(field.value).toBe("/validate ")
-    expect(onCommand).toHaveBeenCalledWith(command)
-    await user.type(field, "@cor")
-    await user.keyboard("{Enter}")
-    expect(field.value).toBe("/validate @corpus ")
-    expect(onSourceSelect).toHaveBeenCalledWith(source)
-    expect(onSubmit).not.toHaveBeenCalled()
-  })
-
-  test("changes the selected model through the picker", async () => {
-    const user = userEvent.setup()
-    const onModelChange = mock(() => {})
-    render(
-      <Provider>
-        <Composer
-          models={[
-            { id: "auto", label: "Auto" },
-            { id: "reasoning", label: "Reasoning" },
-          ]}
-          onModelChange={onModelChange}
-        />
-      </Provider>
-    )
-    await user.click(screen.getByRole("combobox", { name: "Choose model" }))
-    await user.click(await screen.findByRole("option", { name: "Reasoning" }))
-    expect(onModelChange).toHaveBeenCalledWith("reasoning")
-    expect(
-      screen.getByRole("combobox", { name: "Choose model" }).textContent
-    ).toContain("Reasoning")
-  })
-
-  test("keeps Shift+Enter and IME input from submitting and leaves controlled text to the parent", () => {
-    const onSubmit = mock(() => {})
-    const onValueChange = mock(() => {})
-    render(
-      <Provider>
-        <Composer
-          value="Controlled draft"
-          onSubmit={onSubmit}
-          onValueChange={onValueChange}
-        />
-      </Provider>
-    )
-    const field = screen.getByRole("textbox", {
-      name: "Message",
-    }) as HTMLTextAreaElement
-    fireEvent.keyDown(field, { key: "Enter", shiftKey: true })
-    fireEvent.keyDown(field, { key: "Enter", isComposing: true })
-    expect(onSubmit).not.toHaveBeenCalled()
-    fireEvent.keyDown(field, { key: "Enter" })
-    expect(onSubmit).toHaveBeenCalledWith("Controlled draft", "answer", [])
-    expect(field.value).toBe("Controlled draft")
-  })
-
-  test("dictation appends final results and is cancelled on send", async () => {
-    const original = Object.getOwnPropertyDescriptor(
-      window,
-      "SpeechRecognition"
-    )
-    const recognizers: MockRecognition[] = []
-    class MockRecognition {
-      continuous = false
-      interimResults = false
-      lang = ""
-      onresult:
-        | ((event: {
-            resultIndex: number
-            results: { isFinal: boolean; 0: { transcript: string } }[]
-          }) => void)
-        | null = null
-      onerror: ((event: { error: string }) => void) | null = null
-      onend: (() => void) | null = null
-      start = mock(() => {})
-      stop = mock(() => {})
-      abort = mock(() => {})
-      constructor() {
-        recognizers.push(this)
-      }
-    }
-    Object.defineProperty(window, "SpeechRecognition", {
-      configurable: true,
-      value: MockRecognition,
-    })
-    const onSubmit = mock(() => {})
-    const view = render(
-      <Provider>
-        <Composer defaultValue="Please" onSubmit={onSubmit} />
-      </Provider>
-    )
-    try {
-      fireEvent.click(screen.getByRole("button", { name: "Start dictation" }))
-      const recognizer = recognizers[0]
-      expect(recognizer!.start).toHaveBeenCalledTimes(1)
-      await act(async () => {
-        recognizer!.onresult?.({
-          resultIndex: 0,
-          results: [
-            { isFinal: false, 0: { transcript: "ignore" } },
-            { isFinal: true, 0: { transcript: "validate this" } },
-          ],
-        })
-      })
-      expect(
-        (
-          screen.getByRole("textbox", {
-            name: "Message",
-          }) as HTMLTextAreaElement
-        ).value
-      ).toBe("Please validate this")
-      fireEvent.click(screen.getByRole("button", { name: "Send message" }))
-      expect(onSubmit).toHaveBeenCalledWith(
-        "Please validate this",
-        "answer",
-        []
-      )
-      expect(recognizer!.abort).toHaveBeenCalledTimes(1)
-      expect(recognizer!.onresult).toBeNull()
-      expect(
-        (
-          screen.getByRole("textbox", {
-            name: "Message",
-          }) as HTMLTextAreaElement
-        ).value
-      ).toBe("")
-    } finally {
-      view.unmount()
-      if (original) Object.defineProperty(window, "SpeechRecognition", original)
-      else Reflect.deleteProperty(window, "SpeechRecognition")
-    }
-  })
-})