inspect-ai 0.3.107__py3-none-any.whl → 0.3.109__py3-none-any.whl

inspect_ai/_view/www/src/app/content/MetaDataView.tsx

@@ -1,101 +0,0 @@
-import clsx from "clsx";
-import { CSSProperties, FC } from "react";
-import styles from "./MetaDataView.module.css";
-import { RenderedContent } from "./RenderedContent";
-
-interface MetadataViewProps {
-  id?: string;
-  style?: CSSProperties;
-  entries: Record<string, unknown> | Array<{ name: string; value: unknown }>;
-  tableOptions?: string;
-  compact?: boolean;
-  className?: string | string[];
-}
-
-/**
- * Renders the MetaDataView component.
- */
-export const MetaDataView: FC<MetadataViewProps> = ({
-  id,
-  style,
-  entries,
-  tableOptions,
-  compact,
-  className,
-}) => {
-  const baseId = "metadataview";
-
-  // Configure options for
-  tableOptions = tableOptions || "sm";
-  const tblClz = (tableOptions || "").split(",").map((option) => {
-    return `table-${option}`;
-  });
-
-  const coercedEntries = toNameValues(entries);
-
-  const entryEls = (coercedEntries || []).map((entry, index) => {
-    const id = `${baseId}-value-${index}`;
-    return (
-      <tr key={id}>
-        <td
-          className={clsx(
-            styles.cell,
-            styles.cellKey,
-            "text-size-small",
-            "text-style-label",
-          )}
-        >
-          {entry.name}
-        </td>
-        <td className={clsx(styles.cell, styles.cellValue, "text-size-small")}>
-          <RenderedContent id={id} entry={entry} />
-        </td>
-      </tr>
-    );
-  });
-
-  return (
-    <table
-      id={id}
-      className={clsx(
-        "table",
-        tblClz,
-        styles.table,
-        compact ? styles.compact : undefined,
-        className,
-      )}
-      style={style}
-    >
-      <tbody>{entryEls}</tbody>
-    </table>
-  );
-};
-
-// entries can be either a Record<string, stringable>
-// or an array of record with name/value on way in
-// but coerce to array of records for order
-const toNameValues = (
-  entries?:
-    | Array<{ name: string; value: unknown }>
-    | Record<string, unknown>
-    | Array<unknown>,
-): Array<{ name: string; value: unknown }> | undefined => {
-  if (entries) {
-    if (Array.isArray(entries)) {
-      // filter arrays that don't contain the expected name value pairs
-      const filtered = entries.filter((entry) => {
-        if (entry && typeof entry === "object") {
-          return "name" in entry && "value" in entry;
-        }
-        return false;
-      });
-      return filtered as Array<{ name: string; value: unknown }>;
-    } else {
-      return Object.entries(entries || {}).map(([key, value]) => {
-        return { name: key, value };
-      });
-    }
-  } else {
-    return entries;
-  }
-};

inspect_ai/_view/www/src/app/log-view/utils.ts

@@ -1,34 +0,0 @@
-import { ResultsMetric } from "./navbar/ResultsPanel";
-
-export const metricDisplayName = (metric: ResultsMetric): string => {
-  let modifier = undefined;
-  for (const metricModifier of metricModifiers) {
-    modifier = metricModifier(metric);
-    if (modifier) {
-      break;
-    }
-  }
-  const metricName = !modifier ? metric.name : `${metric.name}[${modifier}]`;
-
-  return metricName;
-};
-
-type MetricModifier = (metric: ResultsMetric) => string | undefined;
-
-const clusterMetricModifier: MetricModifier = (
-  metric: ResultsMetric,
-): string | undefined => {
-  if (metric.name !== "stderr") {
-    return undefined;
-  }
-
-  const clusterValue = ((metric.params || {}) as Record<string, unknown>)[
-    "cluster"
-  ];
-  if (clusterValue === undefined || typeof clusterValue !== "string") {
-    return undefined;
-  }
-  return clusterValue;
-};
-
-const metricModifiers: MetricModifier[] = [clusterMetricModifier];

inspect_ai/_view/www/src/app/sidebar/EvalStatus.module.css

