@exegia/corpora-ui 3.0.0 → 4.0.0

package/src/components/composed/chat/chart/evilcharts/echarts-tooltip.tsx

@@ -1,125 +0,0 @@
-import { indicatorBackground, type ResolvedColors } from "./echarts-chart";
-import type { TooltipComponentOption } from "echarts/components";
-
-// ─────────────────────────────────────────────────────────────────────────────
-// Tooltip — the shared HTML shell/row primitives and the chart-agnostic option
-// fields. The tooltip DOM lives inside `[data-chart={id}]`, so the injected
-// `--color-*` vars and Tailwind classes resolve directly (no color read). Each
-// chart composes its own rows but shares the shell/styling and base option.
-// ─────────────────────────────────────────────────────────────────────────────
-
-export type TooltipVariant = "default" | "frosted-glass";
-export type TooltipRoundness = "sm" | "md" | "lg" | "xl";
-// Tooltip anchoring: "variable" follows both axes (ECharts default, current
-// behavior); "fixed" tracks the pointer's X (centered) but stays pinned near
-// the top (fixed Y).
-export type TooltipPosition = "fixed" | "variable";
-
-export const roundnessClass: Record<TooltipRoundness, string> = {
-  sm: "rounded-sm",
-  md: "rounded-md",
-  lg: "rounded-lg",
-  xl: "rounded-xl",
-};
-
-export const tooltipVariantClass: Record<TooltipVariant, string> = {
-  default: "bg-background",
-  "frosted-glass": "bg-background/50 backdrop-blur-md",
-};
-
-// The standard series indicator swatch — a rounded square filled with the
-// series' solid var or multi-stop gradient (indicatorBackground). A chart drops
-// this into a tooltipRow's `indicatorHtml`.
-export function tooltipIndicatorHtml(key: string, colorsCount: number): string {
-  return `<div class="h-2.5 w-2.5 shrink-0 rounded-[2px]" style="background:${indicatorBackground(key, colorsCount)}"></div>`;
-}
-
-// One tooltip row: indicator swatch + label/value pair. `dimmed` is a class
-// fragment (e.g. " opacity-30") appended to the row so the selection/hover dim
-// stays byte-identical to the inlined markup.
-export function tooltipRow({
-  indicatorHtml,
-  labelText,
-  valueText,
-  dimmed,
-}: {
-  indicatorHtml: string;
-  labelText: string;
-  valueText: string;
-  dimmed: string;
-}): string {
-  return `<div class="flex w-full flex-wrap items-center gap-2${dimmed}">
-          ${indicatorHtml}
-          <div class="flex flex-1 items-center justify-between gap-4 leading-none">
-            <span class="text-muted-foreground">${labelText}</span>
-            <span class="text-foreground font-mono font-medium tabular-nums">${valueText}</span>
-          </div>
-        </div>`;
-}
-
-// The outer tooltip surface — border, padding, shadow, roundness + variant
-// classes — wrapping the axis label and the composed rows.
-export function tooltipShell({
-  label,
-  body,
-  roundness,
-  variant,
-}: {
-  label: string;
-  body: string;
-  roundness: TooltipRoundness;
-  variant: TooltipVariant;
-}): string {
-  return `<div class="grid min-w-32 items-start gap-1.5 border border-border/50 px-2.5 py-1.5 text-xs shadow-xl ${roundnessClass[roundness]} ${tooltipVariantClass[variant]}">
-      <div class="font-medium text-primary">${label}</div>
-      <div class="grid gap-1.5">${body}</div>
-    </div>`;
-}
-
-// Maps the TooltipPosition prop onto the ECharts tooltip `position` field.
-// "variable" → undefined (default follow-both-axes, current behavior); "fixed" →
-// a callback that centers the tooltip on the pointer's X but pins it near the
-// top (fixed Y).
-export function resolveTooltipPosition(
-  position: TooltipPosition,
-): TooltipComponentOption["position"] {
-  if (position === "variable") return undefined;
-  return (point, _params, _dom, _rect, size) => [point[0] - size.contentSize[0] / 2, 8];
-}
-
-// The chart-agnostic tooltip option fields (show, trigger, confine,
-// background/border/padding/extraCssText, axisPointer, position). The chart
-// supplies only `formatter` and spreads this in. `axisPointerColor` is the
-// pre-resolved cursor-line color, so this helper needs no live token read.
-export function tooltipBaseOption(params: {
-  present: boolean;
-  cursor: boolean;
-  tokens: ResolvedColors["tokens"];
-  position: TooltipPosition;
-  axisPointerColor: string;
-  strokeWidth: number;
-}): TooltipComponentOption {
-  const { present, cursor, position, axisPointerColor, strokeWidth } = params;
-
-  return {
-    show: present,
-    trigger: "axis",
-    confine: true,
-    displayTransition: false,
-    backgroundColor: "transparent",
-    borderWidth: 0,
-    padding: 0,
-    extraCssText: "box-shadow:none;",
-    axisPointer: cursor
-      ? {
-          type: "line",
-          lineStyle: {
-            color: axisPointerColor,
-            width: strokeWidth,
-            type: [3, 3] as [number, number],
-          },
-        }
-      : { type: "none" },
-    position: resolveTooltipPosition(position),
-  };
-}

