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

inspect_ai/_view/www/src/samples/tools/SelectScorer.mjs

@@ -1,141 +0,0 @@
-import { html } from "htm/preact";
-import { FontSize, TextStyle } from "../../appearance/Fonts.mjs";
-
-/**
- * @param {Object} props
- * @param {import("../../Types.mjs").ScoreLabel[]} props.scores
- * @param {import("../../Types.mjs").ScoreLabel} props.score
- * @param {(score: import("../../Types.mjs").ScoreLabel) => void} props.setScore
- * @returns {import("preact").JSX.Element}
- */
-export const SelectScorer = ({ scores, score, setScore }) => {
-  const scorers = scores.reduce((accum, scorer) => {
-    if (
-      !accum.find((sc) => {
-        return scorer.scorer === sc.scorer;
-      })
-    ) {
-      accum.push(scorer);
-    }
-    return accum;
-  }, []);
-
-  if (scorers.length === 1) {
-    // There is only a single scorer in play, just show the list of available scores
-    return html`
-      <div style=${{ display: "flex" }}>
-        <span
-          class="select-scorer-label"
-          style=${{
-            alignSelf: "center",
-            fontSize: FontSize.smaller,
-            ...TextStyle.label,
-            ...TextStyle.secondary,
-          }}
-          >Score:</span
-        >
-        <${ScoreSelector}
-          scores=${scores}
-          selectedIndex=${scoreIndex(score, scores)}
-          selectedIndexChanged=${(index) => {
-            setScore(scores[index]);
-          }}
-        />
-      </div>
-    `;
-  } else {
-    // selected scorer
-
-    const scorerScores = scores.filter((sc) => {
-      return sc.scorer === score.scorer;
-    });
-
-    const selectors = [
-      html`<${ScorerSelector}
-        scorers=${scorers}
-        selectedIndex=${scorerIndex(score, scorers)}
-        selectedIndexChanged=${(index) => {
-          setScore(scorers[index]);
-        }}
-      />`,
-    ];
-    if (scorerScores.length > 1) {
-      selectors.push(
-        html`<${ScoreSelector}
-          style=${{ marginLeft: "1em" }}
-          scores=${scorerScores}
-          selectedIndex=${scoreIndex(score, scorerScores)}
-          selectedIndexChanged=${(index) => {
-            setScore(scorerScores[index]);
-          }}
-        />`,
-      );
-    }
-
-    // There are multiple scorers, so show a scorer selector and a r
-    return html`
-      <div style=${{ display: "flex" }}>
-        <span
-          class="select-scorer-label"
-          style=${{
-            alignSelf: "center",
-            fontSize: FontSize.smaller,
-            ...TextStyle.label,
-            ...TextStyle.secondary,
-            marginRight: "0.3em",
-            marginLeft: "0.2em",
-          }}
-          >Scorer:</span
-        >
-        ${selectors}
-      </div>
-    `;
-  }
-};
-
-const ScoreSelector = ({
-  scores,
-  selectedIndex,
-  selectedIndexChanged,
-  style,
-}) => {
-  return html`<select
-    class="form-select form-select-sm"
-    aria-label=".select-scorer-label"
-    style=${{ fontSize: FontSize.smaller, ...style }}
-    value=${scores[selectedIndex].name}
-    onChange=${(e) => {
-      selectedIndexChanged(e.target.selectedIndex);
-    }}
-  >
-    ${scores.map((score) => {
-      return html`<option value="${score.name}">${score.name}</option>`;
-    })}
-  </select>`;
-};
-
-const ScorerSelector = ({ scorers, selectedIndex, selectedIndexChanged }) => {
-  return html`<select
-    class="form-select form-select-sm"
-    aria-label=".epoch-filter-label"
-    style=${{ fontSize: FontSize.smaller }}
-    value=${scorers[selectedIndex].scorer}
-    onChange=${(e) => {
-      selectedIndexChanged(e.target.selectedIndex);
-    }}
-  >
-    ${scorers.map((scorer) => {
-      return html`<option value="${scorer.scorer}">${scorer.scorer}</option>`;
-    })}
-  </select>`;
-};
-
-const scoreIndex = (score, scores) =>
-  scores.findIndex((sc) => {
-    return sc.name === score.name && sc.scorer === score.scorer;
-  });
-
-const scorerIndex = (score, scores) =>
-  scores.findIndex((sc) => {
-    return sc.scorer === score.scorer;
-  });

