hoomanjs 1.18.0 → 1.18.1

package/src/chat/components/markdown/BlockRenderer.tsx

@@ -1,207 +0,0 @@
-import React from "react";
-import { Box, Text, useWindowSize } from "ink";
-import type { Token, Tokens } from "marked";
-import { CodeBlock } from "./CodeBlock.tsx";
-import { inlineToPlainText, renderInlineTokens } from "./InlineRenderer.tsx";
-import { MarkdownTable } from "./MarkdownTable.tsx";
-
-type BlockRendererProps = {
-  tokens: Token[];
-  streaming?: boolean;
-  depth?: number;
-};
-
-function blockToPlainText(token: Token): string {
-  switch (token.type) {
-    case "paragraph":
-      return inlineToPlainText(token.tokens);
-    case "text":
-      return token.text ?? "";
-    case "code":
-      return token.text ?? "";
-    case "heading":
-      return inlineToPlainText(token.tokens);
-    case "blockquote":
-      return (token.tokens ?? [])
-        .map((child) => blockToPlainText(child))
-        .join("\n");
-    case "list":
-      return token.items
-        .map((item: Tokens.ListItem) =>
-          (item.tokens ?? [])
-            .map((child: Token) => blockToPlainText(child))
-            .join(" "),
-        )
-        .join("\n");
-    default:
-      return token.raw ?? "";
-  }
-}
-
-function renderBlock(
-  token: Token,
-  key: string,
-  depth: number,
-  columns: number,
-  streaming: boolean,
-): React.ReactNode | null {
-  switch (token.type) {
-    case "paragraph":
-      return (
-        <Box key={key} marginBottom={1}>
-          <Text wrap="wrap">
-            {renderInlineTokens(token.tokens, { keyPrefix: key })}
-          </Text>
-        </Box>
-      );
-    case "heading": {
-      const headingColor = token.depth <= 2 ? "cyan" : "white";
-      return (
-        <Box key={key} marginBottom={1}>
-          <Text bold color={headingColor} wrap="wrap">
-            {renderInlineTokens(token.tokens, { keyPrefix: key })}
-          </Text>
-        </Box>
-      );
-    }
-    case "code":
-      return (
-        <CodeBlock
-          key={key}
-          code={token.text ?? ""}
-          language={token.lang}
-          streaming={streaming}
-        />
-      );
-    case "blockquote": {
-      const lines = (token.tokens ?? [])
-        .map((child) => blockToPlainText(child))
-        .join("\n")
-        .split("\n");
-      return (
-        <Box key={key} flexDirection="column" marginBottom={1}>
-          {lines.map((line, index) => (
-            <Text key={`${key}-${index}`} color="gray" italic>
-              {`│ ${line || " "}`}
-            </Text>
-          ))}
-        </Box>
-      );
-    }
-    case "list":
-      return (
-        <Box key={key} flexDirection="column" marginBottom={1}>
-          {token.items.map((item: Tokens.ListItem, index: number) => {
-            const marker = token.ordered
-              ? `${(token.start ?? 1) + index}.`
-              : "-";
-            const checkbox =
-              item.task === true ? (item.checked ? "[x] " : "[ ] ") : "";
-            const itemTokens = item.tokens ?? [];
-            const [head, ...tail] = itemTokens as Token[];
-            const isInlineHead =
-              head?.type === "text" || head?.type === "paragraph";
-            const headNode =
-              head && isInlineHead ? (
-                <Text wrap="wrap">
-                  {head.type === "paragraph"
-                    ? renderInlineTokens(head.tokens, {
-                        keyPrefix: `${key}-item-${index}-paragraph`,
-                      })
-                    : (head.text ??
-                      renderInlineTokens(head.tokens, {
-                        keyPrefix: `${key}-item-${index}-text`,
-                      }))}
-                </Text>
-              ) : head ? (
-                renderBlock(
-                  head,
-                  `${key}-item-${index}-head`,
-                  depth + 1,
-                  columns,
-                  streaming,
-                )
-              ) : (
-                <Text> </Text>
-              );
-            return (
-              <Box key={`${key}-item-${index}`} flexDirection="column">
-                <Box flexDirection="row">
-                  <Text>{`${"  ".repeat(depth)}${marker} ${checkbox}`}</Text>
-                  <Box flexDirection="column" flexGrow={1}>
-                    {headNode}
-                  </Box>
-                </Box>
-                {tail.length > 0 ? (
-                  <Box
-                    marginLeft={Math.max(2, depth * 2 + 4)}
-                    flexDirection="column"
-                  >
-                    {tail.map((nestedToken: Token, nestedIndex: number) =>
-                      renderBlock(
-                        nestedToken,
-                        `${key}-item-${index}-tail-${nestedIndex}`,
-                        depth + 1,
-                        columns,
-                        streaming,
-                      ),
-                    )}
-                  </Box>
-                ) : null}
-              </Box>
-            );
-          })}
-        </Box>
-      );
-    case "table":
-      return <MarkdownTable key={key} token={token as Tokens.Table} />;
-    case "hr":
-      return (
-        <Box key={key} marginBottom={1}>
-          <Text color="gray">
-            {"─".repeat(Math.max(8, Math.min(columns - 4, 48)))}
-          </Text>
-        </Box>
-      );
-    case "space":
-      return null;
-    case "text":
-    case "escape":
-      return (
-        <Box key={key} marginBottom={1}>
-          <Text wrap="wrap">{token.text ?? token.raw ?? ""}</Text>
-        </Box>
-      );
-    case "html":
-    case "def":
-    case "del":
-      return null;
-    default:
-      return (
-        <Box key={key} marginBottom={1}>
-          <Text wrap="wrap">{token.raw ?? ""}</Text>
-        </Box>
-      );
-  }
-}
-
-export function BlockRenderer({
-  tokens,
-  streaming = false,
-  depth = 0,
-}: BlockRendererProps) {
-  const { columns } = useWindowSize();
-  return (
-    <Box flexDirection="column">
-      {tokens.map((token, index) =>
-        renderBlock(
-          token,
-          `block-${depth}-${index}`,
-          depth,
-          columns,
-          streaming,
-        ),
-      )}
-    </Box>
-  );
-}