package/src/components/composed/chat/chart/index.ts

@@ -1,13 +0,0 @@
-export { ChartRoot as Chart, ChartRoot } from "./chart-root"
-export { useChartContext } from "./chart-context"
-export { useChartActions, useChartState } from "./use-chart-state"
-export {
-  chartSelectedKeyAtom,
-  chartStateAtom,
-  selectChartKeyAtom,
-  toggleChartKeyAtom,
-  resetChartAtom,
-  removeChartInstance,
-} from "./chart-atom"
-export { CHART_TYPE_LABEL, CHART_DEFAULT_HEIGHT } from "./constants"
-export type * from "./type"

package/src/components/composed/chat/chart/type.ts

@@ -1,88 +0,0 @@
-import type { useRender } from "@base-ui/react/use-render"
-import type * as React from "react"
-import type { Reference } from "@/components/atoms/reference"
-import type {
-  AreaProps,
-  CurveType,
-  TooltipProps,
-  XAxisProps,
-  YAxisProps,
-} from "./evilcharts/echarts-area-chart"
-import type { BarProps } from "./evilcharts/echarts-bar-chart"
-import type { LineProps } from "./evilcharts/echarts-line-chart"
-import type { PieProps } from "./evilcharts/echarts-pie-chart"
-import type { BrushProps } from "./evilcharts/echarts-brush"
-import type { EChartsRenderer } from "./evilcharts/echarts-chart"
-
-export type TChartType = "pie" | "area" | "line" | "bar"
-export type TChartVariant =
-  "default" | "stacked" | "percent" | "donut" | "horizontal"
-export type TChartInstanceId = string
-export type TChartDatum = {
-  label: string
-  [key: string]: string | number | null
-}
-export interface IChartSeries {
-  key: string
-  label: React.ReactNode
-  color?: string
-  format?: (value: number) => React.ReactNode
-  area?: Omit<AreaProps, "dataKey" | "children">
-  line?: Omit<LineProps, "dataKey" | "children">
-  bar?: Omit<BarProps, "dataKey">
-}
-export interface IChartState {
-  selectedKey: string | null
-}
-export interface IChartStateActions {
-  select: (key: string | null) => void
-  toggle: (key: string) => void
-  clearSelection: () => void
-  reset: () => void
-}
-export interface IChartProps extends Omit<
-  React.ComponentPropsWithoutRef<"div">,
-  "title"
-> {
-  type: TChartType
-  /** Unique within the current Jotai store. Omit for an isolated generated id. */
-  chartId?: TChartInstanceId
-  title?: React.ReactNode
-  subtitle?: React.ReactNode
-  badge?: React.ReactNode
-  reference?: React.ComponentProps<typeof Reference>
-  data: TChartDatum[]
-  series: IChartSeries[]
-  center?: { value: React.ReactNode; label?: React.ReactNode }
-  headerless?: boolean
-  /** Outer component width. Numbers are pixels; CSS lengths such as "100%" work. */
-  width?: React.CSSProperties["width"]
-  /** Outer component height, including header and legend. Plot fills remaining space. */
-  height?: React.CSSProperties["height"]
-  /** Explicit plot height takes precedence over filling the outer height. */
-  plotHeight?: React.CSSProperties["height"]
-  /** Replace the outer element using the coss/Base UI render API. */
-  render?: useRender.ComponentProps<"div">["render"]
-  /** stacked/percent: area or bar; horizontal: bar; donut: pie. */
-  variant?: TChartVariant
-  renderer?: EChartsRenderer
-  animation?: boolean
-  loading?: boolean
-  emptyContent?: React.ReactNode
-  showLegend?: boolean
-  interactive?: boolean
-  selectedKey?: string | null
-  defaultSelectedKey?: string | null
-  onSelectionChange?: (key: string | null) => void
-  curveType?: CurveType
-  grid?: boolean
-  xAxis?: boolean | XAxisProps
-  yAxis?: boolean | YAxisProps
-  tooltip?: boolean | TooltipProps
-  brush?: boolean | BrushProps
-  pie?: Omit<PieProps, "children">
-  /** ECharts options override generated options at the top level. */
-  chartOptions?: Record<string, unknown>
-  /** Selection methods; also available via useChartActions(chartId). */
-  ref?: React.Ref<IChartStateActions>
-}