inspect_ai/_view/www/src/samples/tools/SortFilter.mjs

@@ -1,151 +0,0 @@
-import { html } from "htm/preact";
-import { isNumeric } from "../../utils/Type.mjs";
-import { FontSize, TextStyle } from "../../appearance/Fonts.mjs";
-import {
-  kEpochAscVal,
-  kEpochDescVal,
-  kSampleAscVal,
-  kSampleDescVal,
-  kScoreAscVal,
-  kScoreDescVal,
-} from "../../constants.mjs";
-
-export const SortFilter = ({ sampleDescriptor, sort, setSort, epochs }) => {
-  const options = [
-    { label: "sample asc", val: kSampleAscVal },
-    { label: "sample desc", val: kSampleDescVal },
-  ];
-  if (epochs) {
-    options.push({
-      label: "epoch asc",
-      val: kEpochAscVal,
-    });
-    options.push({
-      label: "epoch desc",
-      val: kEpochDescVal,
-    });
-  }
-  if (sampleDescriptor?.selectedScoreDescriptor?.compare) {
-    options.push({
-      label: "score asc",
-      val: kScoreAscVal,
-    });
-    options.push({
-      label: "score desc",
-      val: kScoreDescVal,
-    });
-  }
-  return html`
-    <div style=${{ display: "flex" }}>
-      <span
-        class="sort-filter-label"
-        style=${{
-          alignSelf: "center",
-          fontSize: FontSize.smaller,
-          ...TextStyle.label,
-          ...TextStyle.secondary,
-          marginRight: "0.3em",
-          marginLeft: "0.2em",
-        }}
-        >Sort:</span
-      >
-      <select
-        class="form-select form-select-sm"
-        aria-label=".sort-filter-label"
-        style=${{ fontSize: FontSize.smaller }}
-        value=${sort}
-        onChange=${(e) => {
-          setSort(e.target.value);
-        }}
-      >
-        ${options.map((option) => {
-          return html`<option value="${option.val}">${option.label}</option>`;
-        })}
-      </select>
-    </div>
-  `;
-};
-
-export const byEpoch = (sort) => {
-  return sort === kEpochAscVal || sort === kEpochDescVal;
-};
-
-export const bySample = (sort) => {
-  return sort === kSampleAscVal || sort === kSampleDescVal;
-};
-
-const sortId = (a, b) => {
-  if (isNumeric(a.id) && isNumeric(b.id)) {
-    return Number(a.id) - Number(b.id);
-  } else {
-    // Note that if there are mixed types of ids (e.g. a string
-    // and a number), we need to be sure we're working with strings
-    // to performan the comparison
-    return String(a.id).localeCompare(String(b.id));
-  }
-};
-
-/**
- * Sorts a list of samples
- *
- * @param {string} sort - The sort direction
- * @param {import("../../api/Types.ts").SampleSummary[]} samples - The samples
- * @param {import("../SamplesDescriptor.mjs").SamplesDescriptor} samplesDescriptor - The samples descriptor
- * @returns {{ sorted: import("../../api/Types.ts").SampleSummary[], order: 'asc' | 'desc' }} An object with sorted samples and the sort order.
- */
-export const sortSamples = (sort, samples, samplesDescriptor) => {
-  const sortedSamples = samples.sort((a, b) => {
-    switch (sort) {
-      case kSampleAscVal: {
-        const result = sortId(a, b);
-        if (result !== 0) {
-          return result;
-        } else {
-          return a.epoch - b.epoch;
-        }
-      }
-      case kSampleDescVal: {
-        const result = sortId(b, a);
-        if (result !== 0) {
-          return result;
-        } else {
-          return a.epoch - b.epoch;
-        }
-      }
-      case kEpochAscVal: {
-        const result = a.epoch - b.epoch;
-        if (result !== 0) {
-          return result;
-        } else {
-          return sortId(a, b);
-        }
-      }
-      case kEpochDescVal: {
-        const result = b.epoch - a.epoch;
-        if (result !== 0) {
-          return result;
-        } else {
-          return sortId(a, b);
-        }
-      }
-
-      case kScoreAscVal:
-        return samplesDescriptor.selectedScoreDescriptor.compare(
-          samplesDescriptor.selectedScore(a).value,
-          samplesDescriptor.selectedScore(b).value,
-        );
-      case kScoreDescVal:
-        return samplesDescriptor.selectedScoreDescriptor.compare(
-          samplesDescriptor.selectedScore(b).value,
-          samplesDescriptor.selectedScore(a).value,
-        );
-    }
-  });
-  return {
-    sorted: sortedSamples,
-    order:
-      sort === kSampleAscVal || sort === kEpochAscVal || sort === kScoreAscVal
-        ? "asc"
-        : "desc",
-  };
-};

