inspect-ai 0.3.61__py3-none-any.whl → 0.3.63__py3-none-any.whl

inspect_ai/_view/www/src/components/Tools.mjs

@@ -1,376 +0,0 @@
-// @ts-check
-/// <reference path="../types/prism.d.ts" />
-import Prism from "prismjs";
-import murmurhash from "murmurhash";
-
-import "prismjs/components/prism-python";
-import "prismjs/components/prism-bash";
-import "prismjs/components/prism-json";
-
-import { useRef, useEffect } from "preact/hooks";
-import { html } from "htm/preact";
-
-import { MessageContent } from "./MessageContent.mjs";
-import { ExpandablePanel } from "./ExpandablePanel.mjs";
-import { FontSize } from "../appearance/Fonts.mjs";
-import { MarkdownDiv } from "./MarkdownDiv.mjs";
-
-/**
- * @typedef {Object} ToolCallResult
- * @property {string} functionCall - The formatted function call with arguments.
- * @property {string|undefined} input - The primary input for the tool, if available.
- * @property {string|undefined} inputType - The type of the input (e.g., "bash", "python", "text"), if applicable.
- */
-
-/**
- * Resolves the input and metadata for a given tool call.
- * @param { string } fn - The tool call function name
- * @param { import("../types/log").Arguments } toolArgs - The tool call arguments
- *
- * @returns {ToolCallResult}  An object containing the following properties:
- */
-export const resolveToolInput = (fn, toolArgs) => {
-  const toolName = fn;
-
-  const [inputKey, inputType] = extractInputMetadata(toolName);
-  const { input, args } = extractInput(inputKey, toolArgs);
-  const functionCall =
-    args.length > 0 ? `${toolName}(${args.join(",")})` : toolName;
-  return {
-    functionCall,
-    input,
-    inputType,
-  };
-};
-
-/**
- * Renders the ToolCallView component.
- *
- * @param {Object} props - The parameters for the component.
- * @param {string} props.functionCall - The function call
- * @param {string | undefined } props.input - The main input for this call
- * @param {string | undefined } props.inputType - The input type for this call
- * @param {import("../types/log").ToolCallContent} props.view - The tool call view
- * @param {string | number | boolean | import("../types/log").ContentText | import("../types/log").ContentImage | (import("../types/log").ContentText | import("../types/log").ContentImage)[]} props.output - The tool output
- * @param { "compact" | undefined } props.mode - The display mode for this call
- * @returns {import("preact").JSX.Element} The SampleTranscript component.
- */
-export const ToolCallView = ({
-  functionCall,
-  input,
-  inputType,
-  view,
-  output,
-  mode,
-}) => {
-  // don't collapse if output includes an image
-  function isContentImage(value) {
-    if (value && typeof value === "object") {
-      if (value.type === "image") {
-        return true;
-      } else if (value.type === "tool") {
-        if (
-          Array.isArray(value.content) &&
-          value.content.some(isContentImage)
-        ) {
-          return true;
-        }
-      }
-    }
-    return false;
-  }
-  const collapse = Array.isArray(output)
-    ? output.every((item) => !isContentImage(item))
-    : !isContentImage(output);
-
-  return html`<div>
-    ${mode !== "compact" && (!view || view.title)
-      ? html`<${ToolTitle} title=${view?.title || functionCall} />`
-      : ""}
-    <div>
-      <div>
-        <${ToolInput}
-          type=${inputType}
-          contents=${input}
-          view=${view}
-          style=${{ marginBottom: "1em" }}
-        />
-        ${output
-          ? html`
-              <${ExpandablePanel} collapse=${collapse} border=${true} lines=${15}>
-              <${MessageContent} contents=${normalizeContent(output)} />
-              </${ExpandablePanel}>`
-          : ""}
-      </div>
-    </div>
-  </div>`;
-};
-
-/**
- * Renders the ToolCallView component.
- *
- * @param {Object} props - The parameters for the component.
- * @param {string} props.title - The title for the tool call
- * @returns {import("preact").JSX.Element} The SampleTranscript component.
- */
-const ToolTitle = ({ title }) => {
-  return html` <i
-      class="bi bi-tools"
-      style=${{
-        marginRight: "0.2rem",
-        opacity: "0.4",
-      }}
-    ></i>
-    <code style=${{ fontSize: FontSize.small }}>${title}</code>`;
-};
-
-/**
- * Renders the ToolCallView component.
- *
- * @param {string | number | boolean | import("../types/log").ContentImage | import("../types/log").ContentText | (import("../types/log").ContentText | import("../types/log").ContentImage)[]} output - The tool output
- * @returns {(import("../Types.mjs").ContentTool | import("../types/log").ContentText | import("../types/log").ContentImage)[]} The SampleTranscript component.
- */
-const normalizeContent = (output) => {
-  if (Array.isArray(output)) {
-    return output;
-  } else {
-    return [
-      {
-        type: "tool",
-        content: [
-          {
-            type: "text",
-            text: String(output),
-          },
-        ],
-      },
-    ];
-  }
-};
-
-/**
- * Renders the ToolInput component.
- *
- * @param {Object} props - The parameters for the component.
- * @param {string} props.type - The function call
- * @param {string | undefined } props.contents - The main input for this call
- * @param {Record<string, string>} [props.style] - The style
- * @param {import("../types/log").ToolCallContent} [props.view] - The tool call view
- * @returns {import("preact").JSX.Element | string} The SampleTranscript component.
- */
-export const ToolInput = ({ type, contents, view, style }) => {
-  if (!contents && !view?.content) {
-    return "";
-  }
-
-  if (view) {
-    const toolInputRef = useRef(
-      /** @type {import("preact").Component & { base: Element }} */ (null),
-    );
-    useEffect(() => {
-      // Sniff around for code in the view that could be text highlighted
-      if (toolInputRef.current) {
-        // @ts-expect-error: TS doesn't know that `HTMLCollection` is iterable.
-        for (const child of toolInputRef.current.base.children) {
-          if (child.tagName === "PRE") {
-            const childChild = child.firstElementChild;
-            if (childChild && childChild.tagName === "CODE") {
-              const hasLanguageClass = Array.from(childChild.classList).some(
-                (className) => className.startsWith("language-"),
-              );
-              if (hasLanguageClass) {
-                child.classList.add("tool-output");
-                Prism.highlightElement(childChild);
-              }
-            }
-          }
-        }
-      }
-    }, [contents, view, style]);
-    return html`<${MarkdownDiv}
-      markdown=${view.content}
-      ref=${toolInputRef}
-      style=${style}
-    />`;
-  } else {
-    const toolInputRef = useRef(/** @type {HTMLElement|null} */ (null));
-    useEffect(() => {
-      const tokens = Prism.languages[type];
-      if (toolInputRef.current && tokens) {
-        Prism.highlightElement(toolInputRef.current);
-      }
-    }, [contents, type, view]);
-
-    contents =
-      typeof contents === "object" || Array.isArray(contents)
-        ? JSON.stringify(contents)
-        : contents;
-    const key = murmurhash.v3(contents);
-
-    return html`<pre
-      class="tool-output"
-      style=${{
-        padding: "0.5em",
-        marginTop: "0.25em",
-        marginBottom: "1rem",
-        ...style,
-      }}
-    >
-        <code ref=${toolInputRef} 
-          key=${key}
-          class="sourceCode${type ? ` language-${type}` : ""}" style=${{
-      overflowWrap: "anywhere",
-      whiteSpace: "pre-wrap",
-    }}>
-          ${contents}
-          </code>
-      </pre>`;
-  }
-};
-
-/**
- * Renders the ToolOutput component.
- *
- * @param {Object} props - The parameters for the component.
- * @param {string | number | boolean | (import("../types/log").ContentText | import("../types/log").ContentImage)[]} props.output - The tool output
- * @param {Object} props.style - The style for the element
- * @returns { import("preact").JSX.Element | import("preact").JSX.Element[] | string} The ToolOutput component.
- */
-export const ToolOutput = ({ output, style }) => {
-  // If there is no output, don't show the tool
-  if (!output) {
-    return "";
-  }
-
-  // First process an array or object into a string
-  const outputs = [];
-  if (Array.isArray(output)) {
-    output.forEach((out) => {
-      if (out.type === "text") {
-        outputs.push(
-          html`<${ToolTextOutput} text=${out.text} style=${style} />`,
-        );
-      } else {
-        if (out.image.startsWith("data:")) {
-          outputs.push(
-            html`<img
-              src="${out.image}"
-              style=${{
-                maxWidth: "800px",
-                border: "solid var(--bs-border-color) 1px",
-                ...style,
-              }}
-            />`,
-          );
-        } else {
-          outputs.push(
-            html`<${ToolTextOutput}
-              text=${String(out.image)}
-              style=${style}
-            />`,
-          );
-        }
-      }
-    });
-  } else {
-    outputs.push(
-      html`<${ToolTextOutput} text=${String(output)} style=${style} />`,
-    );
-  }
-  return html`<div style=${{ display: "grid" }}>${outputs}</div>`;
-};
-
-/**
- * Renders the ToolTextOutput component.
- *
- * @param {Object} props - The parameters for the component.
- * @param {string} props.text - The tool text
- * @param {Object} props.style - The style for the element
- * @returns {import("preact").JSX.Element} The ToolOutput component.
- */
-const ToolTextOutput = ({ text, style }) => {
-  return html`<pre
-    style=${{
-      marginLeft: "2px",
-      padding: "0.5em 0.5em 0.5em 0.5em",
-      whiteSpace: "pre-wrap",
-      marginBottom: "0",
-      ...style,
-    }}
-  >
-    <code class="sourceCode" style=${{ wordWrap: "anywhere" }}>
-      ${text.trim()}
-      </code>
-  </pre>`;
-};
-
-/**
- * @param {string} toolName
- * @returns {[string | undefined, string | undefined]}
- */
-const extractInputMetadata = (toolName) => {
-  if (toolName === "bash") {
-    return ["cmd", "bash"];
-  } else if (toolName === "python") {
-    return ["code", "python"];
-  } else if (toolName === "web_search") {
-    return ["query", "text"];
-  } else {
-    return [undefined, undefined];
-  }
-};
-
-/**
- * @param {string} inputKey
- * @param {Object<string, any>} args
- * @returns {{ input: string | undefined, args: string[] }}
- */
-const extractInput = (inputKey, args) => {
-  const formatArg = (key, value) => {
-    const quotedValue = typeof value === "string" ? `"${value}"` : value;
-    return `${key}: ${quotedValue}`;
-  };
-  if (args) {
-    if (Object.keys(args).length === 1) {
-      const inputRaw = args[Object.keys(args)[0]];
-
-      let input;
-      if (Array.isArray(inputRaw) || typeof inputRaw === "object") {
-        input = JSON.stringify(inputRaw, undefined, 2);
-      } else {
-        input = String(inputRaw);
-      }
-
-      return {
-        input: input,
-        args: [],
-      };
-    } else if (args[inputKey]) {
-      const input = args[inputKey];
-      const filteredArgs = Object.keys(args)
-        .filter((key) => {
-          return key !== inputKey;
-        })
-        .map((key) => {
-          return formatArg(key, args[key]);
-        });
-      return {
-        input,
-        args: filteredArgs,
-      };
-    } else {
-      const formattedArgs = Object.keys(args).map((key) => {
-        return formatArg(key, args[key]);
-      });
-
-      return {
-        input: undefined,
-        args: formattedArgs,
-      };
-    }
-  }
-  return {
-    input: undefined,
-    args: [],
-  };
-};