package/src/components/composed/chat/chart/use-chart-state.ts

@@ -1,22 +0,0 @@
-"use client"
-import { useMemo } from "react"
-import { useAtomValue, useSetAtom } from "jotai"
-import {
-  chartStateAtom,
-  selectChartKeyAtom,
-  toggleChartKeyAtom,
-  resetChartAtom,
-} from "./chart-atom"
-import type { IChartStateActions, TChartInstanceId } from "./type"
-export function useChartState(id: TChartInstanceId) {
-  return useAtomValue(chartStateAtom(id))
-}
-export function useChartActions(id: TChartInstanceId): IChartStateActions {
-  const select = useSetAtom(selectChartKeyAtom(id))
-  const toggle = useSetAtom(toggleChartKeyAtom(id))
-  const reset = useSetAtom(resetChartAtom(id))
-  return useMemo(
-    () => ({ select, toggle, reset, clearSelection: () => select(null) }),
-    [select, toggle, reset]
-  )
-}

package/src/components/composed/chat/chart/use-chart.ts

@@ -1,70 +0,0 @@
-"use client"
-import {
-  useEffect,
-  useId,
-  useLayoutEffect,
-  useMemo,
-  useRef,
-  useState,
-} from "react"
-import { useStore } from "jotai"
-import {
-  chartConfigAtom,
-  chartSelectedKeyAtom,
-  removeChartInstance,
-} from "./chart-atom"
-import { useChartActions, useChartState } from "./use-chart-state"
-import type { IChartProps } from "./type"
-const useClientLayoutEffect =
-  typeof window === "undefined" ? useEffect : useLayoutEffect
-export function useChart(props: IChartProps) {
-  const generatedId = useId()
-  const id = props.chartId ?? generatedId
-  const store = useStore()
-  const [initial] = useState(props.defaultSelectedKey ?? null)
-  const lifecycle = useRef(0)
-  const keys = useMemo(
-    () =>
-      props.type === "pie"
-        ? props.data.map((row) => row.label)
-        : props.series.map((s) => s.key),
-    [props.type, props.data, props.series]
-  )
-  const state = useChartState(id)
-  const actions = useChartActions(id)
-  useClientLayoutEffect(() => {
-    const generation = ++lifecycle.current
-    store.set(chartSelectedKeyAtom(id), initial)
-    // Named instances persist until removeChartInstance; generated ids have no external consumers.
-    return () => {
-      queueMicrotask(() => {
-        if (!props.chartId && lifecycle.current === generation)
-          removeChartInstance(id)
-      })
-    }
-  }, [id, store, initial, props.chartId])
-  useClientLayoutEffect(() => {
-    store.set(chartConfigAtom(id), {
-      controlled: props.selectedKey !== undefined,
-      initial,
-      keys,
-      onChange: props.onSelectionChange,
-    })
-    const current =
-      props.selectedKey !== undefined
-        ? props.selectedKey
-        : store.get(chartSelectedKeyAtom(id))
-    store.set(
-      chartSelectedKeyAtom(id),
-      current !== null && keys.includes(current) ? current : null
-    )
-  }, [id, store, initial, keys, props.selectedKey, props.onSelectionChange])
-  const candidate =
-    props.selectedKey !== undefined ? props.selectedKey : state.selectedKey
-  return {
-    id,
-    selectedKey:
-      candidate !== null && keys.includes(candidate) ? candidate : null,
-    actions,
-  }
-}