inspect_ai/_view/www/src/samples/transcript/ApprovalEventView.mjs

@@ -1,71 +0,0 @@
-// @ts-check
-import { html } from "htm/preact";
-import { ApplicationIcons } from "../../appearance/Icons.mjs";
-import { EventRow } from "./EventRow.mjs";
-
-/**
- * Renders the ApprovalEventView component.
- *
- * @param {Object} props - The properties passed to the component.
- * @param { string  } props.id - The id of this event.
- * @param {import("../../types/log").ApprovalEvent} props.event - The event object to display.
- * @param { Object } props.style - The style of this event.
- * @returns {import("preact").JSX.Element} The component.
- */
-export const ApprovalEventView = ({ id, event, style }) => {
-  return html`
-  <${EventRow}
-      id=${id}
-      title="${decisionLabel(event.decision)}"
-      icon=${decisionIcon(event.decision)}  
-      style=${style}
-    >
-    ${event.explanation}
-  </${EventRow}>`;
-};
-
-/**
- * Determines the label for a decision
- *
- * @param {string} decision - The decision
- * @returns {string} The label for this decision.
- */
-const decisionLabel = (decision) => {
-  switch (decision) {
-    case "approve":
-      return "Approved";
-    case "reject":
-      return "Rejected";
-    case "terminate":
-      return "Terminated";
-    case "escalate":
-      return "Escalated";
-    case "modify":
-      return "Modified";
-    default:
-      return decision;
-  }
-};
-
-/**
- * Determines the icon for a decision
- *
- * @param {string} decision - The decision
- * @returns {string} The icon for this decision.
- */
-const decisionIcon = (decision) => {
-  switch (decision) {
-    case "approve":
-      return ApplicationIcons.approvals.approve;
-    case "reject":
-      return ApplicationIcons.approvals.reject;
-    case "terminate":
-      return ApplicationIcons.approvals.terminate;
-    case "escalate":
-      return ApplicationIcons.approvals.escalate;
-    case "modify":
-      return ApplicationIcons.approvals.modify;
-    default:
-      return ApplicationIcons.approve;
-  }
-};

inspect_ai/_view/www/src/samples/transcript/ErrorEventView.mjs

@@ -1,44 +0,0 @@
-// @ts-check
-import { html } from "htm/preact";
-import { EventPanel } from "./EventPanel.mjs";
-import { ApplicationIcons } from "../../appearance/Icons.mjs";
-import { ANSIDisplay } from "../../components/AnsiDisplay.mjs";
-import { formatDateTime } from "../../utils/Format.mjs";
-
-/**
- * Renders the ErrorEventView component.
- *
- * @param {Object} props - The properties passed to the component.
- * @param { string  } props.id - The id of this event.
- * @param {import("../../types/log").ErrorEvent} props.event - The event object to display.
- * @param { Object } props.style - The style of this event.
- * @param {import("./Types.mjs").TranscriptEventState} props.eventState - The state for this event
- * @param {(state: import("./Types.mjs").TranscriptEventState) => void} props.setEventState - Update the state for this event
- * @returns {import("preact").JSX.Element} The component.
- */
-export const ErrorEventView = ({
-  id,
-  event,
-  style,
-  eventState,
-  setEventState,
-}) => {
-  return html`
-  <${EventPanel} 
-    id=${id} 
-    title="Error" 
-    subTitle=${formatDateTime(new Date(event.timestamp))} 
-    icon=${ApplicationIcons.error} 
-    style=${style}
-    selectedNav=${eventState.selectedNav || ""}
-    onSelectedNav=${(selectedNav) => {
-      setEventState({ ...eventState, selectedNav });
-    }}
-    collapsed=${eventState.collapsed}
-    onCollapsed=${(collapsed) => {
-      setEventState({ ...eventState, collapsed });
-    }}
-  >
-    <${ANSIDisplay} output=${event.error.traceback_ansi} style=${{ fontSize: "clamp(0.5rem, calc(0.25em + 1vw), 0.8rem)", margin: "0.5em 0" }}/>
-  </${EventPanel}>`;
-};

