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

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

@@ -1,190 +0,0 @@
-import { html } from "htm/preact";
-import { useCallback, useEffect, useRef } from "preact/hooks";
-
-import { FontSize } from "../appearance/Fonts.mjs";
-import { ProgressBar } from "./ProgressBar.mjs";
-import { MessageBand } from "./MessageBand.mjs";
-
-export const LargeModal = ({
-  id,
-  title,
-  detail,
-  detailTools,
-  footer,
-  onkeyup,
-  visible,
-  onHide,
-  showProgress,
-  children,
-  initialScrollPositionRef,
-  setInitialScrollPosition,
-  warning,
-  warningHidden,
-  setWarningHidden,
-  scrollRef,
-}) => {
-  // The footer
-  const modalFooter = footer
-    ? html`<div class="modal-footer">${footer}</div>`
-    : "";
-
-  // Support restoring the scroll position
-  // but only do this for the first time that the children are set
-  scrollRef = scrollRef || useRef(/** @type {HTMLElement|null} */ (null));
-  useEffect(() => {
-    if (scrollRef.current) {
-      setTimeout(() => {
-        if (scrollRef.current.scrollTop !== initialScrollPositionRef?.current) {
-          scrollRef.current.scrollTop = initialScrollPositionRef?.current;
-        }
-      }, 0);
-    }
-  }, []);
-
-  const onScroll = useCallback(
-    (e) => {
-      setInitialScrollPosition(e.srcElement.scrollTop);
-    },
-    [setInitialScrollPosition],
-  );
-
-  // Capture header elements
-  const headerEls = [];
-  // The title
-  headerEls.push(
-    html`<div
-      class="modal-title"
-      style=${{ fontSize: FontSize.smaller, flex: "1 1 auto" }}
-    >
-      ${title || ""}
-    </div>`,
-  );
-
-  // A centered text element with tools to the left and right
-  if (detail) {
-    headerEls.push(
-      html`<div
-        style=${{
-          marginLeft: "auto",
-          marginRight: "auto",
-          display: "flex",
-          flex: "1 1 auto",
-          justifyContent: "center",
-        }}
-      >
-        ${detailTools.left
-          ? detailTools.left.map((tool) => {
-              return html`<${TitleTool} ...${tool} />`;
-            })
-          : ""}
-        <div
-          style=${{
-            fontSize: FontSize.smaller,
-            display: "flex",
-            alignItems: "center",
-          }}
-        >
-          <div>${detail}</div>
-        </div>
-        ${detailTools.right
-          ? detailTools.right.map((tool) => {
-              return html`<${TitleTool} ...${tool} />`;
-            })
-          : ""}
-      </div>`,
-    );
-  }
-
-  // The close 'x'
-  headerEls.push(html`<button
-      type="button"
-      class="btn btn-close-large-dialog"
-      onclick=${() => {
-        onHide();
-      }}
-      aria-label="Close"
-      style=${{
-        borderWidth: "0px",
-        fontSize: FontSize.larger,
-        fontWeight: "300",
-        padding: "0em 0.5em",
-        flex: 1,
-        textAlign: "right",
-      }}
-    >
-      <${HtmlEntity}>&times;</${HtmlEntity}>
-    </button>`);
-
-  return html`<div
-    id=${id}
-    class="modal"
-    tabindex="0"
-    role="dialog"
-    onkeyup=${onkeyup}
-    style=${{
-      borderRadius: "var(--bs-border-radius)",
-      display: visible ? "block" : "none",
-    }}
-    tabindex=${visible ? 0 : undefined}
-  >
-    <div
-      class="modal-dialog modal-dialog-scrollable"
-      style=${{
-        maxWidth: "100%",
-        marginLeft: "var(--bs-modal-margin)",
-        marginRight: "var(--bs-modal-margin)",
-      }}
-      role="document"
-    >
-      <div class="modal-content" style=${{ height: "100%" }}>
-        <div
-          class="modal-header"
-          style=${{ padding: "0 0 0 1em", display: "flex" }}
-        >
-          ${headerEls}
-        </div>
-        <${ProgressBar}
-          animating=${showProgress}
-          containerStyle=${{
-            marginBottom: "-2px",
-            backgroundColor: "var(--bs-body-bg)",
-          }}
-        />
-
-        ${warning
-          ? html`<${MessageBand}
-              message=${warning}
-              hidden=${warningHidden}
-              setHidden=${setWarningHidden}
-              type="warning"
-            />`
-          : ""}
-        <div class="modal-body" ref=${scrollRef} onscroll=${onScroll}>
-          ${children}
-        </div>
-        ${modalFooter}
-      </div>
-    </div>
-  </div>`;
-};
-
-const HtmlEntity = ({ children }) =>
-  html`<span dangerouslySetInnerHTML=${{ __html: children }} />`;
-
-const TitleTool = ({ label, icon, enabled, onclick }) => {
-  return html`<button
-    type="button"
-    class="btn btn-outline"
-    aria-label=${label}
-    onclick=${onclick}
-    disabled=${!enabled}
-    style=${{
-      paddingTop: 0,
-      paddingBottom: 0,
-      border: "none",
-      fontSize: FontSize.small,
-    }}
-  >
-    <i class="${icon}" />
-  </button>`;
-};

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