@@ -1,15 +0,0 @@
-.error {
-  color: var(--bs-danger);
-  margin-top: 0.2em;
-}
-
-.running {
-  display: grid;
-  grid-template-columns: max-content max-content;
-  column-gap: 0.5em;
-  margin-top: 0.3em;
-}
-
-.cancelled {
-  margin-top: 0.2em;
-}

inspect_ai/_view/www/src/app/sidebar/EvalStatus.tsx

@@ -1,72 +0,0 @@
-import clsx from "clsx";
-import { FC } from "react";
-import { EvalLogHeader } from "../../client/api/types";
-import styles from "./EvalStatus.module.css";
-import { SidebarScoreView } from "./SidebarScoreView";
-import { SidebarScoresView } from "./SidebarScoresView";
-
-interface EvalStatusProps {
-  logHeader?: EvalLogHeader;
-}
-
-export const EvalStatus: FC<EvalStatusProps> = ({ logHeader }) => {
-  switch (logHeader?.status) {
-    case "error":
-      return <StatusError message="Error" />;
-
-    case "cancelled":
-      return <StatusCancelled message="Cancelled" />;
-
-    case "started":
-      return <StatusRunning message="Running" />;
-
-    default:
-      if (logHeader?.results?.scores && logHeader.results?.scores.length > 0) {
-        if (logHeader.results.scores.length === 1) {
-          return <SidebarScoreView scorer={logHeader.results.scores[0]} />;
-        } else {
-          return <SidebarScoresView scores={logHeader.results.scores} />;
-        }
-      } else {
-        return null;
-      }
-  }
-};
-
-interface StatusProps {
-  message: string;
-}
-
-const StatusCancelled: FC<StatusProps> = ({ message }) => {
-  return (
-    <div
-      className={clsx(
-        "text-style-secondary",
-        "text-style-label",
-        "text-size-small",
-        styles.cancelled,
-      )}
-    >
-      {message}
-    </div>
-  );
-};
-
-const StatusRunning: FC<StatusProps> = ({ message }) => {
-  return (
-    <div
-      className={clsx(
-        "text-style-secondary",
-        "text-style-label",
-        "text-size-small",
-        styles.running,
-      )}
-    >
-      <div>{message}</div>
-    </div>
-  );
-};
-
-const StatusError: FC<StatusProps> = ({ message }) => {
-  return <div className={clsx(styles.error, "text-size-small")}>{message}</div>;
-};

inspect_ai/_view/www/src/app/sidebar/LogDirectoryTitleView.module.css

@@ -1,16 +0,0 @@
-.dirname {
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}
-
-.directoryLink {
-  color: inherit;
-  text-decoration: none;
-  cursor: pointer;
-}
-
-.directoryLink:hover {
-  color: var(--bs-primary);
-  text-decoration: none;
-}

inspect_ai/_view/www/src/app/sidebar/LogDirectoryTitleView.tsx

@@ -1,70 +0,0 @@
-import clsx from "clsx";
-import { FC, useCallback } from "react";
-import { Link } from "react-router-dom";
-import { useStore } from "../../state/store";
-import styles from "./LogDirectoryTitleView.module.css";
-
-interface LogDirectoryTitleViewProps {
-  log_dir?: string;
-}
-
-export const LogDirectoryTitleView: FC<LogDirectoryTitleViewProps> = ({
-  log_dir,
-}) => {
-  const offCanvas = useStore((state) => state.app.offcanvas);
-  const setOffCanvas = useStore((state) => state.appActions.setOffcanvas);
-
-  const handleClick = useCallback(() => {
-    // Close the sidebar when clicking the directory link on mobile
-    if (offCanvas) {
-      setOffCanvas(false);
-    }
-  }, [offCanvas, setOffCanvas]);
-  if (log_dir) {
-    const displayDir = prettyDir(log_dir);
-    return (
-      <Link to="/logs" className={styles.directoryLink} onClick={handleClick}>
-        <div style={{ display: "flex", flexDirection: "column" }}>
-          <span
-            className={clsx(
-              "text-style-secondary",
-              "text-style-label",
-              "text-size-small",
-            )}
-          >
-            Log Directory
-          </span>
-          <span
-            title={displayDir}
-            className={clsx("text-size-base", styles.dirname)}
-          >
-            {offCanvas ? displayDir : ""}
-          </span>
-        </div>
-      </Link>
-    );
-  } else {
-    return (
-      <Link to="/logs" className={styles.directoryLink} onClick={handleClick}>
-        <span className={clsx("text-size-title")}>
-          {offCanvas ? "Log History" : ""}
-        </span>
-      </Link>
-    );
-  }
-};
-
-const prettyDir = (path: string): string => {
-  try {
-    // Try to create a new URL object
-    let url = new URL(path);
-
-    if (url.protocol === "file:") {
-      return url.pathname;
-    } else {
-      return path;
-    }
-  } catch {
-    return path;
-  }
-};

