Function tsHover

packages/web/src/components/cells/hover.ts:15–67

(cell: CodeCellType, channel: SessionChannel, theme: ThemeType)

/** Hover extension for TS server information */
export function tsHover(cell: CodeCellType, channel: SessionChannel, theme: ThemeType): Extension {
  return hoverTooltip(async (view, pos) => {
    if (cell.language !== 'typescript') {
      return null; // bail early if not typescript
    }

    const { from, to, text } = view.state.doc.lineAt(pos);
    let start = pos;
    let end = pos;

    while (start > from && /\w/.test(text[start - from - 1] ?? '')) start--;
    while (end < to && /\w/.test(text[end - from] ?? '')) end++;

    return {
      pos: start,
      end: end,
      create: () => {
        const tooltipContainer = document.createElement('div');
        tooltipContainer.className = 'hidden';

        function callback({ response }: TsServerQuickInfoResponsePayloadType) {
          tooltipContainer.className = 'p-2 space-y-2 max-w-3xl max-h-96 overflow-scroll text-xs';
          const signatureNode = formatCode(response.displayString, theme);
          tooltipContainer.appendChild(signatureNode);

          const documentationNode = formatDocumentation(response.documentation);
          if (documentationNode !== null) {
            tooltipContainer.appendChild(documentationNode);
          }

          const tagsNode = formatTags(response.tags);
          if (tagsNode !== null) {
            tooltipContainer.appendChild(tagsNode);
          }
        }

        return {
          dom: tooltipContainer,
          mount() {
            channel.on('tsserver:cell:quickinfo:response', callback);
            channel.push('tsserver:cell:quickinfo:request', {
              cellId: cell.id,
              request: { location: mapCMLocationToTsServer(cell.source, pos) },
            });
          },
          destroy() {
            channel.off('tsserver:cell:quickinfo:response', callback);
          },
        };
      },
    };
  });
}

function formatDocumentation(documentation: TsServerJSDocType): HTMLElement | null {
  if (!documentation) {