inspect-ai 0.3.70__py3-none-any.whl → 0.3.72__py3-none-any.whl
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- inspect_ai/_cli/eval.py +14 -8
- inspect_ai/_display/core/display.py +2 -0
- inspect_ai/_display/core/footer.py +13 -3
- inspect_ai/_display/plain/display.py +6 -2
- inspect_ai/_display/rich/display.py +19 -6
- inspect_ai/_display/textual/app.py +6 -1
- inspect_ai/_display/textual/display.py +4 -0
- inspect_ai/_display/textual/widgets/transcript.py +10 -6
- inspect_ai/_eval/task/run.py +5 -8
- inspect_ai/_util/content.py +20 -1
- inspect_ai/_util/transcript.py +10 -4
- inspect_ai/_util/working.py +4 -0
- inspect_ai/_view/www/App.css +6 -0
- inspect_ai/_view/www/dist/assets/index.css +115 -87
- inspect_ai/_view/www/dist/assets/index.js +5324 -2276
- inspect_ai/_view/www/eslint.config.mjs +24 -1
- inspect_ai/_view/www/log-schema.json +283 -20
- inspect_ai/_view/www/package.json +8 -3
- inspect_ai/_view/www/src/App.tsx +2 -2
- inspect_ai/_view/www/src/components/AnsiDisplay.tsx +4 -3
- inspect_ai/_view/www/src/components/Card.tsx +9 -8
- inspect_ai/_view/www/src/components/DownloadButton.tsx +2 -1
- inspect_ai/_view/www/src/components/EmptyPanel.tsx +2 -2
- inspect_ai/_view/www/src/components/ErrorPanel.tsx +4 -3
- inspect_ai/_view/www/src/components/ExpandablePanel.tsx +13 -5
- inspect_ai/_view/www/src/components/FindBand.tsx +3 -3
- inspect_ai/_view/www/src/components/HumanBaselineView.tsx +3 -3
- inspect_ai/_view/www/src/components/LabeledValue.tsx +5 -4
- inspect_ai/_view/www/src/components/LargeModal.tsx +18 -13
- inspect_ai/_view/www/src/components/{LightboxCarousel.css → LightboxCarousel.module.css} +22 -18
- inspect_ai/_view/www/src/components/LightboxCarousel.tsx +36 -27
- inspect_ai/_view/www/src/components/MessageBand.tsx +2 -1
- inspect_ai/_view/www/src/components/NavPills.tsx +9 -8
- inspect_ai/_view/www/src/components/ProgressBar.tsx +2 -1
- inspect_ai/_view/www/src/components/TabSet.tsx +21 -15
- inspect_ai/_view/www/src/index.tsx +2 -2
- inspect_ai/_view/www/src/metadata/MetaDataGrid.tsx +11 -9
- inspect_ai/_view/www/src/metadata/MetaDataView.tsx +3 -2
- inspect_ai/_view/www/src/metadata/MetadataGrid.module.css +1 -0
- inspect_ai/_view/www/src/metadata/RenderedContent.tsx +16 -0
- inspect_ai/_view/www/src/plan/DatasetDetailView.tsx +3 -2
- inspect_ai/_view/www/src/plan/DetailStep.tsx +2 -1
- inspect_ai/_view/www/src/plan/PlanCard.tsx +2 -5
- inspect_ai/_view/www/src/plan/PlanDetailView.tsx +6 -9
- inspect_ai/_view/www/src/plan/ScorerDetailView.tsx +2 -1
- inspect_ai/_view/www/src/plan/SolverDetailView.tsx +3 -3
- inspect_ai/_view/www/src/samples/InlineSampleDisplay.tsx +2 -2
- inspect_ai/_view/www/src/samples/SampleDialog.tsx +3 -3
- inspect_ai/_view/www/src/samples/SampleDisplay.tsx +2 -2
- inspect_ai/_view/www/src/samples/SampleSummaryView.tsx +2 -2
- inspect_ai/_view/www/src/samples/SamplesTools.tsx +2 -1
- inspect_ai/_view/www/src/samples/chat/ChatMessage.tsx +3 -19
- inspect_ai/_view/www/src/samples/chat/ChatMessageRenderer.tsx +2 -1
- inspect_ai/_view/www/src/samples/chat/ChatMessageRow.tsx +2 -1
- inspect_ai/_view/www/src/samples/chat/ChatView.tsx +2 -1
- inspect_ai/_view/www/src/samples/chat/ChatViewVirtualList.tsx +22 -7
- inspect_ai/_view/www/src/samples/chat/MessageContent.tsx +35 -6
- inspect_ai/_view/www/src/samples/chat/MessageContents.tsx +2 -2
- inspect_ai/_view/www/src/samples/chat/messages.ts +15 -2
- inspect_ai/_view/www/src/samples/chat/tools/ToolCallView.tsx +13 -4
- inspect_ai/_view/www/src/samples/chat/tools/ToolInput.module.css +2 -2
- inspect_ai/_view/www/src/samples/chat/tools/ToolInput.tsx +18 -19
- inspect_ai/_view/www/src/samples/chat/tools/ToolOutput.module.css +1 -1
- inspect_ai/_view/www/src/samples/chat/tools/ToolOutput.tsx +4 -3
- inspect_ai/_view/www/src/samples/chat/tools/ToolTitle.tsx +2 -2
- inspect_ai/_view/www/src/samples/error/FlatSampleErrorView.tsx +2 -3
- inspect_ai/_view/www/src/samples/error/SampleErrorView.tsx +3 -2
- inspect_ai/_view/www/src/samples/list/SampleFooter.tsx +2 -1
- inspect_ai/_view/www/src/samples/list/SampleHeader.tsx +2 -1
- inspect_ai/_view/www/src/samples/list/SampleList.tsx +57 -45
- inspect_ai/_view/www/src/samples/list/SampleRow.tsx +2 -1
- inspect_ai/_view/www/src/samples/list/SampleSeparator.tsx +2 -1
- inspect_ai/_view/www/src/samples/sample-tools/EpochFilter.tsx +2 -2
- inspect_ai/_view/www/src/samples/sample-tools/SelectScorer.tsx +4 -3
- inspect_ai/_view/www/src/samples/sample-tools/SortFilter.tsx +2 -5
- inspect_ai/_view/www/src/samples/sample-tools/sample-filter/SampleFilter.tsx +2 -2
- inspect_ai/_view/www/src/samples/scores/SampleScoreView.tsx +2 -1
- inspect_ai/_view/www/src/samples/scores/SampleScores.tsx +2 -2
- inspect_ai/_view/www/src/samples/transcript/ApprovalEventView.tsx +2 -1
- inspect_ai/_view/www/src/samples/transcript/ErrorEventView.tsx +2 -1
- inspect_ai/_view/www/src/samples/transcript/InfoEventView.tsx +2 -1
- inspect_ai/_view/www/src/samples/transcript/InputEventView.tsx +2 -1
- inspect_ai/_view/www/src/samples/transcript/LoggerEventView.module.css +4 -0
- inspect_ai/_view/www/src/samples/transcript/LoggerEventView.tsx +12 -2
- inspect_ai/_view/www/src/samples/transcript/ModelEventView.module.css +1 -1
- inspect_ai/_view/www/src/samples/transcript/ModelEventView.tsx +25 -28
- inspect_ai/_view/www/src/samples/transcript/SampleInitEventView.tsx +2 -1
- inspect_ai/_view/www/src/samples/transcript/SampleLimitEventView.tsx +5 -4
- inspect_ai/_view/www/src/samples/transcript/SampleTranscript.tsx +2 -2
- inspect_ai/_view/www/src/samples/transcript/SandboxEventView.tsx +8 -7
- inspect_ai/_view/www/src/samples/transcript/ScoreEventView.tsx +2 -2
- inspect_ai/_view/www/src/samples/transcript/StepEventView.tsx +3 -3
- inspect_ai/_view/www/src/samples/transcript/SubtaskEventView.tsx +18 -14
- inspect_ai/_view/www/src/samples/transcript/ToolEventView.tsx +5 -5
- inspect_ai/_view/www/src/samples/transcript/TranscriptView.tsx +34 -15
- inspect_ai/_view/www/src/samples/transcript/event/EventNav.tsx +2 -1
- inspect_ai/_view/www/src/samples/transcript/event/EventNavs.tsx +2 -1
- inspect_ai/_view/www/src/samples/transcript/event/EventRow.tsx +3 -2
- inspect_ai/_view/www/src/samples/transcript/event/EventSection.tsx +2 -2
- inspect_ai/_view/www/src/samples/transcript/event/EventTimingPanel.module.css +28 -0
- inspect_ai/_view/www/src/samples/transcript/event/EventTimingPanel.tsx +115 -0
- inspect_ai/_view/www/src/samples/transcript/event/utils.ts +29 -0
- inspect_ai/_view/www/src/samples/transcript/state/StateDiffView.tsx +2 -1
- inspect_ai/_view/www/src/samples/transcript/state/StateEventRenderers.tsx +3 -3
- inspect_ai/_view/www/src/samples/transcript/state/StateEventView.tsx +11 -8
- inspect_ai/_view/www/src/types/log.d.ts +129 -34
- inspect_ai/_view/www/src/usage/ModelTokenTable.tsx +6 -10
- inspect_ai/_view/www/src/usage/ModelUsagePanel.module.css +4 -0
- inspect_ai/_view/www/src/usage/ModelUsagePanel.tsx +32 -9
- inspect_ai/_view/www/src/usage/TokenTable.tsx +4 -6
- inspect_ai/_view/www/src/usage/UsageCard.tsx +2 -1
- inspect_ai/_view/www/src/utils/format.ts +1 -1
- inspect_ai/_view/www/src/utils/json.ts +24 -0
- inspect_ai/_view/www/src/workspace/WorkSpace.tsx +6 -5
- inspect_ai/_view/www/src/workspace/WorkSpaceView.tsx +9 -2
- inspect_ai/_view/www/src/workspace/error/TaskErrorPanel.tsx +2 -1
- inspect_ai/_view/www/src/workspace/navbar/Navbar.tsx +2 -1
- inspect_ai/_view/www/src/workspace/navbar/PrimaryBar.tsx +3 -3
- inspect_ai/_view/www/src/workspace/navbar/ResultsPanel.tsx +4 -3
- inspect_ai/_view/www/src/workspace/navbar/SecondaryBar.tsx +5 -4
- inspect_ai/_view/www/src/workspace/navbar/StatusPanel.tsx +5 -8
- inspect_ai/_view/www/src/workspace/sidebar/EvalStatus.tsx +5 -4
- inspect_ai/_view/www/src/workspace/sidebar/LogDirectoryTitleView.tsx +2 -1
- inspect_ai/_view/www/src/workspace/sidebar/Sidebar.tsx +2 -1
- inspect_ai/_view/www/src/workspace/sidebar/SidebarLogEntry.tsx +2 -2
- inspect_ai/_view/www/src/workspace/sidebar/SidebarScoreView.tsx +2 -1
- inspect_ai/_view/www/src/workspace/sidebar/SidebarScoresView.tsx +2 -2
- inspect_ai/_view/www/src/workspace/tabs/InfoTab.tsx +2 -2
- inspect_ai/_view/www/src/workspace/tabs/JsonTab.tsx +2 -5
- inspect_ai/_view/www/src/workspace/tabs/SamplesTab.tsx +12 -11
- inspect_ai/_view/www/yarn.lock +241 -5
- inspect_ai/log/_condense.py +3 -0
- inspect_ai/log/_recorders/eval.py +6 -1
- inspect_ai/log/_transcript.py +58 -1
- inspect_ai/model/__init__.py +2 -0
- inspect_ai/model/_call_tools.py +7 -0
- inspect_ai/model/_chat_message.py +22 -7
- inspect_ai/model/_conversation.py +10 -8
- inspect_ai/model/_generate_config.py +25 -4
- inspect_ai/model/_model.py +133 -57
- inspect_ai/model/_model_output.py +3 -0
- inspect_ai/model/_openai.py +106 -40
- inspect_ai/model/_providers/anthropic.py +281 -153
- inspect_ai/model/_providers/google.py +27 -8
- inspect_ai/model/_providers/groq.py +9 -4
- inspect_ai/model/_providers/openai.py +57 -4
- inspect_ai/model/_providers/openai_o1.py +10 -0
- inspect_ai/model/_providers/providers.py +1 -1
- inspect_ai/model/_reasoning.py +15 -2
- inspect_ai/scorer/_model.py +23 -19
- inspect_ai/solver/_human_agent/agent.py +14 -10
- inspect_ai/solver/_human_agent/commands/__init__.py +7 -3
- inspect_ai/solver/_human_agent/commands/submit.py +76 -30
- inspect_ai/tool/__init__.py +2 -0
- inspect_ai/tool/_tool.py +3 -1
- inspect_ai/tool/_tools/_computer/_common.py +117 -58
- inspect_ai/tool/_tools/_computer/_computer.py +80 -57
- inspect_ai/tool/_tools/_computer/_resources/image_home_dir/.config/Code/User/settings.json +7 -1
- inspect_ai/tool/_tools/_computer/_resources/image_home_dir/.config/xfce4/xfconf/xfce-perchannel-xml/xfwm4.xml +91 -0
- inspect_ai/tool/_tools/_computer/_resources/tool/.pylintrc +8 -0
- inspect_ai/tool/_tools/_computer/_resources/tool/.vscode/settings.json +12 -0
- inspect_ai/tool/_tools/_computer/_resources/tool/_args.py +78 -0
- inspect_ai/tool/_tools/_computer/_resources/tool/_constants.py +20 -0
- inspect_ai/tool/_tools/_computer/_resources/tool/_run.py +1 -1
- inspect_ai/tool/_tools/_computer/_resources/tool/_x11_client.py +175 -113
- inspect_ai/tool/_tools/_computer/_resources/tool/computer_tool.py +76 -20
- inspect_ai/tool/_tools/_computer/_resources/tool/pyproject.toml +65 -0
- inspect_ai/tool/_tools/_computer/test_args.py +151 -0
- inspect_ai/tool/_tools/_web_browser/_resources/.pylintrc +8 -0
- inspect_ai/tool/_tools/_web_browser/_resources/.vscode/launch.json +24 -0
- inspect_ai/tool/_tools/_web_browser/_resources/.vscode/settings.json +25 -0
- inspect_ai/tool/_tools/_web_browser/_resources/Dockerfile +5 -6
- inspect_ai/tool/_tools/_web_browser/_resources/README.md +10 -11
- inspect_ai/tool/_tools/_web_browser/_resources/accessibility_tree.py +71 -0
- inspect_ai/tool/_tools/_web_browser/_resources/accessibility_tree_node.py +323 -0
- inspect_ai/tool/_tools/_web_browser/_resources/cdp/__init__.py +5 -0
- inspect_ai/tool/_tools/_web_browser/_resources/cdp/a11y.py +279 -0
- inspect_ai/tool/_tools/_web_browser/_resources/cdp/dom.py +9 -0
- inspect_ai/tool/_tools/_web_browser/_resources/cdp/dom_snapshot.py +293 -0
- inspect_ai/tool/_tools/_web_browser/_resources/cdp/page.py +94 -0
- inspect_ai/tool/_tools/_web_browser/_resources/constants.py +2 -0
- inspect_ai/tool/_tools/_web_browser/_resources/images/usage_diagram.svg +2 -0
- inspect_ai/tool/_tools/_web_browser/_resources/playwright_browser.py +50 -0
- inspect_ai/tool/_tools/_web_browser/_resources/playwright_crawler.py +31 -359
- inspect_ai/tool/_tools/_web_browser/_resources/playwright_page_crawler.py +280 -0
- inspect_ai/tool/_tools/_web_browser/_resources/pyproject.toml +65 -0
- inspect_ai/tool/_tools/_web_browser/_resources/rectangle.py +64 -0
- inspect_ai/tool/_tools/_web_browser/_resources/rpc_client_helpers.py +146 -0
- inspect_ai/tool/_tools/_web_browser/_resources/scale_factor.py +64 -0
- inspect_ai/tool/_tools/_web_browser/_resources/test_accessibility_tree_node.py +180 -0
- inspect_ai/tool/_tools/_web_browser/_resources/test_playwright_crawler.py +15 -9
- inspect_ai/tool/_tools/_web_browser/_resources/test_rectangle.py +15 -0
- inspect_ai/tool/_tools/_web_browser/_resources/test_web_client.py +44 -0
- inspect_ai/tool/_tools/_web_browser/_resources/web_browser_rpc_types.py +39 -0
- inspect_ai/tool/_tools/_web_browser/_resources/web_client.py +198 -48
- inspect_ai/tool/_tools/_web_browser/_resources/web_client_new_session.py +26 -25
- inspect_ai/tool/_tools/_web_browser/_resources/web_server.py +178 -39
- inspect_ai/tool/_tools/_web_browser/_web_browser.py +38 -19
- inspect_ai/util/__init__.py +2 -1
- inspect_ai/util/_display.py +12 -0
- inspect_ai/util/_sandbox/events.py +55 -21
- inspect_ai/util/_sandbox/self_check.py +131 -43
- inspect_ai/util/_subtask.py +11 -0
- {inspect_ai-0.3.70.dist-info → inspect_ai-0.3.72.dist-info}/METADATA +1 -1
- {inspect_ai-0.3.70.dist-info → inspect_ai-0.3.72.dist-info}/RECORD +209 -186
- {inspect_ai-0.3.70.dist-info → inspect_ai-0.3.72.dist-info}/WHEEL +1 -1
- inspect_ai/_view/www/src/components/VirtualList.module.css +0 -19
- inspect_ai/_view/www/src/components/VirtualList.tsx +0 -292
- inspect_ai/tool/_tools/_computer/_computer_split.py +0 -198
- inspect_ai/tool/_tools/_web_browser/_resources/accessibility_node.py +0 -312
- inspect_ai/tool/_tools/_web_browser/_resources/dm_env_servicer.py +0 -275
- inspect_ai/tool/_tools/_web_browser/_resources/images/usage_diagram.png +0 -0
- inspect_ai/tool/_tools/_web_browser/_resources/test_accessibility_node.py +0 -176
- inspect_ai/tool/_tools/_web_browser/_resources/test_dm_env_servicer.py +0 -135
- inspect_ai/tool/_tools/_web_browser/_resources/test_web_environment.py +0 -71
- inspect_ai/tool/_tools/_web_browser/_resources/web_environment.py +0 -184
- {inspect_ai-0.3.70.dist-info → inspect_ai-0.3.72.dist-info}/LICENSE +0 -0
- {inspect_ai-0.3.70.dist-info → inspect_ai-0.3.72.dist-info}/entry_points.txt +0 -0
- {inspect_ai-0.3.70.dist-info → inspect_ai-0.3.72.dist-info}/top_level.txt +0 -0
@@ -12,7 +12,9 @@
|
|
12
12
|
"dev": "vite",
|
13
13
|
"prettier:check": "prettier --check src",
|
14
14
|
"prettier:write": "prettier --write src",
|
15
|
-
"test": "echo \"Error: no test specified\" && exit 1"
|
15
|
+
"test": "echo \"Error: no test specified\" && exit 1",
|
16
|
+
"lint": "eslint 'src/**/*.{js,jsx,mjs,ts,tsx}'",
|
17
|
+
"lint:fix": "eslint 'src/**/*.{js,jsx,mjs,ts,tsx}' --fix"
|
16
18
|
},
|
17
19
|
"exports": {
|
18
20
|
".": "./src/App.mjs"
|
@@ -29,9 +31,11 @@
|
|
29
31
|
"@types/react-dom": "^19.0.3",
|
30
32
|
"@vitejs/plugin-react": "^4.3.4",
|
31
33
|
"eslint": "9.x",
|
34
|
+
"eslint-plugin-react-hooks": "^5.1.0",
|
32
35
|
"globals": "^15.6.0",
|
33
36
|
"prettier": "^3.3.3",
|
34
37
|
"typescript": "^5.7.3",
|
38
|
+
"typescript-eslint": "^8.25.0",
|
35
39
|
"vite": "^5.3.2"
|
36
40
|
},
|
37
41
|
"dependencies": {
|
@@ -41,8 +45,8 @@
|
|
41
45
|
"@codemirror/state": "^6.5.1",
|
42
46
|
"@lezer/highlight": "^1.2.1",
|
43
47
|
"@popperjs/core": "^2.11.8",
|
44
|
-
"asciinema-player": "^3.8.2",
|
45
48
|
"ansi-output": "^0.0.9",
|
49
|
+
"asciinema-player": "^3.8.2",
|
46
50
|
"bootstrap": "^5.3.3",
|
47
51
|
"bootstrap-icons": "^1.11.3",
|
48
52
|
"clipboard": "^2.0.11",
|
@@ -60,6 +64,7 @@
|
|
60
64
|
"postcss-url": "^10.1.3",
|
61
65
|
"prismjs": "^1.29.0",
|
62
66
|
"react": "^19.0.0",
|
63
|
-
"react-dom": "^19.0.0"
|
67
|
+
"react-dom": "^19.0.0",
|
68
|
+
"react-virtuoso": "^4.12.5"
|
64
69
|
}
|
65
70
|
}
|
inspect_ai/_view/www/src/App.tsx
CHANGED
@@ -36,7 +36,7 @@ import { WorkSpace } from "./workspace/WorkSpace";
|
|
36
36
|
|
37
37
|
import ClipboardJS from "clipboard";
|
38
38
|
import clsx from "clsx";
|
39
|
-
import { useCallback, useEffect, useMemo, useRef, useState } from "react";
|
39
|
+
import { FC, useCallback, useEffect, useMemo, useRef, useState } from "react";
|
40
40
|
import {
|
41
41
|
ClientAPI,
|
42
42
|
EvalLogHeader,
|
@@ -72,7 +72,7 @@ interface AppProps {
|
|
72
72
|
/**
|
73
73
|
* Renders the Main Application
|
74
74
|
*/
|
75
|
-
export const App:
|
75
|
+
export const App: FC<AppProps> = ({
|
76
76
|
api,
|
77
77
|
applicationState,
|
78
78
|
saveApplicationState,
|
@@ -1,14 +1,15 @@
|
|
1
1
|
import { ANSIColor, ANSIOutput, ANSIOutputRun, ANSIStyle } from "ansi-output";
|
2
2
|
import clsx from "clsx";
|
3
|
+
import { CSSProperties, FC } from "react";
|
3
4
|
import "./AnsiDisplay.css";
|
4
5
|
|
5
6
|
interface ANSIDisplayProps {
|
6
7
|
output: string;
|
7
|
-
style?:
|
8
|
+
style?: CSSProperties;
|
8
9
|
className?: string[] | string;
|
9
10
|
}
|
10
11
|
|
11
|
-
export const ANSIDisplay:
|
12
|
+
export const ANSIDisplay: FC<ANSIDisplayProps> = ({
|
12
13
|
output,
|
13
14
|
style,
|
14
15
|
className,
|
@@ -46,7 +47,7 @@ interface OutputRunProps {
|
|
46
47
|
run: ANSIOutputRun;
|
47
48
|
}
|
48
49
|
|
49
|
-
const OutputRun:
|
50
|
+
const OutputRun: FC<OutputRunProps> = ({ run }) => {
|
50
51
|
// Render.
|
51
52
|
return <span style={computeCSSProperties(run)}>{run.text}</span>;
|
52
53
|
};
|
@@ -1,4 +1,5 @@
|
|
1
1
|
import clsx from "clsx";
|
2
|
+
import { FC, ReactNode } from "react";
|
2
3
|
import { ApplicationIcons } from "../appearance/icons";
|
3
4
|
import "./Card.css";
|
4
5
|
|
@@ -7,17 +8,17 @@ interface CardHeaderProps {
|
|
7
8
|
icon?: string;
|
8
9
|
label?: string;
|
9
10
|
className?: string;
|
10
|
-
children?:
|
11
|
+
children?: ReactNode;
|
11
12
|
}
|
12
13
|
|
13
14
|
interface CardBodyProps {
|
14
15
|
id?: string;
|
15
|
-
children?:
|
16
|
+
children?: ReactNode;
|
16
17
|
}
|
17
18
|
|
18
19
|
interface CardProps {
|
19
20
|
id?: string;
|
20
|
-
children?:
|
21
|
+
children?: ReactNode;
|
21
22
|
}
|
22
23
|
|
23
24
|
interface CardCollapsingHeaderProps {
|
@@ -25,10 +26,10 @@ interface CardCollapsingHeaderProps {
|
|
25
26
|
icon: string;
|
26
27
|
label: string;
|
27
28
|
cardBodyId: string;
|
28
|
-
children?:
|
29
|
+
children?: ReactNode;
|
29
30
|
}
|
30
31
|
|
31
|
-
export const CardHeader:
|
32
|
+
export const CardHeader: FC<CardHeaderProps> = ({
|
32
33
|
id,
|
33
34
|
icon,
|
34
35
|
label,
|
@@ -50,7 +51,7 @@ export const CardHeader: React.FC<CardHeaderProps> = ({
|
|
50
51
|
);
|
51
52
|
};
|
52
53
|
|
53
|
-
export const CardBody:
|
54
|
+
export const CardBody: FC<CardBodyProps> = ({ id, children }) => {
|
54
55
|
return (
|
55
56
|
<div className={"card-body"} id={id || ""}>
|
56
57
|
{children}
|
@@ -58,7 +59,7 @@ export const CardBody: React.FC<CardBodyProps> = ({ id, children }) => {
|
|
58
59
|
);
|
59
60
|
};
|
60
61
|
|
61
|
-
export const Card:
|
62
|
+
export const Card: FC<CardProps> = ({ id, children }) => {
|
62
63
|
return (
|
63
64
|
<div className={"card"} id={id}>
|
64
65
|
{children}
|
@@ -66,7 +67,7 @@ export const Card: React.FC<CardProps> = ({ id, children }) => {
|
|
66
67
|
);
|
67
68
|
};
|
68
69
|
|
69
|
-
export const CardCollapsingHeader:
|
70
|
+
export const CardCollapsingHeader: FC<CardCollapsingHeaderProps> = ({
|
70
71
|
id,
|
71
72
|
icon,
|
72
73
|
label,
|
@@ -1,3 +1,4 @@
|
|
1
|
+
import { FC } from "react";
|
1
2
|
import api from "../api/index";
|
2
3
|
import "./DownloadButton.css";
|
3
4
|
|
@@ -7,7 +8,7 @@ interface DownloadButtonProps {
|
|
7
8
|
fileContents: string | Blob | ArrayBuffer | ArrayBufferView;
|
8
9
|
}
|
9
10
|
|
10
|
-
export const DownloadButton:
|
11
|
+
export const DownloadButton: FC<DownloadButtonProps> = ({
|
11
12
|
label,
|
12
13
|
fileName,
|
13
14
|
fileContents,
|
@@ -1,10 +1,10 @@
|
|
1
|
-
import { ReactNode } from "react";
|
1
|
+
import { FC, ReactNode } from "react";
|
2
2
|
|
3
3
|
interface EmptyPanelProps {
|
4
4
|
children?: ReactNode;
|
5
5
|
}
|
6
6
|
|
7
|
-
export const EmptyPanel:
|
7
|
+
export const EmptyPanel: FC<EmptyPanelProps> = ({ children }) => {
|
8
8
|
return (
|
9
9
|
<div className={"empty-panel"}>
|
10
10
|
<div className={"container"}>
|
@@ -1,3 +1,4 @@
|
|
1
|
+
import { FC } from "react";
|
1
2
|
import { ApplicationIcons } from "../appearance/icons";
|
2
3
|
import "./ErrorPanel.css";
|
3
4
|
|
@@ -12,7 +13,7 @@ interface ErrorPanelProps {
|
|
12
13
|
error: DisplayError;
|
13
14
|
}
|
14
15
|
|
15
|
-
export const ErrorPanel:
|
16
|
+
export const ErrorPanel: FC<ErrorPanelProps> = ({ title, error }) => {
|
16
17
|
const message = error.message;
|
17
18
|
const stack = error.stack;
|
18
19
|
|
@@ -26,10 +27,10 @@ export const ErrorPanel: React.FC<ErrorPanelProps> = ({ title, error }) => {
|
|
26
27
|
</div>
|
27
28
|
<div className={"error-panel-body"}>
|
28
29
|
<div>
|
29
|
-
Error: {message || ""}
|
30
|
+
Error: {message || ""}
|
30
31
|
{stack && error.displayStack !== false && (
|
31
32
|
<pre className={"error-panel-stack"}>
|
32
|
-
<code>at
|
33
|
+
<code>at {stack}</code>
|
33
34
|
</pre>
|
34
35
|
)}
|
35
36
|
</div>
|
@@ -1,5 +1,13 @@
|
|
1
1
|
import clsx from "clsx";
|
2
|
-
import {
|
2
|
+
import {
|
3
|
+
CSSProperties,
|
4
|
+
FC,
|
5
|
+
ReactNode,
|
6
|
+
useCallback,
|
7
|
+
useEffect,
|
8
|
+
useRef,
|
9
|
+
useState,
|
10
|
+
} from "react";
|
3
11
|
import { ApplicationIcons } from "../appearance/icons";
|
4
12
|
import { useResizeObserver } from "../utils/dom";
|
5
13
|
import "./ExpandablePanel.css";
|
@@ -8,11 +16,11 @@ interface ExpandablePanelProps {
|
|
8
16
|
collapse: boolean;
|
9
17
|
border?: boolean;
|
10
18
|
lines?: number;
|
11
|
-
children?:
|
19
|
+
children?: ReactNode;
|
12
20
|
className?: string | string[];
|
13
21
|
}
|
14
22
|
|
15
|
-
export const ExpandablePanel:
|
23
|
+
export const ExpandablePanel: FC<ExpandablePanelProps> = ({
|
16
24
|
collapse,
|
17
25
|
border,
|
18
26
|
lines = 15,
|
@@ -83,10 +91,10 @@ interface MoreToggleProps {
|
|
83
91
|
collapsed: boolean;
|
84
92
|
border: boolean;
|
85
93
|
setCollapsed: (collapsed: boolean) => void;
|
86
|
-
style?:
|
94
|
+
style?: CSSProperties;
|
87
95
|
}
|
88
96
|
|
89
|
-
const MoreToggle:
|
97
|
+
const MoreToggle: FC<MoreToggleProps> = ({
|
90
98
|
collapsed,
|
91
99
|
border,
|
92
100
|
setCollapsed,
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import { useCallback, useEffect, useRef } from "react";
|
1
|
+
import { FC, KeyboardEvent, useCallback, useEffect, useRef } from "react";
|
2
2
|
import { ApplicationIcons } from "../appearance/icons";
|
3
3
|
import "./FindBand.css";
|
4
4
|
|
@@ -6,7 +6,7 @@ interface FindBandProps {
|
|
6
6
|
hideBand: () => void;
|
7
7
|
}
|
8
8
|
|
9
|
-
export const FindBand:
|
9
|
+
export const FindBand: FC<FindBandProps> = ({ hideBand }) => {
|
10
10
|
const searchBoxRef = useRef<HTMLInputElement>(null);
|
11
11
|
|
12
12
|
useEffect(() => {
|
@@ -82,7 +82,7 @@ export const FindBand: React.FC<FindBandProps> = ({ hideBand }) => {
|
|
82
82
|
);
|
83
83
|
|
84
84
|
const handleKeyDown = useCallback(
|
85
|
-
(e:
|
85
|
+
(e: KeyboardEvent<HTMLInputElement>) => {
|
86
86
|
if (e.key === "Escape") {
|
87
87
|
hideBand();
|
88
88
|
} else if (e.key === "Enter") {
|
@@ -1,4 +1,4 @@
|
|
1
|
-
import { useEffect } from "react";
|
1
|
+
import { FC, useEffect } from "react";
|
2
2
|
import { formatDateTime, formatTime } from "../utils/format";
|
3
3
|
import { AsciinemaPlayer } from "./AsciinemaPlayer";
|
4
4
|
import "./HumanBaselineView.css";
|
@@ -24,7 +24,7 @@ interface HumanBaselineViewProps {
|
|
24
24
|
/**
|
25
25
|
* Renders the HumanBaselineView component.
|
26
26
|
*/
|
27
|
-
export const HumanBaselineView:
|
27
|
+
export const HumanBaselineView: FC<HumanBaselineViewProps> = ({
|
28
28
|
started,
|
29
29
|
runtime,
|
30
30
|
answer,
|
@@ -92,7 +92,7 @@ export const HumanBaselineView: React.FC<HumanBaselineViewProps> = ({
|
|
92
92
|
answer?: string;
|
93
93
|
}
|
94
94
|
|
95
|
-
const StatusMessage:
|
95
|
+
const StatusMessage: FC<StatusMessageProps> = ({
|
96
96
|
completed,
|
97
97
|
running,
|
98
98
|
answer,
|
@@ -1,15 +1,16 @@
|
|
1
1
|
import clsx from "clsx";
|
2
|
+
import { CSSProperties, FC, ReactNode } from "react";
|
2
3
|
|
3
4
|
interface LabeledValueProps {
|
4
5
|
label: string;
|
5
|
-
style?:
|
6
|
-
valueStyle?:
|
6
|
+
style?: CSSProperties;
|
7
|
+
valueStyle?: CSSProperties;
|
7
8
|
layout?: "column" | "row";
|
8
|
-
children:
|
9
|
+
children: ReactNode;
|
9
10
|
className?: string | string[];
|
10
11
|
}
|
11
12
|
|
12
|
-
export const LabeledValue:
|
13
|
+
export const LabeledValue: FC<LabeledValueProps> = ({
|
13
14
|
layout = "column",
|
14
15
|
style,
|
15
16
|
label,
|
@@ -1,7 +1,15 @@
|
|
1
1
|
import clsx from "clsx";
|
2
2
|
import { ProgressBar } from "./ProgressBar";
|
3
3
|
|
4
|
-
import {
|
4
|
+
import {
|
5
|
+
FC,
|
6
|
+
ReactNode,
|
7
|
+
RefObject,
|
8
|
+
UIEvent,
|
9
|
+
useCallback,
|
10
|
+
useEffect,
|
11
|
+
useRef,
|
12
|
+
} from "react";
|
5
13
|
import styles from "./LargeModal.module.css";
|
6
14
|
|
7
15
|
export interface ModalTool {
|
@@ -22,17 +30,17 @@ interface LargeModalProps {
|
|
22
30
|
detail: string;
|
23
31
|
detailTools?: ModalTools;
|
24
32
|
showProgress: boolean;
|
25
|
-
footer?:
|
33
|
+
footer?: ReactNode;
|
26
34
|
visible: boolean;
|
27
35
|
onkeyup: (e: any) => void;
|
28
36
|
onHide: () => void;
|
29
|
-
scrollRef:
|
30
|
-
initialScrollPositionRef:
|
37
|
+
scrollRef: RefObject<HTMLDivElement | null>;
|
38
|
+
initialScrollPositionRef: RefObject<number>;
|
31
39
|
setInitialScrollPosition: (position: number) => void;
|
32
40
|
children: ReactNode;
|
33
41
|
}
|
34
42
|
|
35
|
-
export const LargeModal:
|
43
|
+
export const LargeModal: FC<LargeModalProps> = ({
|
36
44
|
id,
|
37
45
|
title,
|
38
46
|
detail,
|
@@ -56,7 +64,9 @@ export const LargeModal: React.FC<LargeModalProps> = ({
|
|
56
64
|
|
57
65
|
// Support restoring the scroll position
|
58
66
|
// but only do this for the first time that the children are set
|
59
|
-
|
67
|
+
const modalRef = useRef(null);
|
68
|
+
scrollRef = scrollRef || modalRef;
|
69
|
+
|
60
70
|
useEffect(() => {
|
61
71
|
if (scrollRef.current) {
|
62
72
|
setTimeout(() => {
|
@@ -153,7 +163,7 @@ interface HtmlEntityProps {
|
|
153
163
|
html: string;
|
154
164
|
}
|
155
165
|
|
156
|
-
const HtmlEntity:
|
166
|
+
const HtmlEntity: FC<HtmlEntityProps> = ({ html }) => (
|
157
167
|
<span dangerouslySetInnerHTML={{ __html: html }} />
|
158
168
|
);
|
159
169
|
|
@@ -164,12 +174,7 @@ interface TitleToolProps {
|
|
164
174
|
onClick: () => void;
|
165
175
|
}
|
166
176
|
|
167
|
-
const TitleTool:
|
168
|
-
label,
|
169
|
-
icon,
|
170
|
-
enabled,
|
171
|
-
onClick,
|
172
|
-
}) => {
|
177
|
+
const TitleTool: FC<TitleToolProps> = ({ label, icon, enabled, onClick }) => {
|
173
178
|
return (
|
174
179
|
<button
|
175
180
|
type="button"
|
@@ -1,9 +1,9 @@
|
|
1
|
-
.
|
1
|
+
.carouselThumbs {
|
2
2
|
display: grid;
|
3
3
|
grid-template-columns: auto auto auto auto;
|
4
4
|
}
|
5
5
|
|
6
|
-
.
|
6
|
+
.carouselThumb {
|
7
7
|
background: black;
|
8
8
|
color: white;
|
9
9
|
padding: 4em 0;
|
@@ -13,11 +13,11 @@
|
|
13
13
|
text-align: center;
|
14
14
|
}
|
15
15
|
|
16
|
-
.
|
16
|
+
.carouselPlayIcon {
|
17
17
|
font-size: 4em;
|
18
18
|
}
|
19
19
|
|
20
|
-
.
|
20
|
+
.lightboxOverlay {
|
21
21
|
position: fixed;
|
22
22
|
top: 0;
|
23
23
|
left: 0;
|
@@ -30,25 +30,25 @@
|
|
30
30
|
z-index: 9998;
|
31
31
|
}
|
32
32
|
|
33
|
-
.
|
34
|
-
.
|
33
|
+
.lightboxContent.open,
|
34
|
+
.lightboxOverlay.open {
|
35
35
|
opacity: 1;
|
36
36
|
visibility: visible;
|
37
37
|
}
|
38
38
|
|
39
|
-
.
|
40
|
-
.
|
39
|
+
.lightboxContent.closed,
|
40
|
+
.lightboxOverlay.closed {
|
41
41
|
opacity: 0;
|
42
42
|
visibility: hidden;
|
43
43
|
}
|
44
44
|
|
45
|
-
.
|
45
|
+
.lightboxButtonCloseWrapper {
|
46
46
|
position: absolute;
|
47
47
|
top: 10px;
|
48
48
|
right: 10px;
|
49
49
|
}
|
50
50
|
|
51
|
-
.
|
51
|
+
.lightboxButtonClose {
|
52
52
|
border: none;
|
53
53
|
background: none;
|
54
54
|
color: #fff;
|
@@ -60,7 +60,7 @@
|
|
60
60
|
z-index: 10000;
|
61
61
|
}
|
62
62
|
|
63
|
-
.
|
63
|
+
.lightboxPreviewButton {
|
64
64
|
position: absolute;
|
65
65
|
top: 50%;
|
66
66
|
transform: translateY(-50%);
|
@@ -73,23 +73,27 @@
|
|
73
73
|
z-index: 9999;
|
74
74
|
}
|
75
75
|
|
76
|
-
.
|
76
|
+
.lightboxPreviewButton.next {
|
77
77
|
left: 10px;
|
78
78
|
}
|
79
79
|
|
80
|
-
.
|
80
|
+
.lightboxPreviewButton.prev {
|
81
81
|
right: 10px;
|
82
82
|
}
|
83
83
|
|
84
|
-
.
|
85
|
-
max-width:
|
86
|
-
max-height:
|
84
|
+
.lightboxContent {
|
85
|
+
max-width: 90vw !important;
|
86
|
+
max-height: 90vh !important;
|
87
87
|
display: flex;
|
88
|
-
align-items: center;
|
89
|
-
justify-content: center;
|
90
88
|
position: relative;
|
91
89
|
transition:
|
92
90
|
opacity 0.3s ease,
|
93
91
|
visibility 0.3s ease;
|
94
92
|
z-index: 9999;
|
93
|
+
overflow: hidden;
|
94
|
+
}
|
95
|
+
|
96
|
+
.lightboxContent > * {
|
97
|
+
max-height: 90vh !important;
|
98
|
+
max-width: 90vw !important;
|
95
99
|
}
|
@@ -1,11 +1,11 @@
|
|
1
1
|
import clsx from "clsx";
|
2
|
-
import { useCallback, useEffect, useState } from "react";
|
2
|
+
import { FC, ReactNode, useCallback, useEffect, useState } from "react";
|
3
3
|
import { ApplicationIcons } from "../appearance/icons";
|
4
|
-
import "./LightboxCarousel.css";
|
4
|
+
import styles from "./LightboxCarousel.module.css";
|
5
5
|
|
6
6
|
interface Slide {
|
7
7
|
label: string;
|
8
|
-
render: () =>
|
8
|
+
render: () => ReactNode;
|
9
9
|
}
|
10
10
|
|
11
11
|
interface LightboxCarouselProps {
|
@@ -15,24 +15,25 @@ interface LightboxCarouselProps {
|
|
15
15
|
/**
|
16
16
|
* LightboxCarousel component provides a carousel with lightbox functionality.
|
17
17
|
*/
|
18
|
-
export const LightboxCarousel:
|
19
|
-
slides,
|
20
|
-
}) => {
|
18
|
+
export const LightboxCarousel: FC<LightboxCarouselProps> = ({ slides }) => {
|
21
19
|
const [isOpen, setIsOpen] = useState(false);
|
22
20
|
const [showOverlay, setShowOverlay] = useState(false);
|
23
21
|
const [currentIndex, setCurrentIndex] = useState(0);
|
24
22
|
|
25
|
-
const openLightbox = (
|
26
|
-
|
27
|
-
|
23
|
+
const openLightbox = useCallback(
|
24
|
+
(index: number) => {
|
25
|
+
setCurrentIndex(index);
|
26
|
+
setShowOverlay(true);
|
28
27
|
|
29
|
-
|
30
|
-
|
31
|
-
|
28
|
+
// Slight delay before setting isOpen so the fade-in starts from opacity: 0
|
29
|
+
setTimeout(() => setIsOpen(true), 10);
|
30
|
+
},
|
31
|
+
[setCurrentIndex, setShowOverlay],
|
32
|
+
);
|
32
33
|
|
33
|
-
const closeLightbox = () => {
|
34
|
+
const closeLightbox = useCallback(() => {
|
34
35
|
setIsOpen(false);
|
35
|
-
};
|
36
|
+
}, [setIsOpen]);
|
36
37
|
|
37
38
|
// Remove the overlay from the DOM after fade-out completes
|
38
39
|
useEffect(() => {
|
@@ -42,17 +43,17 @@ export const LightboxCarousel: React.FC<LightboxCarouselProps> = ({
|
|
42
43
|
}, 300); // match your transition duration
|
43
44
|
return () => clearTimeout(timer);
|
44
45
|
}
|
45
|
-
}, [isOpen, showOverlay]);
|
46
|
+
}, [isOpen, showOverlay, setShowOverlay]);
|
46
47
|
|
47
48
|
const showNext = useCallback(() => {
|
48
49
|
setCurrentIndex((prev) => {
|
49
50
|
return (prev + 1) % slides.length;
|
50
51
|
});
|
51
|
-
}, [slides]);
|
52
|
+
}, [slides, setCurrentIndex]);
|
52
53
|
|
53
54
|
const showPrev = useCallback(() => {
|
54
55
|
setCurrentIndex((prev) => (prev - 1 + slides.length) % slides.length);
|
55
|
-
}, [slides]);
|
56
|
+
}, [slides, setCurrentIndex]);
|
56
57
|
|
57
58
|
// Keyboard Navigation
|
58
59
|
useEffect(() => {
|
@@ -73,19 +74,22 @@ export const LightboxCarousel: React.FC<LightboxCarouselProps> = ({
|
|
73
74
|
}, [isOpen, showNext, showPrev]);
|
74
75
|
|
75
76
|
return (
|
76
|
-
<div className="lightbox-carousel-container">
|
77
|
-
<div className=
|
77
|
+
<div className={clsx("lightbox-carousel-container")}>
|
78
|
+
<div className={clsx(styles.carouselThumbs)}>
|
78
79
|
{slides.map((slide, index) => {
|
79
80
|
return (
|
80
81
|
<div
|
81
82
|
key={index}
|
82
|
-
className=
|
83
|
+
className={clsx(styles.carouselThumb)}
|
83
84
|
onClick={() => openLightbox(index)}
|
84
85
|
>
|
85
86
|
<div>{slide.label}</div>
|
86
87
|
<div>
|
87
88
|
<i
|
88
|
-
className={clsx(
|
89
|
+
className={clsx(
|
90
|
+
ApplicationIcons.play,
|
91
|
+
styles.carouselPlayIcon,
|
92
|
+
)}
|
89
93
|
/>
|
90
94
|
</div>
|
91
95
|
</div>
|
@@ -93,15 +97,20 @@ export const LightboxCarousel: React.FC<LightboxCarouselProps> = ({
|
|
93
97
|
})}
|
94
98
|
</div>
|
95
99
|
{showOverlay && (
|
96
|
-
<div
|
97
|
-
|
98
|
-
|
100
|
+
<div
|
101
|
+
className={clsx(styles.lightboxOverlay, isOpen ? "open" : "closed")}
|
102
|
+
>
|
103
|
+
<div className={clsx(styles.lightboxButtonCloseWrapper)}>
|
104
|
+
<button
|
105
|
+
className={styles.lightboxButtonClose}
|
106
|
+
onClick={closeLightbox}
|
107
|
+
>
|
99
108
|
<i className={ApplicationIcons.close}></i>
|
100
109
|
</button>
|
101
110
|
</div>
|
102
111
|
{slides.length > 1 ? (
|
103
112
|
<button
|
104
|
-
className={"
|
113
|
+
className={clsx(styles.lightboxPreviewButton, "prev")}
|
105
114
|
onClick={showPrev}
|
106
115
|
>
|
107
116
|
<i className={ApplicationIcons.previous}></i>
|
@@ -111,7 +120,7 @@ export const LightboxCarousel: React.FC<LightboxCarouselProps> = ({
|
|
111
120
|
)}
|
112
121
|
{slides.length > 1 ? (
|
113
122
|
<button
|
114
|
-
className={"
|
123
|
+
className={clsx(styles.lightboxPreviewButton, "next")}
|
115
124
|
onClick={showNext}
|
116
125
|
>
|
117
126
|
<i className={ApplicationIcons.next} />
|
@@ -121,7 +130,7 @@ export const LightboxCarousel: React.FC<LightboxCarouselProps> = ({
|
|
121
130
|
)}
|
122
131
|
<div
|
123
132
|
key={`carousel-slide-${currentIndex}`}
|
124
|
-
className={clsx(
|
133
|
+
className={clsx(styles.lightboxContent, isOpen ? "open" : "closed")}
|
125
134
|
>
|
126
135
|
{slides[currentIndex].render()}
|
127
136
|
</div>
|
@@ -1,5 +1,6 @@
|
|
1
1
|
import { clsx } from "clsx";
|
2
2
|
|
3
|
+
import { FC } from "react";
|
3
4
|
import { ApplicationIcons } from "../appearance/icons";
|
4
5
|
import "./MessageBand.css";
|
5
6
|
|
@@ -10,7 +11,7 @@ interface MessageBandProps {
|
|
10
11
|
type: "info" | "warning" | "error";
|
11
12
|
}
|
12
13
|
|
13
|
-
export const MessageBand:
|
14
|
+
export const MessageBand: FC<MessageBandProps> = ({
|
14
15
|
message,
|
15
16
|
hidden,
|
16
17
|
setHidden,
|