package/src/chat/components/markdown/CodeBlock.tsx

@@ -1,100 +0,0 @@
-import { createRequire } from "node:module";
-import type React from "react";
-import { useMemo } from "react";
-import { Box, Text } from "ink";
-import { highlight, supportsLanguage } from "cli-highlight";
-
-type CodeBlockProps = {
-  code: string;
-  language?: string;
-  streaming?: boolean;
-};
-
-type InkAnsiComponent = React.ComponentType<{
-  children?: React.ReactNode;
-}>;
-
-const localRequire = createRequire(import.meta.url);
-const ANSI_RE = /\u001b\[[0-9;]*m/g;
-let cachedInkAnsi: InkAnsiComponent | null | undefined;
-
-function stripAnsi(value: string): string {
-  return value.replace(ANSI_RE, "");
-}
-
-function getInkAnsi(): InkAnsiComponent | null {
-  if (cachedInkAnsi !== undefined) {
-    return cachedInkAnsi;
-  }
-  try {
-    const moduleValue = localRequire("ink-ansi") as
-      | InkAnsiComponent
-      | { default?: InkAnsiComponent };
-    cachedInkAnsi =
-      typeof moduleValue === "function"
-        ? moduleValue
-        : (moduleValue.default ?? null);
-  } catch {
-    cachedInkAnsi = null;
-  }
-  return cachedInkAnsi;
-}
-
-function renderCodeLines(lines: string[], color?: string) {
-  return lines.map((line, index) => (
-    <Text key={index} color={color}>
-      {line || " "}
-    </Text>
-  ));
-}
-
-export function CodeBlock({
-  code,
-  language,
-  streaming = false,
-}: CodeBlockProps) {
-  const trimmedLanguage = language?.trim() || undefined;
-  const normalizedCode = useMemo(() => code.replace(/\r\n/g, "\n"), [code]);
-  const plainLines = useMemo(
-    () => normalizedCode.split("\n"),
-    [normalizedCode],
-  );
-  const highlightedLines = useMemo(() => {
-    if (streaming || !trimmedLanguage || !supportsLanguage(trimmedLanguage)) {
-      return null;
-    }
-    try {
-      return highlight(normalizedCode, {
-        language: trimmedLanguage,
-        ignoreIllegals: true,
-      }).split("\n");
-    } catch {
-      return null;
-    }
-  }, [normalizedCode, streaming, trimmedLanguage]);
-
-  if (highlightedLines) {
-    const InkAnsiText = getInkAnsi();
-    return (
-      <Box flexDirection="column" marginBottom={1}>
-        <Text color="gray">{`\`\`\`${trimmedLanguage}`}</Text>
-        {highlightedLines.map((line, index) =>
-          InkAnsiText ? (
-            <InkAnsiText key={index}>{line || " "}</InkAnsiText>
-          ) : (
-            <Text key={index}>{stripAnsi(line) || " "}</Text>
-          ),
-        )}
-        <Text color="gray">```</Text>
-      </Box>
-    );
-  }
-
-  return (
-    <Box flexDirection="column" marginBottom={1}>
-      <Text color="gray">{`\`\`\`${trimmedLanguage ?? ""}`}</Text>
-      {renderCodeLines(plainLines, "white")}
-      <Text color="gray">```</Text>
-    </Box>
-  );
-}

package/src/chat/components/markdown/InlineRenderer.tsx

@@ -1,122 +0,0 @@
-import React from "react";
-import { Text } from "ink";
-import type { Token } from "marked";
-
-function plainFromToken(token: Token): string {
-  switch (token.type) {
-    case "text":
-      return token.text ?? "";
-    case "codespan":
-      return token.text ?? "";
-    case "escape":
-      return token.text ?? "";
-    case "link": {
-      const label = inlineToPlainText(token.tokens);
-      return label || token.href || "";
-    }
-    case "strong":
-    case "em":
-    case "del":
-      return inlineToPlainText(token.tokens);
-    case "image":
-      return token.text || token.href || "";
-    case "br":
-      return "\n";
-    default:
-      return token.raw ?? "";
-  }
-}
-
-export function inlineToPlainText(tokens: Token[] | undefined): string {
-  if (!tokens || tokens.length === 0) {
-    return "";
-  }
-  return tokens.map((token) => plainFromToken(token)).join("");
-}
-
-type RenderInlineOptions = {
-  keyPrefix?: string;
-};
-
-export function renderInlineTokens(
-  tokens: Token[] | undefined,
-  options: RenderInlineOptions = {},
-): React.ReactNode[] {
-  if (!tokens || tokens.length === 0) {
-    return [];
-  }
-  const prefix = options.keyPrefix ?? "inline";
-  return tokens.flatMap((token, index) => {
-    const key = `${prefix}-${index}`;
-    switch (token.type) {
-      case "text":
-        return [token.text ?? ""];
-      case "escape":
-        return [token.text ?? token.raw ?? ""];
-      case "codespan":
-        return [
-          <Text key={key} color="green">
-            {token.text ?? ""}
-          </Text>,
-        ];
-      case "strong":
-        return [
-          <Text key={key} bold>
-            {renderInlineTokens(token.tokens, { keyPrefix: key })}
-          </Text>,
-        ];
-      case "em":
-        return [
-          <Text key={key} italic>
-            {renderInlineTokens(token.tokens, { keyPrefix: key })}
-          </Text>,
-        ];
-      case "del":
-        return [
-          <Text key={key} dimColor>
-            {renderInlineTokens(token.tokens, { keyPrefix: key })}
-          </Text>,
-        ];
-      case "link": {
-        const href = token.href ?? "";
-        const text = inlineToPlainText(token.tokens).trim();
-        const label = text || href;
-        const shouldShowHref = Boolean(href) && label !== href;
-        return [
-          <Text key={`${key}-label`} color="blue" underline>
-            {label}
-          </Text>,
-          ...(shouldShowHref
-            ? [
-                <Text key={`${key}-href`} color="gray">
-                  {` (${href})`}
-                </Text>,
-              ]
-            : []),
-        ];
-      }
-      case "image": {
-        const label = token.text?.trim() || "image";
-        const href = token.href ?? "";
-        return [
-          <Text key={`${key}-img-label`} color="magenta">
-            {`[${label}]`}
-          </Text>,
-          ...(href
-            ? [
-                <Text key={`${key}-img-href`} color="gray">
-                  {` (${href})`}
-                </Text>,
-              ]
-            : []),
-        ];
-      }
-      case "br":
-        return [<Text key={key}>{"\n"}</Text>];
-      default: {
-        const fallback = plainFromToken(token);
-        return fallback ? [fallback] : [];
-      }
-    }
-  });
-}

package/src/chat/components/markdown/MarkdownMessage.tsx

@@ -1,35 +0,0 @@
-import { Box } from "ink";
-import { BlockRenderer } from "./BlockRenderer.tsx";
-import { useMarkdownTokens } from "./hooks/useMarkdownTokens.ts";
-
-type MarkdownMessageProps = {
-  children: string;
-  streaming?: boolean;
-};
-
-export function MarkdownMessage({
-  children,
-  streaming = false,
-}: MarkdownMessageProps) {
-  const content = children ?? "";
-  const {
-    fullTokens,
-    stablePrefix,
-    unstableSuffix,
-    stableTokens,
-    unstableTokens,
-  } = useMarkdownTokens(content, streaming);
-
-  if (!streaming) {
-    return <BlockRenderer tokens={fullTokens} />;
-  }
-
-  return (
-    <Box flexDirection="column">
-      {stablePrefix ? <BlockRenderer tokens={stableTokens} /> : null}
-      {unstableSuffix ? (
-        <BlockRenderer tokens={unstableTokens} streaming />
-      ) : null}
-    </Box>
-  );
-}

package/src/chat/components/markdown/MarkdownTable.tsx

@@ -1,23 +0,0 @@
-import { Box, Text, useWindowSize } from "ink";
-import type { Tokens } from "marked";
-import { useMarkdownTableLayout } from "./hooks/useMarkdownTableLayout.ts";
-
-type MarkdownTableProps = {
-  token: Tokens.Table;
-};
-
-export function MarkdownTable({ token }: MarkdownTableProps) {
-  const { columns } = useWindowSize();
-  const layout = useMarkdownTableLayout(token, columns);
-  if (layout.lines.length === 0) {
-    return null;
-  }
-
-  return (
-    <Box flexDirection="column" marginBottom={1}>
-      {layout.lines.map((line, index) => (
-        <Text key={index}>{line}</Text>
-      ))}
-    </Box>
-  );
-}