@qoretechnologies/reqraft 0.10.62 → 0.10.63-pr.142.g0b675cd

package/src/components/smartEditor/useLspDiagnosticDecorations.ts

@@ -1,125 +0,0 @@
-// Copyright 2026 Qore Technologies, s.r.o.
-// Slate `decorate` hook that converts LSP `publishDiagnostics` payloads
-// into per-leaf decoration ranges. Each range carries `error: true`
-// plus the diagnostic's `message` and `severity`, which the editor's
-// `customRenderLeaf` can pick up to draw the inline wavy underline /
-// hover-title state. Composes with a caller-supplied syntax-highlight
-// `decorate` in the wrapper (e.g. `DpqlEditor.tsx` merges the two).
-
-import { useCallback, useMemo } from 'react';
-import { NodeEntry, Range, Text } from 'slate';
-import { ILspDiagnostic } from '../../utils/lspClient.types';
-import { lspPositionToOffset } from './helpers';
-import { ISlateConverter, ISlateElement } from './types';
-
-/** Marks added to decoration ranges so `customRenderLeaf` can style them. */
-export interface IDiagnosticMarks {
-  /** Truthy when this leaf falls inside a diagnostic's reported range. */
-  error: true;
-  /** The diagnostic's user-facing message (rendered in a hover-title). */
-  errorMessage: string;
-  /** LSP `DiagnosticSeverity` — 1 Error, 2 Warning, 3 Info, 4 Hint. */
-  severity: number;
-}
-
-/**
- * Build a Slate `decorate` function that paints diagnostic spans over
- * the document.
- *
- * The function is recomputed whenever `diagnostics` or `nodes` change,
- * and per-call iteration over diagnostics is `O(diagnostics × text-leaves)` —
- * fine for the editor scale we target (typical document under a few
- * hundred characters, a handful of diagnostics).
- *
- * @param diagnostics  Most-recent `session.diagnostics`.
- * @param converter    The same converter passed to `SmartEditor`. We use
- *                     it to compute the plain-text projection and the
- *                     plain-text offset of any node — both required to
- *                     intersect a diagnostic's `{line, character}` LSP
- *                     range with each Slate text leaf.
- * @param nodes        Current Slate document. The hook captures this in
- *                     a closure; pass the same `slateValue` you hand
- *                     `ReqoreRichTextEditor`.
- */
-export function useLspDiagnosticDecorations(
-  diagnostics: ILspDiagnostic[],
-  converter: ISlateConverter,
-  nodes: ISlateElement[]
-): (entry: NodeEntry) => Range[] {
-  // Pre-compute the plain-text projection AND each diagnostic's
-  // `[startOffset, endOffset]` once per render — the alternative is
-  // recomputing both inside the decorate callback for every text leaf
-  // Slate walks, which is wasteful.
-  const plainText = useMemo(
-    () => converter.fromSlateNodes(nodes),
-    [converter, nodes]
-  );
-  const diagOffsets = useMemo(
-    () =>
-      diagnostics.map((d) => ({
-        startOffset: lspPositionToOffset(plainText, d.range.start),
-        endOffset: lspPositionToOffset(plainText, d.range.end),
-        message: d.message,
-        severity: d.severity ?? 1,
-      })),
-    [diagnostics, plainText]
-  );
-
-  return useCallback(
-    (entry: NodeEntry) => {
-      if (diagOffsets.length === 0) return [];
-      const [node, path] = entry;
-      if (!Text.isText(node)) return [];
-
-      // Where this leaf starts/ends in the plain-text projection. The
-      // converter's `selectionToOffset` with `anchorOffset: 0` gives the
-      // leaf's start; add `node.text.length` for the end.
-      const leafStart = converter.selectionToOffset(
-        nodes,
-        path as number[],
-        0
-      );
-      const leafEnd = leafStart + node.text.length;
-
-      const ranges: Range[] = [];
-      for (const diag of diagOffsets) {
-        const overlapStart = Math.max(leafStart, diag.startOffset);
-        const overlapEnd = Math.min(leafEnd, diag.endOffset);
-        if (overlapStart >= overlapEnd) continue;
-        // Emit a Slate `Range` (anchor + focus) over the offset window
-        // INSIDE this leaf. Slate then applies the extra marks
-        // (`error`, `errorMessage`, `severity`) to the styled span.
-        ranges.push({
-          anchor: { path, offset: overlapStart - leafStart },
-          focus: { path, offset: overlapEnd - leafStart },
-          error: true,
-          errorMessage: diag.message,
-          severity: diag.severity,
-        } as unknown as Range);
-      }
-      return ranges;
-    },
-    [diagOffsets, converter, nodes]
-  );
-}
-
-/**
- * Map LSP `DiagnosticSeverity` → Reqore intent. Useful for the
- * `ReqoreMessage` panel below the editor:
- *   1 Error   → `'danger'`
- *   2 Warning → `'warning'`
- *   3 Info    → `'info'`
- *   4 Hint    → `'info'`
- */
-export function severityToIntent(
-  severity?: number
-): 'danger' | 'warning' | 'info' {
-  switch (severity) {
-    case 1:
-      return 'danger';
-    case 2:
-      return 'warning';
-    default:
-      return 'info';
-  }
-}