package/src/components/composed/chat/chart/utils.ts

@@ -1,47 +0,0 @@
-import type { ChartConfig } from "./evilcharts/echarts-chart"
-import type { IChartSeries, TChartDatum, TChartType } from "./type"
-export function chartSeriesColor(series: IChartSeries, index: number) {
-  return series.color ?? `var(--chart-series-${(index % 5) + 1})`
-}
-export function formatChartValue(
-  series: IChartSeries | undefined,
-  value: unknown
-) {
-  return typeof value === "number" && series?.format
-    ? series.format(value)
-    : String(value ?? "—")
-}
-export function buildChartConfig(
-  type: TChartType,
-  data: TChartDatum[],
-  series: IChartSeries[]
-): ChartConfig {
-  const entries =
-    type === "pie"
-      ? data.map(
-          (row, index) =>
-            [
-              row.label,
-              {
-                label: row.label,
-                colors: { light: [`var(--chart-series-${(index % 5) + 1})`] },
-              },
-            ] as const
-        )
-      : series.map(
-          (item, index) =>
-            [
-              item.key,
-              {
-                label: item.label,
-                colors: { light: [chartSeriesColor(item, index)] },
-              },
-            ] as const
-        )
-  return Object.fromEntries(
-    entries.map(([key, value]) => [
-      key,
-      { ...value, colors: { light: [...value.colors.light] } },
-    ])
-  )
-}

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

@@ -1,3 +0,0 @@
-"use client"
-// Compatibility entry point; implementation follows the scaffold module layout.
-export * from "./chart/index"

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