@@ -1,217 +0,0 @@
-import { html } from "htm/preact";
-import { useState, useCallback, useEffect } from "preact/hooks";
-import { ApplicationIcons } from "../appearance/Icons.mjs";
-
-/**
- * @typedef {Object} Slide
- * @property {string} label - The label for the slide.
- * @property {() => import("preact").JSX.Element} render - A function that returns another function to render the slide as a JSX element.
- */
-
-/**
- * LightboxCarousel component provides a carousel with lightbox functionality.
- * @param {Object} props - Component properties.
- * @property {Array<Slide>} props.slides - Array of slide render functions.
- * @returns {import("preact").JSX.Element} LightboxCarousel component.
- */
-export const LightboxCarousel = ({ slides }) => {
-  const [isOpen, setIsOpen] = useState(false);
-  const [showOverlay, setShowOverlay] = useState(false);
-  const [currentIndex, setCurrentIndex] = useState(0);
-
-  const openLightbox = (index) => {
-    setCurrentIndex(index);
-    setShowOverlay(true);
-
-    // Slight delay before setting isOpen so the fade-in starts from opacity: 0
-    setTimeout(() => setIsOpen(true), 10);
-  };
-
-  const closeLightbox = () => {
-    setIsOpen(false);
-  };
-
-  // Remove the overlay from the DOM after fade-out completes
-  useEffect(() => {
-    if (!isOpen && showOverlay) {
-      const timer = setTimeout(() => {
-        setShowOverlay(false);
-      }, 300); // match your transition duration
-      return () => clearTimeout(timer);
-    }
-  }, [isOpen, showOverlay]);
-
-  const showNext = useCallback(() => {
-    setCurrentIndex((prev) => {
-      return (prev + 1) % slides.length;
-    });
-  }, [slides]);
-
-  const showPrev = useCallback(() => {
-    setCurrentIndex((prev) => (prev - 1 + slides.length) % slides.length);
-  }, [slides]);
-
-  // Keyboard Navigation
-  useEffect(() => {
-    if (!isOpen) return;
-    const handleKeyUp = (e) => {
-      if (e.key === "Escape") {
-        closeLightbox();
-      } else if (e.key === "ArrowRight") {
-        showNext();
-      } else if (e.key === "ArrowLeft") {
-        showPrev();
-      }
-      e.preventDefault();
-      e.stopPropagation();
-    };
-    window.addEventListener("keyup", handleKeyUp, true);
-    return () => window.removeEventListener("keyup", handleKeyUp);
-  }, [isOpen, showNext, showPrev]);
-
-  // Common button style
-  const buttonStyle = {
-    position: "absolute",
-    top: "50%",
-    transform: "translateY(-50%)",
-    background: "none",
-    color: "#fff",
-    border: "none",
-    padding: "0.5em",
-    fontSize: "3em",
-    cursor: "pointer",
-    zIndex: "9999",
-  };
-
-  const prevButtonStyle = {
-    ...buttonStyle,
-    left: "10px",
-  };
-
-  const nextButtonStyle = {
-    ...buttonStyle,
-    right: "10px",
-  };
-
-  // Overlay style (fixed to fill the screen, flex for centering)
-  const overlayStyle = {
-    position: "fixed",
-    top: 0,
-    left: 0,
-    width: "100vw",
-    height: "100vh",
-    background: "rgba(0,0,0,0.8)",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    opacity: isOpen ? "1" : "0",
-    visibility: isOpen ? "visible" : "hidden",
-    transition: "opacity 0.3s ease, visibility 0.3s ease",
-    zIndex: 9998,
-  };
-
-  // Close button style
-  const closeButtonWrapperStyle = {
-    position: "absolute",
-    top: "10px",
-    right: "10px",
-  };
-
-  const closeButtonStyle = {
-    border: "none",
-    background: "none",
-    color: "#fff",
-    fontSize: "3em",
-    fontWeight: "500",
-    cursor: "pointer",
-    paddingLeft: "1em",
-    paddingBottom: "1em",
-    zIndex: "10000",
-  };
-
-  // Lightbox content container style
-  const contentStyle = {
-    maxWidth: "90%",
-    maxHeight: "90%",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    position: "relative",
-    // fade in/out
-    opacity: isOpen ? "1" : "0",
-    visibility: isOpen ? "visible" : "hidden",
-    transition: "opacity 0.3s ease, visibility 0.3s ease",
-    zIndex: 9999,
-  };
-
-  return html`
-    <div className="lightbox-carousel-container">
-      <!-- Thumbnails -->
-      <div
-        className="carousel-thumbs"
-        style=${{
-          display: "grid",
-          gridTemplateColumns: "auto auto auto auto",
-        }}
-      >
-        ${slides.map((slide, index) => {
-          return html`
-            <div
-              key=${index}
-              className="carousel-thumb"
-              onClick=${() => openLightbox(index)}
-              style=${{
-                background: "black",
-                color: "white",
-                padding: "4em 0",
-                border: "0",
-                margin: "5px",
-                cursor: "pointer",
-                textAlign: "center",
-              }}
-            >
-              <div>${slide.label}</div>
-              <div>
-                <i
-                  class=${ApplicationIcons.play}
-                  style=${{ fontSize: "4em" }}
-                ></i>
-              </div>
-            </div>
-          `;
-        })}
-      </div>
-
-      <!-- Lightbox Overlay -->
-      ${showOverlay &&
-      html`
-        <div className="lightbox-overlay" style=${overlayStyle}>
-          <div style=${closeButtonWrapperStyle}>
-            <button style=${closeButtonStyle} onClick=${closeLightbox}>
-              <i class=${ApplicationIcons.close}></i>
-            </button>
-          </div>
-
-          ${slides.length > 1
-            ? html` <button style=${prevButtonStyle} onClick=${showPrev}>
-                <i class=${ApplicationIcons.previous}></i>
-              </button>`
-            : ""}
-          ${slides.length > 1
-            ? html` <button style=${nextButtonStyle} onClick=${showNext}>
-                <i class=${ApplicationIcons.next}></i>
-              </button>`
-            : ""}
-
-          <div
-            key=${`carousel-slide-${currentIndex}`}
-            className="lightbox-content"
-            style=${contentStyle}
-          >
-            ${slides[currentIndex].render()}
-          </div>
-        </div>
-      `}
-    </div>
-  `;
-};

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