inspect_ai/_view/www/src/samples/transcript/EventPanel.mjs

@@ -1,271 +0,0 @@
-// @ts-check
-import { html } from "htm/preact";
-import { ApplicationIcons } from "../../appearance/Icons.mjs";
-import { FontSize, TextStyle } from "../../appearance/Fonts.mjs";
-
-/**
- * Renders the StateEventView component.
- *
- * @param {Object} props - The properties passed to the component.
- * @param {string} props.id - The id of the event
- * @param {string} props.classes - The classes for this element
- * @param {string | undefined} props.title - The name of the event
- * @param {string} props.subTitle - The subtitle for the event
- * @param {string | undefined} props.text - Secondary text for the event
- * @param {string | undefined} props.icon - The icon of the event
- * @param {number | undefined} props.titleColor - The title color of this item
- * @param {boolean | undefined} props.collapse - Default collapse behavior for card. If omitted, not collapsible.
- * @param {(collapse: boolean) => void} props.onCollapsed - handler for when collapsing
- * @param {boolean} props.collapsed - handler for when collapsing
- * @param {Object} props.style - The style properties passed to the component.
- * @param {Object} props.titleStyle - The style properties passed to the title component.
- * @param {(nav: string) => void} props.onSelectedNav - Handler for selected nav changed
- * @param {string} props.selectedNav - The selected nav for this panel
- * @param {import("preact").ComponentChildren} props.children - The rendered event.
- * @returns {import("preact").JSX.Element} The component.
- */
-export const EventPanel = ({
-  id,
-  classes,
-  title,
-  subTitle,
-  text,
-  icon,
-  titleColor,
-  collapse,
-  collapsed,
-  onCollapsed,
-  style,
-  titleStyle,
-  children,
-  onSelectedNav,
-  selectedNav,
-}) => {
-  const hasCollapse = collapse !== undefined;
-  const isCollapsed = collapsed === undefined ? collapse : collapsed;
-
-  /**
-   * Generates the id for the navigation pill.
-   *
-   * @param {number} index - The index of the pill.
-   * @returns {string} The generated id.
-   */
-  const pillId = (index) => {
-    return `${id}-nav-pill-${index}`;
-  };
-
-  const filteredArrChildren = (
-    Array.isArray(children) ? children : [children]
-  ).filter((child) => !!child);
-  const defaultPillId = pillId(0);
-
-  const gridColumns = [];
-  if (hasCollapse) {
-    gridColumns.push("minmax(0, max-content)");
-  }
-  if (icon) {
-    gridColumns.push("max-content");
-  }
-  gridColumns.push("minmax(0, max-content)");
-  if (subTitle) {
-    gridColumns.push("minmax(0, max-content)");
-  }
-  gridColumns.push("auto");
-  gridColumns.push("minmax(0, max-content)");
-  gridColumns.push("minmax(0, max-content)");
-
-  const titleEl =
-    title || icon || filteredArrChildren.length > 1
-      ? html`<div
-          title=${subTitle}
-          style=${{
-            display: "grid",
-            gridTemplateColumns: gridColumns.join(" "),
-            columnGap: "0.3em",
-            fontSize: FontSize.small,
-            cursor: hasCollapse ? "pointer" : undefined,
-          }}
-        >
-          ${hasCollapse
-            ? html`<i
-                onclick=${() => {
-                  onCollapsed(!isCollapsed);
-                }}
-                class=${isCollapsed
-                  ? ApplicationIcons.chevron.right
-                  : ApplicationIcons.chevron.down}
-              />`
-            : ""}
-          ${icon
-            ? html`<i
-                class=${icon || ApplicationIcons.metadata}
-                style=${{
-                  ...TextStyle.secondary,
-                  color: titleColor ? titleColor : "",
-                  ...titleStyle,
-                }}
-                onclick=${() => {
-                  onCollapsed(!isCollapsed);
-                }}
-              />`
-            : ""}
-          <div
-            style=${{
-              ...TextStyle.label,
-              ...TextStyle.secondary,
-              color: titleColor ? titleColor : "",
-              ...titleStyle,
-            }}
-            onclick=${() => {
-              onCollapsed(!isCollapsed);
-            }}
-          >
-            ${title}
-          </div>
-          <div
-            onclick=${() => {
-              onCollapsed(!isCollapsed);
-            }}
-          ></div>
-          <div
-            style=${{
-              justifySelf: "end",
-              ...TextStyle.secondary,
-              marginRight: "0.2em",
-            }}
-            onclick=${() => {
-              onCollapsed(!isCollapsed);
-            }}
-          >
-            ${collapsed ? text : ""}
-          </div>
-          <div
-            style=${{
-              justifySelf: "end",
-              display: "flex",
-              flexDirection: "columns",
-            }}
-          >
-            ${(!hasCollapse || !isCollapsed) &&
-            filteredArrChildren &&
-            filteredArrChildren.length > 1
-              ? html` <${EventNavs}
-                  navs=${filteredArrChildren.map((child, index) => {
-                    const defaultTitle = `Tab ${index}`;
-                    const title =
-                      child && typeof child === "object"
-                        ? child["props"]?.name || defaultTitle
-                        : defaultTitle;
-                    return {
-                      id: `eventpanel-${id}-${index}`,
-                      title: title,
-                      target: pillId(index),
-                    };
-                  })}
-                  selectedNav=${selectedNav || defaultPillId}
-                  setSelectedNav=${onSelectedNav}
-                />`
-              : ""}
-          </div>
-        </div>`
-      : "";
-
-  const card = html` <div
-    id=${id}
-    style=${{
-      padding: "0.625rem",
-      border: "solid 1px var(--bs-light-border-subtle)",
-      borderRadius: "var(--bs-border-radius)",
-      ...style,
-    }}
-    class=${classes || undefined}
-  >
-    ${titleEl}
-    <div
-      class="tab-content"
-      style=${{
-        padding: "0",
-        display: !hasCollapse || !isCollapsed ? "inherit" : "none",
-      }}
-    >
-      ${filteredArrChildren?.map((child, index) => {
-        const id = pillId(index);
-        const isSelected = selectedNav
-          ? id === selectedNav
-          : id === defaultPillId;
-
-        return html`<div
-          id=${id}
-          class="tab-pane show ${isSelected ? "active" : ""}"
-        >
-          ${child}
-        </div>`;
-      })}
-    </div>
-  </div>`;
-  return card;
-};
-
-/**
- * Component to render navigation items.
- *
- * @param {Object} props - The component properties.
- * @param {Array<{id: string, title: string, target: string}>} props.navs - The array of navigation items.
- * @param {string} props.selectedNav - The id of the selected nav item.
- * @param {(target: string) => void} props.setSelectedNav - Select this nav target
- * @returns {import("preact").ComponentChildren} - The rendered navigation items as a list.
- */
-const EventNavs = ({ navs, selectedNav, setSelectedNav }) => {
-  return html`<ul
-    class="nav nav-pills card-header-pills"
-    style=${{ marginRight: "0" }}
-    role="tablist"
-    aria-orientation="horizontal"
-  >
-    ${navs.map((nav, index) => {
-      return html`<${EventNav}
-        active=${index === 0}
-        id=${nav.id}
-        target=${nav.target}
-        title=${nav.title}
-        selectedNav=${selectedNav}
-        setSelectedNav=${setSelectedNav}
-      />`;
-    })}
-  </ul>`;
-};
-
-/**
- * Component to render a single navigation item.
- *
- * @param {Object} props - The component properties.
- * @param {string} props.target - The target of the navigation item.
- * @param {string} props.title - The title of the navigation item.
- * @param {string} props.selectedNav - The id of the selected nav item.
- * @param {(target: string) => void} props.setSelectedNav - Select this nav target
- * @returns {import("preact").ComponentChildren} - The rendered navigation item.
- */
-const EventNav = ({ target, title, selectedNav, setSelectedNav }) => {
-  const active = target === selectedNav;
-  return html`<li class="nav-item">
-    <button
-      type="button"
-      role="tab"
-      aria-controls=${target}
-      aria-selected=${active}
-      style=${{
-        minWidth: "4rem",
-        ...TextStyle.label,
-        fontSize: FontSize.small,
-        padding: "0.1rem  0.6rem",
-        borderRadius: "var(--bs-border-radius)",
-      }}
-      class="nav-link ${active ? "active " : ""}"
-      onclick=${() => {
-        setSelectedNav(target);
-      }}
-    >
-      ${title}
-    </button>
-  </li>`;
-};