inspect_ai/_view/www/src/app/sidebar/Sidebar.module.css

@@ -1,77 +0,0 @@
-.sidebar {
-  position: fixed;
-  left: 0;
-  top: 0;
-  width: var(--sidebar-width);
-  height: 100%;
-  background-color: #fff;
-  border-right: 1px solid var(--bs-light-border-subtle);
-  display: flex;
-  flex-direction: column;
-  z-index: 9999; /* Sit above main content */
-  transition: transform 0.3s ease-in-out;
-}
-
-.sidebarClosed {
-  transform: translateX(-100%);
-}
-
-.sidebarOpen {
-  transform: translateX(0);
-}
-
-.header {
-  display: grid;
-  grid-template-columns: minmax(0, 1fr) auto;
-  column-gap: 0.2rem;
-  align-items: center;
-  opacity: 0.7;
-  position: sticky;
-  top: 0;
-  width: var(--sidebar-width);
-  border-bottom: 1px solid var(--bs-light-border-subtle);
-  padding: 0.5rem 0 0.5rem 1rem;
-  height: 3.6em;
-  background-color: #fff;
-  z-index: 10;
-}
-
-.toggle {
-  padding: 0.1rem;
-  align-self: end;
-  width: 40px;
-  flex: 0 0 auto;
-}
-
-.progress {
-  z-index: 3;
-}
-
-.list {
-  flex-grow: 1;
-  overflow-y: auto;
-}
-
-.backdrop {
-  position: fixed;
-  inset: 0;
-  background-color: var(--inspect-glass-color);
-  opacity: var(--inspect-glass-opacity);
-  z-index: 9998;
-}
-
-.active {
-  background-color: var(--bs-secondary-bg-subtle);
-}
-
-.item {
-  cursor: pointer;
-  padding: 0;
-}
-
-.logLink {
-  display: block;
-  padding: 0.5rem 1rem;
-  color: inherit;
-  text-decoration: none;
-}

inspect_ai/_view/www/src/app/sidebar/Sidebar.tsx