@@ -1,118 +0,0 @@
-import markdownit from "markdown-it";
-import { html } from "htm/preact";
-
-export const MarkdownDiv = (props) => {
-  const { markdown, style, contentRef } = props;
-
-  // Escape all tags
-  const escaped = markdown ? escape(markdown) : "";
-
-  // Pre-render any text that isn't handled by markdown
-  const preRendered = preRenderText(escaped);
-
-  const protectedText = protectMarkdown(preRendered);
-
-  let renderedHtml = protectedText;
-  try {
-    const md = markdownit({
-      breaks: true,
-      html: true,
-    });
-    renderedHtml = md.render(protectedText);
-  } catch (ex) {
-    console.log("Unable to markdown render content");
-    console.error(ex);
-  }
-
-  const unescaped = unprotectMarkdown(renderedHtml);
-
-  // For `code` tags, reverse the escaping if we can
-  const withCode = unescapeCodeHtmlEntities(unescaped);
-
-  // Return the rendered markdown
-  const markup = { __html: withCode };
-
-  return html`<div
-    ref=${contentRef}
-    dangerouslySetInnerHTML=${markup}
-    style=${style}
-    class="${props.class ? `${props.class} ` : ""}markdown-content"
-  />`;
-};
-
-const kLetterListPattern = /^([a-zA-Z][).]\s.*?)$/gm;
-const kCommonmarkReferenceLinkPattern = /\[([^\]]*)\]: (?!http)(.*)/g;
-
-const preRenderText = (txt) => {
-  // eslint-disable-next-line no-misleading-character-class
-  txt = txt.replace(/^[\u200B\u200C\u200D\u200E\u200F\uFEFF]/, "");
-
-  // Special handling for ordered lists that look like
-  // multiple choice (e.g. a), b), c), d) etc..)
-  return txt.replaceAll(
-    kLetterListPattern,
-    "<p style='margin-bottom: 0.2em;'>$1</p>",
-  );
-};
-
-const protectMarkdown = (txt) => {
-  // Special handling for commonmark like reference links which might
-  // look like:
-  // [alias]: http://www.google.com
-  // but text like:
-  // [expert]: answer
-  // Also fools this
-  return txt.replaceAll(
-    kCommonmarkReferenceLinkPattern,
-    "(open:767A125E)$1(close:767A125E) $2 ",
-  );
-};
-
-const unprotectMarkdown = (txt) => {
-  txt = txt.replaceAll("(open:767A125E)", "[");
-  txt = txt.replaceAll("(close:767A125E)", "]");
-  return txt;
-};
-
-const escape = (content) => {
-  return content.replace(/[<>&'"]/g, function (c) {
-    switch (c) {
-      case "<":
-        return "&lt;";
-      case ">":
-        return "&gt;";
-      case "&":
-        return "&amp;";
-      case "'":
-        return "&apos;";
-      case '"':
-        return "&quot;";
-    }
-  });
-};
-
-function unescapeCodeHtmlEntities(str) {
-  const htmlEntities = {
-    "&lt;": "<",
-    "&gt;": ">",
-    "&amp;": "&",
-    "&#x5C;": "\\",
-    "&quot;": '"',
-  };
-
-  return str.replace(
-    /(<code[^>]*>)([\s\S]*?)(<\/code>)/gi,
-    function (match, starttag, content, endtag) {
-      return (
-        starttag +
-        content.replace(
-          /&(?:amp|lt|gt|quot|#39|#x2F|#x5C|#96);/g,
-          function (entity) {
-            return htmlEntities[entity] || entity;
-          },
-        ) +
-        endtag
-      );
-    },
-  );
-}

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

@@ -1,48 +0,0 @@
-import { html } from "htm/preact";
-
-import { FontSize } from "../appearance/Fonts.mjs";
-
-import { ApplicationIcons } from "../appearance/Icons.mjs";
-
-export const MessageBand = ({ message, hidden, setHidden, type }) => {
-  const bgColor =
-    type === "info" ? "var(--bs-light)" : "var(--bs-" + type + "-bg-subtle)";
-  const color =
-    type === "info" ? undefined : "var(--bs-" + type + "-text-emphasis)";
-
-  return html`
-    <div
-      style=${{
-        gridTemplateColumns: "max-content auto max-content",
-        alignItems: "center",
-        columnGap: "0.5em",
-        fontSize: FontSize.small,
-        color: color,
-        background: bgColor,
-        borderBottom: "solid 1px var(--bs-light-border-subtle)",
-        padding: "0.3em 1em",
-        display: hidden ? "none" : "grid",
-      }}
-    >
-      <i class=${ApplicationIcons.logging[type]} />
-      ${message}
-      <button
-        title="Close"
-        style=${{
-          fontSize: FontSize["title-secondary"],
-          margin: "0",
-          padding: "0",
-          color: color,
-          height: FontSize["title-secondary"],
-          lineHeight: FontSize["title-secondary"],
-        }}
-        class="btn"
-        onclick=${() => {
-          setHidden(true);
-        }}
-      >
-        <i class=${ApplicationIcons.close}></i>
-      </button>
-    </div>
-  `;
-};

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

@@ -1,111 +0,0 @@
-import { html } from "htm/preact";
-import { MarkdownDiv } from "./MarkdownDiv.mjs";
-import { ToolOutput } from "./Tools.mjs";
-
-/**
- * Renders message content based on its type.
- * Supports rendering strings, images, and tools using specific renderers.
- *
- * @param {Object} props - The props object.
- * @param {string|string[]| (import("../types/log").ContentText | import("../types/log").ContentImage | import("../types/log").ContentAudio | import("../types/log").ContentVideo | import("../Types.mjs").ContentTool)[]} props.contents - The content or array of contents to render.
- * @returns {import("preact").JSX.Element | import("preact").JSX.Element[]} The component.
- */
-export const MessageContent = ({ contents }) => {
-  if (Array.isArray(contents)) {
-    return contents.map((content, index) => {
-      if (typeof content === "string") {
-        return messageRenderers["text"].render({
-          text: content,
-          index: index === contents.length - 1,
-        });
-      } else {
-        if (content) {
-          const renderer = messageRenderers[content.type];
-          if (renderer) {
-            return renderer.render(content, index === contents.length - 1);
-          } else {
-            console.error(`Unknown message content type '${content.type}'`);
-          }
-        }
-      }
-    });
-  } else {
-    // This is a simple string
-    return messageRenderers["text"].render({ text: contents });
-  }
-};
-
-// TODO: We should setting overflow scrolling here
-// don't break-all
-const messageRenderers = {
-  text: {
-    render: (content, isLast) => {
-      return html`<${MarkdownDiv}
-        markdown=${content.text}
-        class=${isLast ? "no-last-para-padding" : ""}
-      />`;
-    },
-  },
-  image: {
-    render: (content) => {
-      if (content.image.startsWith("data:")) {
-        return html`<img
-          src="${content.image}"
-          style=${{
-            maxWidth: "800px",
-            border: "solid var(--bs-border-color) 1px",
-          }}
-        />`;
-      } else {
-        return html`<code>${content.image}</code>`;
-      }
-    },
-  },
-  audio: {
-    render: (content) => {
-      return html` <audio controls>
-        <source
-          src=${content.audio}
-          type=${mimeTypeForFormat(content.format)}
-        />
-      </audio>`;
-    },
-  },
-  video: {
-    render: (content) => {
-      return html` <video width="500" height="375" controls>
-        <source
-          src=${content.video}
-          type=${mimeTypeForFormat(content.format)}
-        />
-      </video>`;
-    },
-  },
-  tool: {
-    render: (content) => {
-      return html`<${ToolOutput} output=${content.content} />`;
-    },
-  },
-};
-
-/**
- * Renders message content based on its type.
- * Supports rendering strings, images, and tools using specific renderers.
- *
- * @param {import("../types/log").Format | import("../types/log").Format1 } format - The format
- * @returns {string} - The mime type.
- */
-const mimeTypeForFormat = (format) => {
-  switch (format) {
-    case "mov":
-      return "video/quicktime";
-    case "wav":
-      return "audio/wav";
-    case "mp3":
-      return "audio/mpeg";
-    case "mp4":
-      return "video/mp4";
-    case "mpeg":
-      return "video/mpeg";
-  }
-};