package/src/components/smartEditor/useLspHover.ts

@@ -1,230 +0,0 @@
-// Copyright 2026 Qore Technologies, s.r.o.
-// Hover-tooltip support for SmartEditor. Listens for `mousemove` on
-// the editor's contenteditable element, debounces to 300ms idle, then
-// asks the LSP for hover info at that mouse position. The consumer
-// gets back `{ hoverContent, hoverPosition }` and renders a popover.
-//
-// Position mapping: mouse coords → DOM caret range
-// (`caretRangeFromPoint`) → Slate `Point` → plain-text offset (via the
-// converter) → LSP `{line, character}`. Pure math is split into
-// `slatePointToLspPosition` so it can be unit-tested without a DOM.
-
-import { debounce } from 'lodash';
-import { RefObject, useCallback, useEffect, useRef, useState } from 'react';
-import { BaseEditor, Point } from 'slate';
-import { HistoryEditor } from 'slate-history';
-import { ReactEditor } from 'slate-react';
-import { ILspMarkupContent } from '../../utils/lspClient.types';
-import { offsetToLspPosition } from './helpers';
-import { ISlateConverter, ISlateElement } from './types';
-import type { IUseLspSessionResult } from './useLspSession';
-
-/**
- * Pure math: Slate point + Slate document → LSP `{line, character}`
- * position in the plain-text projection. Extracted from the hook so it
- * can be tested without a DOM / Slate editor instance.
- */
-export function slatePointToLspPosition(
-  point: { path: number[]; offset: number },
-  nodes: ISlateElement[],
-  converter: ISlateConverter
-): { line: number; character: number } {
-  const plainText = converter.fromSlateNodes(nodes);
-  const offset = converter.selectionToOffset(nodes, point.path, point.offset);
-  return offsetToLspPosition(plainText, offset);
-}
-
-/**
- * Resolve mouse-event viewport coordinates into a Slate `Point`. Uses
- * the standard `document.caretRangeFromPoint` (WebKit / Chromium) with
- * a Firefox fallback to `caretPositionFromPoint`. Returns `null` when
- * the point lies outside any text node or Slate can't map the DOM
- * position back into its tree (e.g. inside a void inline).
- */
-function mousePositionToSlatePoint(
-  editor: BaseEditor & ReactEditor & HistoryEditor,
-  clientX: number,
-  clientY: number
-): Point | null {
-  let domRange: Range | null = null;
-
-  // Chromium / WebKit
-  if (typeof (document as any).caretRangeFromPoint === 'function') {
-    domRange = (document as any).caretRangeFromPoint(clientX, clientY);
-  } else if (typeof (document as any).caretPositionFromPoint === 'function') {
-    // Firefox shape: `{ offsetNode, offset }`
-    const pos = (document as any).caretPositionFromPoint(clientX, clientY);
-    if (pos) {
-      domRange = document.createRange();
-      domRange.setStart(pos.offsetNode, pos.offset);
-      domRange.collapse(true);
-    }
-  }
-  if (!domRange) return null;
-
-  try {
-    return ReactEditor.toSlatePoint(
-      editor,
-      [domRange.startContainer, domRange.startOffset],
-      { exactMatch: false, suppressThrow: true } as any
-    );
-  } catch {
-    return null;
-  }
-}
-
-export interface IUseLspHoverOptions {
-  /** Default `true`. Set to `false` to disable the mousemove listener. */
-  enabled?: boolean;
-  /** Debounce window before issuing the LSP request. Default 300ms. */
-  debounceMs?: number;
-}
-
-export interface IUseLspHoverResult {
-  /** Markup content returned by the LSP, or `null` when no hover info. */
-  hoverContent: ILspMarkupContent | null;
-  /** Viewport-coordinate position to anchor the popover. */
-  hoverPosition: { left: number; top: number } | null;
-  /** Imperatively dismiss the current hover popover. */
-  clearHover: () => void;
-}
-
-/**
- * Hover-tooltip state for the SmartEditor. Attaches a `mousemove`
- * listener to the editor's contenteditable element via the supplied
- * editor ref and resolves LSP hover content under the cursor when the
- * mouse goes idle for `debounceMs`.
- */
-export function useLspHover(
-  session: IUseLspSessionResult,
-  editorRef: RefObject<
-    (BaseEditor & ReactEditor & HistoryEditor) | null
-  >,
-  converter: ISlateConverter,
-  options: IUseLspHoverOptions = {}
-): IUseLspHoverResult {
-  const { enabled = true, debounceMs = 300 } = options;
-
-  const [hoverContent, setHoverContent] = useState<ILspMarkupContent | null>(
-    null
-  );
-  const [hoverPosition, setHoverPosition] = useState<{
-    left: number;
-    top: number;
-  } | null>(null);
-
-  // Track the latest request id so a slow in-flight response can't
-  // overwrite a newer hover state (e.g. the user moved away before the
-  // server replied).
-  const requestIdRef = useRef(0);
-
-  const clearHover = useCallback(() => {
-    setHoverContent(null);
-    setHoverPosition(null);
-  }, []);
-
-  // Debounced fetch. Re-created in the effect below whenever any of
-  // its inputs change. Started as a no-op so the ref is always a
-  // function — avoids null-checks in the mousemove listener. The dep
-  // array lists the stable primitives inside `session`, not the object
-  // itself — `useLspSession` rebuilds its return object every render,
-  // which would cancel and recreate this debounce on every parent
-  // re-render (see useLspSemanticTokens for the original incident).
-  const fetchHover = useRef<ReturnType<typeof debounce>>(
-    debounce(() => undefined)
-  );
-
-  useEffect(() => {
-    fetchHover.current.cancel();
-    fetchHover.current = debounce(async (clientX: number, clientY: number) => {
-      const editor = editorRef.current;
-      const client = session.client;
-      if (
-        !enabled ||
-        !editor ||
-        !client ||
-        !session.isReady ||
-        !session.isContextReady
-      )
-        return;
-
-      const point = mousePositionToSlatePoint(editor, clientX, clientY);
-      if (!point) {
-        clearHover();
-        return;
-      }
-
-      const nodes = editor.children as ISlateElement[];
-      const { line, character } = slatePointToLspPosition(
-        { path: point.path as number[], offset: point.offset },
-        nodes,
-        converter
-      );
-
-      const reqId = ++requestIdRef.current;
-      try {
-        const content = await client.getHover(line, character);
-        if (reqId !== requestIdRef.current) return; // stale
-        if (!content) {
-          clearHover();
-          return;
-        }
-        setHoverContent(content);
-        // Anchor the popover at the mouse cursor. The design doc calls
-        // for "token center" — that requires building a Range over the
-        // word boundaries and reading its rect. Defer to a follow-up
-        // refinement; mouse-coord positioning already feels natural.
-        setHoverPosition({ left: clientX, top: clientY });
-      } catch {
-        clearHover();
-      }
-    }, debounceMs);
-    return () => fetchHover.current.cancel();
-  }, [
-    session.client,
-    session.isReady,
-    session.isContextReady,
-    editorRef,
-    converter,
-    enabled,
-    debounceMs,
-    clearHover,
-  ]);
-
-  useEffect(() => {
-    if (!enabled) return undefined;
-    const editor = editorRef.current;
-    if (!editor) return undefined;
-    let dom: HTMLElement | null = null;
-    try {
-      dom = ReactEditor.toDOMNode(editor, editor) as HTMLElement;
-    } catch {
-      return undefined;
-    }
-    if (!dom) return undefined;
-
-    const onMove = (e: MouseEvent) => {
-      // Cancel any pending hover the moment the mouse moves — the
-      // previous coords are stale. The debounced trailing call only
-      // fires after `debounceMs` of true idle.
-      fetchHover.current.cancel();
-      fetchHover.current(e.clientX, e.clientY);
-    };
-    const onLeave = () => {
-      fetchHover.current.cancel();
-      clearHover();
-    };
-
-    dom.addEventListener('mousemove', onMove);
-    dom.addEventListener('mouseleave', onLeave);
-    return () => {
-      dom?.removeEventListener('mousemove', onMove);
-      dom?.removeEventListener('mouseleave', onLeave);
-      fetchHover.current.cancel();
-    };
-    // Re-attach on enabled / session.isReady changes; the editor itself
-    // is stable across renders so it's not a dep here.
-  }, [enabled, session.isReady, clearHover, editorRef]);
-
-  return { hoverContent, hoverPosition, clearHover };
-}