@@ -1,119 +0,0 @@
-import clsx from "clsx";
-import { FC, useCallback, useEffect, useRef } from "react";
-import { Link } from "react-router-dom";
-import { Fragment } from "react/jsx-runtime";
-import { EvalLogHeader } from "../../client/api/types";
-import { ProgressBar } from "../../components/ProgressBar";
-import { useStatefulScrollPosition } from "../../state/scrolling";
-import { useStore } from "../../state/store";
-import { ApplicationIcons } from "../appearance/icons";
-import { logUrl } from "../routing/url";
-import { LogDirectoryTitleView } from "./LogDirectoryTitleView";
-import styles from "./Sidebar.module.css";
-import { SidebarLogEntry } from "./SidebarLogEntry";
-
-interface SidebarProps {
-  logHeaders: Record<string, EvalLogHeader>;
-  loading: boolean;
-  selectedIndex: number;
-  onSelectedIndexChanged: (index: number) => void;
-}
-
-export const Sidebar: FC<SidebarProps> = ({
-  logHeaders,
-  loading,
-  selectedIndex,
-  onSelectedIndexChanged,
-}) => {
-  const logs = useStore((state) => state.logs.logs);
-  const setOffCanvas = useStore((state) => state.appActions.setOffcanvas);
-  const offCanvas = useStore((state) => state.app.offcanvas);
-  const handleToggle = useCallback(() => {
-    setOffCanvas(!offCanvas);
-  }, [offCanvas, setOffCanvas]);
-
-  const sidebarContentsRef = useRef(null);
-  useStatefulScrollPosition(sidebarContentsRef, "sidebar-contents", 1000);
-
-  // Scroll the selected log into view when it changes
-  const itemRefs = useRef<{ [index: number]: HTMLLIElement | null }>({});
-
-  useEffect(() => {
-    if (itemRefs.current[selectedIndex]) {
-      itemRefs.current[selectedIndex]?.scrollIntoView({
-        behavior: "smooth",
-        block: "nearest",
-      });
-    }
-  }, [selectedIndex]);
-
-  // No longer need the click handler as we're using Links now
-
-  return (
-    <Fragment>
-      {/* Optional backdrop for small screens, appears only when offcanvas is open */}
-      {offCanvas && <div className={styles.backdrop} onClick={handleToggle} />}
-
-      <div
-        className={clsx(
-          styles.sidebar,
-          offCanvas ? styles.sidebarOpen : styles.sidebarClosed,
-        )}
-      >
-        <div className={styles.header}>
-          <LogDirectoryTitleView log_dir={logs.log_dir} />
-          <button
-            onClick={handleToggle}
-            className={clsx("btn", styles.toggle)}
-            type="button"
-            aria-label="Close sidebar"
-          >
-            <i className={ApplicationIcons.close}></i>
-          </button>
-        </div>
-
-        <div className={styles.progress}>
-          <ProgressBar animating={loading} />
-        </div>
-
-        <ul
-          ref={sidebarContentsRef}
-          className={clsx("list-group", styles.list)}
-        >
-          {logs.files.map((file, index) => {
-            const logHeader = logHeaders[file.name];
-            return (
-              <li
-                key={file.name}
-                ref={(el) => {
-                  itemRefs.current[index] = el;
-                }}
-                className={clsx(
-                  "list-group-item",
-                  "list-group-item-action",
-                  styles.item,
-                  selectedIndex === index ? styles.active : undefined,
-                )}
-                data-index={index}
-              >
-                <Link
-                  to={logUrl(file.name, logs.log_dir)}
-                  className={styles.logLink}
-                  onClick={() => {
-                    // Also update the current index in state
-                    onSelectedIndexChanged(index);
-                  }}
-                >
-                  <SidebarLogEntry
-                    logHeader={logHeader}
-                    task={file.task || "unknown task"}
-                  />
-                </Link>
-              </li>
-            );
-          })}
-        </ul>
-      </div>
-    </Fragment>
-  );
-};

inspect_ai/_view/www/src/app/sidebar/SidebarLogEntry.module.css