@@ -1,123 +0,0 @@
-"use client"
-
-import { Copy, FileCode } from "lucide-react"
-import * as React from "react"
-import { cn } from "@/lib/utils"
-import { Card, CardFrame, CardFrameHeader } from "@/components/ui/card"
-import { Button } from "@/components/ui/button"
-import { SegmentedToggle } from "@/components/ui/chat"
-
-export interface ICodeDiffLine {
-  type?: "add" | "remove" | "context"
-  text: string
-}
-
-export interface ICodeBlockProps extends Omit<React.ComponentPropsWithoutRef<"div">, "onCopy"> {
-  filename?: React.ReactNode
-  code: string
-  /** Optional diff view; when absent the toggle is hidden. */
-  diff?: ICodeDiffLine[]
-  view?: "code" | "diff"
-  defaultView?: "code" | "diff"
-  onViewChange?: (view: "code" | "diff") => void
-  onCopy?: (code: string) => void
-  /** Extra keywords for the tokenizer. */
-  keywords?: string[]
-}
-
-const KEYWORDS = new Set(["export", "import", "from", "async", "await", "function", "const", "let", "var", "return", "if", "else", "null", "true", "false", "new", "class", "type", "interface"])
-function isIdentifierStart(char: string): boolean {
-  const code = char.charCodeAt(0)
-  return char === "$" || char === "_" || (code >= 65 && code <= 90) || (code >= 97 && code <= 122)
-}
-
-function isIdentifierPart(char: string): boolean {
-  const code = char.charCodeAt(0)
-  return isIdentifierStart(char) || (code >= 48 && code <= 57)
-}
-
-/** Minimal highlighter: string literals and keywords only, as in the design. */
-export function tokenize(line: string, keywords: ReadonlySet<string>): React.ReactNode[] {
-  const out: React.ReactNode[] = []
-  let i = 0
-  while (i < line.length) {
-    const start = i
-    const quote = line[i]
-
-    if (quote === '"' || quote === "'" || quote === "`") {
-      for (i++; i < line.length; i++) {
-        if (line[i] === "\\") i++
-        else if (line[i] === quote) {
-          i++
-          break
-        }
-      }
-      out.push(<span key={start} className="text-code-string">{line.slice(start, i)}</span>)
-      continue
-    }
-
-    if (isIdentifierStart(line[i])) {
-      i++
-      while (i < line.length && isIdentifierPart(line[i])) i++
-      const word = line.slice(start, i)
-      out.push(keywords.has(word) ? <span key={start} className="text-code-keyword">{word}</span> : word)
-      continue
-    }
-
-    i++
-    while (i < line.length && line[i] !== '"' && line[i] !== "'" && line[i] !== "`" && !isIdentifierStart(line[i])) i++
-    out.push(line.slice(start, i))
-  }
-  return out
-}
-
-const VIEWS = [{ value: "code", label: "Code" }, { value: "diff", label: "Diff" }] as const
-
-/**
- * Code card: filename header, Code | Diff toggle, Copy; gutter line numbers
- * and keyword / string tinting from the `--code-*` tokens.
- *
- * @sketch "Component / Code Block"
- */
-export function CodeBlock({ filename, code, diff, view, defaultView = "code", onViewChange, onCopy, keywords, className, ...props }: ICodeBlockProps): React.ReactElement {
-  const [internal, setInternal] = React.useState<"code" | "diff">(defaultView)
-  const current = view ?? internal
-  const kw = React.useMemo(() => (keywords ? new Set([...KEYWORDS, ...keywords]) : KEYWORDS), [keywords])
-  const lines: ICodeDiffLine[] = current === "diff" && diff ? diff : code.split("\n").map((text) => ({ text }))
-
-  return (
-    <CardFrame data-slot="code-block" data-view={current} className={cn("w-[420px] max-w-full", className)} {...props}>
-      <CardFrameHeader className="flex h-11 flex-row items-center gap-2 px-4 py-0">
-        <FileCode className="size-[15px] text-icon" />
-        <span className="flex-1 truncate font-mono text-[12px] font-semibold text-text-primary">{filename}</span>
-        {diff ? (
-          <SegmentedToggle
-            label="Code view"
-            options={VIEWS}
-            value={current}
-            onValueChange={(v) => {
-              if (view === undefined) setInternal(v)
-              onViewChange?.(v)
-            }}
-          />
-        ) : null}
-        <Button variant="ghost" size="xs" onClick={() => onCopy?.(code)} className="h-6 gap-1.5 rounded-md px-2 text-[11.5px] font-medium text-text-secondary hover:bg-surface-subtle hover:text-text-primary sm:h-6 [&_svg]:size-3.5! [&_svg]:opacity-100">
-          <Copy />Copy
-        </Button>
-      </CardFrameHeader>
-      <Card className="overflow-hidden">
-      <pre className="overflow-x-auto bg-surface-code py-3 font-mono text-[11.5px] leading-[21px] text-text-primary">
-        {lines.map((line, i) => (
-          <div
-            key={i}
-            className={cn("flex", line.type === "add" && "bg-semantic-success-subtle", line.type === "remove" && "bg-semantic-danger-subtle")}
-          >
-            <span className="w-10 shrink-0 select-none border-r border-border-default pr-2.5 text-right text-[11px] text-text-muted">{line.type === "add" ? "+" : line.type === "remove" ? "−" : i + 1}</span>
-            <span className="whitespace-pre pl-3">{tokenize(line.text, kw)}</span>
-          </div>
-        ))}
-      </pre>
-      </Card>
-    </CardFrame>
-  )
-}

package/src/components/composed/chat/composer/add-button.tsx

@@ -1,29 +0,0 @@
-import { Plus } from "lucide-react"
-import type { PopoverTriggerState } from "@base-ui/react"
-import type * as React from "react"
-import { cn } from "@/lib/utils"
-
-export function AddButton({
-  state,
-  className,
-  ...props
-}: React.ButtonHTMLAttributes<HTMLButtonElement> & {
-  state?: PopoverTriggerState
-}) {
-  return (
-    <button
-      {...props}
-      type="button"
-      aria-label="Add attachment"
-      data-cuelume-press=""
-      data-cuelume-release=""
-      className={cn(
-        "size-7 flex items-center justify-center rounded-lg text-muted-foreground hover:bg-foreground/5 hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring disabled:opacity-40",
-        state?.open && "bg-foreground/5",
-        className
-      )}
-    >
-      <Plus aria-hidden className="size-4" />
-    </button>
-  )
-}