package/src/components/smartEditor/useLspSemanticTokens.ts

@@ -1,298 +0,0 @@
-// Copyright 2026 Qore Technologies, s.r.o.
-// Slate `decorate` hook that paints syntax highlighting using the
-// LSP server's `textDocument/semanticTokens/full` response. Replaces
-// the previous client-side regex highlighter (which was inherited
-// from qorus-ide and turned out to be SQL keywords miscast as DPQL).
-//
-// Architecturally: the server is the canonical tokenizer for any
-// `languageId` we serve (DPQL, Qonsole, Qore). We just decode the
-// LSP-spec int-array, map each token's `{line, character, length}`
-// to a Slate `Range` via the converter, and emit marks (`tokenType`,
-// `tokenModifiers`) that `SmartEditor`'s renderLeaf colours.
-//
-// The decode math is pure and unit-tested separately; the hook is a
-// thin debounce + state wrapper around it.
-
-import { debounce } from 'lodash';
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-import { NodeEntry, Range, Text } from 'slate';
-import {
-  ILspSemanticToken,
-  ILspSemanticTokensLegend,
-} from '../../utils/lspClient.types';
-import { lspPositionToOffset } from './helpers';
-import { ISlateConverter, ISlateElement } from './types';
-import type { IUseLspSessionResult } from './useLspSession';
-
-/** Re-fetches when an empty token set comes back for a non-empty document. */
-const EMPTY_RETRY_MAX = 3;
-const EMPTY_RETRY_DELAY_MS = 300;
-
-/**
- * Decode the LSP flat int-array semantic-tokens payload into
- * absolute-position `ILspSemanticToken[]`. Pure function — extracted
- * so the math can be unit-tested without a DOM or live session.
- *
- * LSP encoding: groups of 5 ints per token:
- *   [deltaLine, deltaStart, length, tokenType, tokenModifiersBitmask]
- *
- * Positions are delta-encoded relative to the *previous* token. When
- * `deltaLine > 0`, `deltaStart` is the absolute character offset from
- * the start of the new line. When `deltaLine === 0`, `deltaStart` is
- * an offset from the previous token's start character on the same line.
- *
- * Returns an empty array on a malformed payload (length not divisible
- * by 5, missing legend, out-of-range type index, etc.) rather than
- * throwing — bad input shouldn't crash the editor.
- */
-export function decodeSemanticTokens(
-  data: number[] | undefined | null,
-  legend: ILspSemanticTokensLegend | null
-): ILspSemanticToken[] {
-  if (!data || !legend || data.length === 0) return [];
-  if (data.length % 5 !== 0) return [];
-
-  const tokens: ILspSemanticToken[] = [];
-  let prevLine = 0;
-  let prevChar = 0;
-
-  for (let i = 0; i < data.length; i += 5) {
-    const deltaLine = data[i];
-    const deltaStart = data[i + 1];
-    const length = data[i + 2];
-    const typeIdx = data[i + 3];
-    const modBits = data[i + 4];
-
-    const line = prevLine + deltaLine;
-    // When the token jumps to a new line, deltaStart is the absolute
-    // character on the new line. When it stays on the same line, it's
-    // a delta from the previous token's start character.
-    const character = deltaLine === 0 ? prevChar + deltaStart : deltaStart;
-
-    const tokenType = legend.tokenTypes[typeIdx];
-    if (tokenType === undefined) {
-      // Server emitted an index outside the legend — skip this token
-      // but keep decoding the rest so a single garbage entry doesn't
-      // kill the whole document's highlighting.
-      prevLine = line;
-      prevChar = character;
-      continue;
-    }
-
-    const tokenModifiers: string[] = [];
-    if (modBits !== 0) {
-      for (let bit = 0; bit < legend.tokenModifiers.length; bit++) {
-        if ((modBits & (1 << bit)) !== 0) {
-          tokenModifiers.push(legend.tokenModifiers[bit]);
-        }
-      }
-    }
-
-    tokens.push({ line, character, length, tokenType, tokenModifiers });
-    prevLine = line;
-    prevChar = character;
-  }
-
-  return tokens;
-}
-
-/**
- * Convert an `ILspSemanticToken[]` into a single `(NodeEntry) =>
- * Range[]` decorate function — for each Slate text leaf, find the
- * tokens overlapping its plain-text span and emit ranges with marks.
- *
- * Plain-text offset math mirrors `useLspDiagnosticDecorations`:
- *   leafStart = converter.selectionToOffset(nodes, path, 0)
- *   leafEnd   = leafStart + node.text.length
- * Tokens whose `[startOffset, endOffset)` intersects the leaf produce
- * a range clamped to the leaf bounds.
- */
-function tokensToDecorate(
-  tokens: ILspSemanticToken[],
-  plainText: string,
-  nodes: ISlateElement[],
-  converter: ISlateConverter
-) {
-  // Pre-compute each token's absolute plain-text [start, end) so we
-  // only do the LSP→offset conversion once per token (not once per
-  // leaf, which Slate calls into us repeatedly for).
-  const tokenSpans = tokens.map((t) => ({
-    startOffset: lspPositionToOffset(plainText, {
-      line: t.line,
-      character: t.character,
-    }),
-    endOffset: lspPositionToOffset(plainText, {
-      line: t.line,
-      character: t.character + t.length,
-    }),
-    tokenType: t.tokenType,
-    tokenModifiers: t.tokenModifiers,
-  }));
-
-  return (entry: NodeEntry): Range[] => {
-    if (tokenSpans.length === 0) return [];
-    const [node, path] = entry;
-    if (!Text.isText(node)) return [];
-
-    const leafStart = converter.selectionToOffset(
-      nodes,
-      path as number[],
-      0
-    );
-    const leafEnd = leafStart + node.text.length;
-
-    const ranges: Range[] = [];
-    for (const span of tokenSpans) {
-      const overlapStart = Math.max(leafStart, span.startOffset);
-      const overlapEnd = Math.min(leafEnd, span.endOffset);
-      if (overlapStart >= overlapEnd) continue;
-      ranges.push({
-        anchor: { path, offset: overlapStart - leafStart },
-        focus: { path, offset: overlapEnd - leafStart },
-        tokenType: span.tokenType,
-        tokenModifiers: span.tokenModifiers,
-      } as unknown as Range);
-    }
-    return ranges;
-  };
-}
-
-export interface IUseLspSemanticTokensOptions {
-  /** Default `true`. Set `false` to disable LSP-driven syntax highlighting. */
-  enabled?: boolean;
-  /** Debounce window before re-requesting tokens. Default 250ms. */
-  debounceMs?: number;
-}
-
-/**
- * LSP-driven syntax highlighting for `SmartEditor`. Returns a stable
- * `(NodeEntry) => Range[]` decorate function that the editor composes
- * with diagnostics + any caller-provided decorate.
- *
- * Behaviour:
- * - Waits for `session.isReady && session.semanticTokensLegend`. Until
- *   then, the returned decorate emits no ranges (editor body shows as
- *   plain monospace text under the connecting overlay).
- * - Whenever `nodes` changes, debounces a request to
- *   `session.client.getSemanticTokens()`. The most-recent response is
- *   memoised into the decorate; in-flight stale responses are dropped.
- * - On request error / timeout, retains the previously-decoded tokens
- *   so highlighting doesn't flash off mid-edit.
- */
-export function useLspSemanticTokens(
-  session: IUseLspSessionResult,
-  converter: ISlateConverter,
-  nodes: ISlateElement[],
-  options: IUseLspSemanticTokensOptions = {}
-): (entry: NodeEntry) => Range[] {
-  const { enabled = true, debounceMs = 250 } = options;
-
-  const [tokens, setTokens] = useState<ILspSemanticToken[]>([]);
-  const requestIdRef = useRef(0);
-
-  const plainText = useMemo(
-    () => converter.fromSlateNodes(nodes),
-    [converter, nodes]
-  );
-
-  const plainTextRef = useRef(plainText);
-  plainTextRef.current = plainText;
-  const emptyRetryRef = useRef(0);
-  const retryTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-
-  // Debounced fetch. Re-created in the effect below so each call
-  // closes over the latest session + plainText. Started as a no-op so
-  // the ref always holds a function (avoids null-checks in the firing
-  // effect).
-  const fetchTokens = useRef<ReturnType<typeof debounce>>(
-    debounce(() => undefined)
-  );
-
-  // Depend on the stable primitives inside `session` — not the `session`
-  // object literal itself. `useLspSession` rebuilds its return object on
-  // every render, so `[session, …]` would cancel and recreate this
-  // debounce on every parent re-render and the armed fetch would never
-  // get a chance to fire (see `WithServerParse` story: the
-  // `dpql/toRichtext` response arrives ~10ms after `isReady` flips and
-  // its three setStates would cancel the 250ms debounce before it
-  // expired, so `getSemanticTokens` was never called).
-  useEffect(() => {
-    fetchTokens.current.cancel();
-    fetchTokens.current = debounce(async () => {
-      const client = session.client;
-      const legend = session.semanticTokensLegend;
-      if (
-        !enabled ||
-        !client ||
-        !session.isReady ||
-        !session.isContextReady ||
-        !legend
-      )
-        return;
-      const reqId = ++requestIdRef.current;
-      try {
-        const data = await client.getSemanticTokens();
-        if (reqId !== requestIdRef.current) return; // stale
-        const decoded = decodeSemanticTokens(data, legend);
-        setTokens(decoded);
-
-        if (
-          decoded.length === 0 &&
-          plainTextRef.current.trim() !== '' &&
-          emptyRetryRef.current < EMPTY_RETRY_MAX
-        ) {
-          emptyRetryRef.current += 1;
-          if (retryTimerRef.current) clearTimeout(retryTimerRef.current);
-          retryTimerRef.current = setTimeout(
-            () => fetchTokens.current(),
-            EMPTY_RETRY_DELAY_MS
-          );
-        }
-      } catch {
-        // Keep last-known tokens on error so highlighting doesn't
-        // flash off mid-edit.
-      }
-    }, debounceMs);
-    return () => {
-      fetchTokens.current.cancel();
-      if (retryTimerRef.current) clearTimeout(retryTimerRef.current);
-    };
-  }, [
-    session.client,
-    session.isReady,
-    session.isContextReady,
-    session.semanticTokensLegend,
-    enabled,
-    debounceMs,
-  ]);
-
-  // Fire on every document change AND when the session becomes ready
-  // (first highlighting pass right after connect).
-  useEffect(() => {
-    if (
-      !enabled ||
-      !session.isReady ||
-      !session.isContextReady ||
-      !session.semanticTokensLegend
-    )
-      return;
-    // Fresh document (or fresh ready session) — allow the empty-result
-    // retries again.
-    emptyRetryRef.current = 0;
-    fetchTokens.current();
-    // No cleanup — the debounce is cancelled by the outer effect on
-    // session/enabled changes.
-  }, [
-    enabled,
-    session.isReady,
-    session.isContextReady,
-    session.semanticTokensLegend,
-    plainText,
-  ]);
-
-  return useCallback(
-    (entry: NodeEntry) =>
-      tokensToDecorate(tokens, plainText, nodes, converter)(entry),
-    [tokens, plainText, nodes, converter]
-  );
-}