@@ -1,29 +0,0 @@
-.entry {
-  display: flex;
-  flex-direction: row;
-  justify-content: space-between;
-}
-
-.title {
-  overflow: hidden;
-  min-width: 33%;
-}
-
-.task {
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.params {
-  margin-top: 1em;
-}
-
-.scores {
-  width: 100%;
-  display: grid;
-  grid-template-columns: minmax(auto, 1fr) minmax(1fr, 1fr);
-  column-gap: 1rem;
-  justify-content: space-between;
-  margin-top: 0em;
-}

inspect_ai/_view/www/src/app/sidebar/SidebarLogEntry.tsx

@@ -1,96 +0,0 @@
-import clsx from "clsx";
-import { FC, Fragment } from "react";
-import { EvalLogHeader } from "../../client/api/types";
-import { kModelNone } from "../../constants";
-import { EvalStatus } from "./EvalStatus";
-import styles from "./SidebarLogEntry.module.css";
-
-interface SidebarLogEntryProps {
-  logHeader?: EvalLogHeader;
-  task: string;
-}
-
-export const SidebarLogEntry: FC<SidebarLogEntryProps> = ({
-  logHeader,
-  task,
-}) => {
-  const hyperparameters: Record<string, unknown> = {
-    ...(logHeader?.plan?.config || {}),
-    ...(logHeader?.eval?.task_args || {}),
-  };
-
-  const model = logHeader?.eval?.model;
-  const datasetName = logHeader?.eval?.dataset.name;
-
-  const uniqScorers = new Set();
-  logHeader?.results?.scores?.forEach((scorer) => {
-    uniqScorers.add(scorer.name);
-  });
-  const scorerNames = Array.from(uniqScorers).join(",");
-
-  const scorerLabel =
-    Object.keys(logHeader?.results?.scores || {}).length === 1
-      ? "scorer"
-      : "scorers";
-
-  const completed = logHeader?.stats?.completed_at;
-  const time = completed ? new Date(completed) : undefined;
-  const timeStr = time
-    ? `${time.toDateString()}
-    ${time.toLocaleTimeString([], {
-      hour: "2-digit",
-      minute: "2-digit",
-    })}`
-    : "";
-
-  return (
-    <Fragment>
-      <div className={styles.entry}>
-        <div className={styles.title}>
-          <div className={clsx(styles.task, "text-size-title-secondary")}>
-            {logHeader?.eval?.task || task}
-          </div>
-          <small className={clsx("mb-1", "text-size-small")}>{timeStr}</small>
-
-          {model && model !== kModelNone ? (
-            <div>
-              <small className={clsx("mb-1", "text-size-small")}>{model}</small>
-            </div>
-          ) : (
-            ""
-          )}
-        </div>
-        <EvalStatus logHeader={logHeader} />
-      </div>
-      <div className={clsx(styles.params, "three-line-clamp")}>
-        <small className={"mb-1"}>
-          {hyperparameters
-            ? Object.keys(hyperparameters)
-                .map((key) => {
-                  const val = hyperparameters[key];
-                  if (Array.isArray(val) || typeof val === "object") {
-                    return `${key}: ${JSON.stringify(val)}`;
-                  } else {
-                    return `${key}: ${val}`;
-                  }
-                })
-                .join(", ")
-            : ""}
-        </small>
-      </div>
-      {(logHeader?.eval?.dataset || logHeader?.results?.scores) &&
-      logHeader?.status === "success" ? (
-        <div
-          className={clsx("text-truncate", "text-size-small", styles.scores)}
-        >
-          <div>dataset: {datasetName || "(samples)"}</div>
-          <div className={clsx("text-truncate", styles.scoreInfo)}>
-            {scorerLabel}: {scorerNames || "(none)"}
-          </div>
-        </div>
-      ) : (
-        ""
-      )}
-    </Fragment>
-  );
-};

inspect_ai/_view/www/src/app/sidebar/SidebarScoreView.module.css

@@ -1,23 +0,0 @@
-.container {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  justify-content: flex-end;
-}
-
-.metric {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-end;
-  margin-left: 1em;
-  margin-bottom: 0.4em;
-  margin-top: 0.5rem;
-}
-
-.metricName {
-  margin-bottom: -0.3em;
-}
-
-.metricReducer {
-  margin-bottom: -0.2rem;
-}

inspect_ai/_view/www/src/app/sidebar/SidebarScoreView.tsx

@@ -1,44 +0,0 @@
-import clsx from "clsx";
-import { EvalScore } from "../../@types/log";
-import { formatPrettyDecimal } from "../../utils/format";
-
-import { FC } from "react";
-import { metricDisplayName } from "../log-view/utils";
-import styles from "./SidebarScoreView.module.css";
-interface SidebarScoreProps {
-  scorer: EvalScore;
-}
-
-export const SidebarScoreView: FC<SidebarScoreProps> = ({ scorer }) => {
-  const showReducer = !!scorer.reducer;
-  return (
-    <div className={styles.container}>
-      {Object.keys(scorer.metrics).map((metric) => {
-        return (
-          <div className={styles.metric} key={metric}>
-            <div
-              className={clsx(
-                "text-style-secondary",
-                "text-style-label",
-                "text-size-small",
-                styles.metricName,
-              )}
-            >
-              {metricDisplayName(scorer.metrics[metric])}
-            </div>
-            {showReducer ? (
-              <div className={clsx("text-size-small", styles.metricReducer)}>
-                {scorer.reducer || "default"}
-              </div>
-            ) : (
-              ""
-            )}
-            <div className={"text-size-title-secondary"}>
-              {formatPrettyDecimal(scorer.metrics[metric].value)}
-            </div>
-          </div>
-        );
-      })}
-    </div>
-  );
-};