inspect_ai/_view/www/src/components/VirtualList.mjs

@@ -1,280 +0,0 @@
-import { html } from "htm/preact";
-import { useRef, useState, useEffect, useMemo } from "preact/hooks";
-import { forwardRef, useImperativeHandle } from "preact/compat";
-import { throttle } from "../utils/sync.mjs";
-
-/**
- * A virtualized list component that efficiently renders large lists by only
- * rendering the items that are currently visible in the viewport.
- * Supports dynamic row heights that are measured after rendering.
- *
- * @template T
- * @param {Object} props - The component props
- * @param {T[]} props.data - Array of items to be rendered in the list
- * @param {(item: T, index: number) => preact.VNode} props.renderRow - Function to render each row
- * @param {number} [props.overscanCount=15] - Number of extra rows to render above and below the visible area
- * @param {number} [props.estimatedRowHeight=50] - Estimated height of each row before measurement
- * @param {boolean} [props.sync=false] - If true, forces a re-render on scroll
- * @param {import("preact").RefObject<HTMLElement>} [props.scrollRef] - Optional ref for the scroll container
- * @param {import("preact").Ref<{ scrollToIndex: (index: number) => void }>} ref - Ref object exposing the list's methods
- * @returns {preact.VNode} The virtualized list component
- */
-export const VirtualList = forwardRef(
-  (
-    /** @type {props} */ {
-      data,
-      renderRow,
-      overscanCount = 15,
-      estimatedRowHeight = 50,
-      sync = false,
-      scrollRef,
-      ...props
-    },
-    ref,
-  ) => {
-    const [height, setHeight] = useState(0);
-    const [offset, setOffset] = useState(0);
-
-    const [listMetrics, setListMetrics] = useState({
-      rowHeights: new Map(),
-      totalHeight: data.length * estimatedRowHeight,
-    });
-
-    const baseRef = useRef(null);
-    const containerRef = useRef(null);
-    const rowRefs = useRef(new Map());
-
-    // Function to get row height (measured or estimated)
-    const getRowHeight = (index) => {
-      return listMetrics.rowHeights.get(index) || estimatedRowHeight;
-    };
-
-    // Calculate row positions based on current heights
-    const rowPositions = useMemo(() => {
-      let currentPosition = 0;
-      const positions = new Map();
-
-      for (let i = 0; i < data.length; i++) {
-        positions.set(i, currentPosition);
-        currentPosition += getRowHeight(i);
-      }
-
-      return positions;
-    }, [listMetrics.rowHeights, data.length]);
-
-    // Expose scrollToIndex method via ref
-    useImperativeHandle(
-      ref,
-      () => ({
-        focus: () => {
-          baseRef.current;
-        },
-        scrollToIndex: (index, direction) => {
-          const scrollElement = scrollRef?.current || baseRef.current;
-          if (!scrollElement || index < 0 || index >= data.length) return;
-
-          const currentScrollTop = scrollElement.scrollTop;
-          const viewportHeight = scrollElement.offsetHeight;
-
-          // Get position and height of target row
-          const rowTop = rowPositions.get(index) || 0;
-          const rowHeight = getRowHeight(index);
-          const rowBottom = rowTop + rowHeight;
-
-          // If this is already visible, don't scroll
-          const isVisible =
-            rowTop >= currentScrollTop &&
-            rowBottom <= currentScrollTop + viewportHeight;
-          if (isVisible) {
-            return;
-          }
-
-          // Calculate new scroll position based on direction
-          let newScrollTop;
-          if (direction === "up") {
-            // Align top of element with top of viewport
-            newScrollTop = rowTop;
-          } else {
-            // Align bottom of element with bottom of viewport
-            newScrollTop = rowBottom - viewportHeight;
-          }
-
-          // Clamp scroll position to valid range
-          newScrollTop = Math.max(
-            0,
-            Math.min(newScrollTop, listMetrics.totalHeight - viewportHeight),
-          );
-          scrollElement.scrollTop = newScrollTop;
-        },
-      }),
-      [rowPositions, data.length],
-    );
-
-    // Measure rendered rows and update heights if needed
-    const measureRows = () => {
-      // Keep track of updated heights
-      let updates = [];
-
-      rowRefs.current.forEach((element, index) => {
-        if (element) {
-          const measuredHeight = element.offsetHeight;
-          // If the measured height is different, schedule an update
-          if (
-            measuredHeight &&
-            measuredHeight !== listMetrics.rowHeights.get(index)
-          ) {
-            updates.push([index, measuredHeight]);
-          }
-        }
-      });
-
-      // If no rows changed, do nothing
-      if (updates.length === 0) return;
-
-      // Create a new Map of rowHeights so we don't mutate state directly
-      const newHeights = new Map(listMetrics.rowHeights);
-      updates.forEach(([index, height]) => {
-        newHeights.set(index, height);
-      });
-
-      // Recompute total height only once
-      let newTotalHeight = 0;
-      for (let i = 0; i < data.length; i++) {
-        newTotalHeight += newHeights.get(i) || estimatedRowHeight;
-      }
-
-      // Now update our single state object in one go:
-      setListMetrics({
-        rowHeights: newHeights,
-        totalHeight: newTotalHeight,
-      });
-    };
-
-    // Handle container resize
-    const resize = () => {
-      const scrollElement = scrollRef?.current || baseRef.current;
-      if (scrollElement && height !== scrollElement.offsetHeight) {
-        setHeight(scrollElement.offsetHeight);
-      }
-    };
-
-    // Handle scroll with throttling
-    const handleScroll = throttle(() => {
-      const scrollElement = scrollRef?.current || baseRef.current;
-      if (scrollElement) {
-        setOffset(scrollElement.scrollTop);
-      }
-      if (sync) {
-        setOffset((prev) => prev);
-      }
-    }, 100);
-
-    // Setup scroll and resize listeners
-    useEffect(() => {
-      resize();
-      const scrollElement = scrollRef?.current || baseRef.current;
-
-      if (scrollElement) {
-        scrollElement.addEventListener("scroll", handleScroll);
-        window.addEventListener("resize", resize);
-
-        return () => {
-          scrollElement.removeEventListener("scroll", handleScroll);
-          window.removeEventListener("resize", resize);
-        };
-      }
-    }, [scrollRef?.current]);
-
-    // Measure rows after render
-    useEffect(() => {
-      measureRows();
-    });
-
-    const findRowAtOffset = (targetOffset) => {
-      if (targetOffset <= 0) return 0;
-      if (targetOffset >= listMetrics.totalHeight) return data.length - 1;
-
-      let low = 0;
-      let high = data.length - 1;
-      let lastValid = 0;
-
-      while (low <= high) {
-        const mid = Math.floor((low + high) / 2);
-        const rowStart = rowPositions.get(mid) || 0;
-
-        if (rowStart <= targetOffset) {
-          lastValid = mid;
-          low = mid + 1;
-        } else {
-          high = mid - 1;
-        }
-      }
-      return lastValid;
-    };
-
-    const firstVisibleIdx = findRowAtOffset(offset);
-    const lastVisibleIdx = findRowAtOffset(offset + height);
-
-    // Calculate range of rows to render including overscan
-    const start = Math.max(0, firstVisibleIdx - overscanCount);
-    const end = Math.min(data.length, lastVisibleIdx + overscanCount);
-
-    // Memoize the rendered rows to prevent unnecessary re-renders
-    const renderedRows = useMemo(() => {
-      const selection = data.slice(start, end);
-      return selection.map((item, index) => {
-        const actualIndex = start + index;
-        return html`
-          <div
-            key=${`list-item-${actualIndex}`}
-            ref=${(el) => {
-              if (el) {
-                rowRefs.current.set(actualIndex, el);
-              } else {
-                rowRefs.current.delete(actualIndex);
-              }
-            }}
-          >
-            ${renderRow(item, actualIndex)}
-          </div>
-        `;
-      });
-    }, [data, start, end, renderRow]);
-
-    const style_inner = {
-      position: "relative",
-      overflow: scrollRef?.current ? "visible" : "hidden",
-      width: "100%",
-      minHeight: "100%",
-    };
-
-    const style_content = {
-      position: "absolute",
-      top: 0,
-      left: 0,
-      height: "100%",
-      width: "100%",
-      overflow: "visible",
-    };
-
-    const top = rowPositions.get(start) || 0;
-
-    // Only attach onscroll to baseRef if no scrollRef is provided
-    const scrollProps = scrollRef ? {} : { onscroll: handleScroll };
-
-    return html`
-      <div ref=${baseRef} ...${props} ...${scrollProps}>
-        <div
-          style=${{ ...style_inner, height: `${listMetrics.totalHeight}px` }}
-        >
-          <div
-            style=${{ ...style_content, top: `${top}px` }}
-            ref=${containerRef}
-          >
-            ${renderedRows}
-          </div>
-        </div>
-      </div>
-    `;
-  },
-);