Add high-contrast Shiki themes, disable Help Me panel

cognitive-engineering-lab · Sep 13, 2024 · 247d460 · 247d460
1 parent 109cbfd
commit 247d460
Show file tree

Hide file tree

Showing 8 changed files with 53 additions and 22 deletions.
diff --git a/crates/argus-cli/Cargo.toml b/crates/argus-cli/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "argus-cli"
-version = "0.1.12"
+version = "0.1.13"
 edition = "2021"
 authors = ["Gavin Gray <[email protected]>"]
 repository = "https://github.com/cognitive-engineering-lab/argus"
@@ -10,8 +10,8 @@ license = "MIT"
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
 
 [dependencies]
-argus-lib = { version = "0.1.12", path = "../argus" }
-argus-ext = { version = "0.1.12", path = "../argus-ext" }
+argus-lib = { version = "0.1.13", path = "../argus" }
+argus-ext = { version = "0.1.13", path = "../argus-ext" }
 rustc_plugin = "=0.10.0-nightly-2024-05-20"
 
 rustc_utils.workspace = true

diff --git a/crates/argus-ext/Cargo.toml b/crates/argus-ext/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "argus-ext"
-version = "0.1.12"
+version = "0.1.13"
 edition = "2021"
 authors = ["Gavin Gray <[email protected]>"]
 repository = "https://github.com/cognitive-engineering-lab/argus"

diff --git a/crates/argus-ser/Cargo.toml b/crates/argus-ser/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "argus-ser"
-version = "0.1.12"
+version = "0.1.13"
 edition = "2021"
 authors = ["Gavin Gray <[email protected]>"]
 repository = "https://github.com/cognitive-engineering-lab/argus"
@@ -28,7 +28,7 @@ smallvec = "1.11.2"
 itertools = "0.12.0"
 ts-rs = { version = "7.1.1", features = ["indexmap-impl"], optional = true }
 index_vec = { version = "0.1.3", features = ["serde"] }
-argus-ext = { version = "0.1.12", path = "../argus-ext" }
+argus-ext = { version = "0.1.13", path = "../argus-ext" }
 
 [dev-dependencies]
 argus-ser = { path = ".", features = ["testing"] }

diff --git a/crates/argus/Cargo.toml b/crates/argus/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "argus-lib"
-version = "0.1.12"
+version = "0.1.13"
 edition = "2021"
 authors = ["Gavin Gray <[email protected]>"]
 repository = "https://github.com/cognitive-engineering-lab/argus"
@@ -21,8 +21,8 @@ fluid-let.workspace = true
 serde.workspace = true
 serde_json.workspace = true
 
-argus-ext = { version = "0.1.12", path = "../argus-ext" }
-argus-ser = { version = "0.1.12", path = "../argus-ser" }
+argus-ext = { version = "0.1.13", path = "../argus-ext" }
+argus-ser = { version = "0.1.13", path = "../argus-ser" }
 index_vec = { version = "0.1.3", features = ["serde"] }
 smallvec = "1.11.2"
 itertools = "0.12.0"
@@ -35,7 +35,7 @@ ts-rs = { version = "7.1.1", features = ["indexmap-impl"], optional = true }
 
 [dev-dependencies]
 argus-lib = { path = ".", features = ["testing"] }
-argus-ser = { version = "0.1.12", path = "../argus-ser", features = ["testing"] }
+argus-ser = { version = "0.1.13", path = "../argus-ser", features = ["testing"] }
 rustc_utils = { version = "=0.10.0-nightly-2024-05-20", features = ["serde", "ts-rs"] }
 test-log = "0.2.11"
 env_logger = "0.9.3"

diff --git a/ide/packages/extension/package.json b/ide/packages/extension/package.json
@@ -5,7 +5,7 @@
   "description": "A trait debugger for Rust",
   "license": "MIT",
   "icon": "argus-logo-128.png",
-  "version": "0.1.12",
+  "version": "0.1.13",
   "engines": {
     "vscode": "^1.79.0"
   },

diff --git a/ide/packages/panoptes/src/Code.css b/ide/packages/panoptes/src/Code.css
@@ -13,7 +13,30 @@ pre.shiki {
   font-family: var(--vscode-editor-font-family);
 }
 
+
 /* Change the code colors based on VSCode exported body classes */
+/* Light is the default, we need to catch dark and high-contrast themes. */
+
+body.vscode-high-contrast .shiki,
+body.vscode-high-contrast .shiki span {
+  color: var(--shiki-contrast-dark) !important;
+  background-color: transparent !important;
+  /* Optional, if you also want font styles */
+  font-style: var(--shiki-contrast-dark-font-style) !important;
+  font-weight: var(--shiki-contrast-dark-font-weight) !important;
+  text-decoration: var(--shiki-contrast-dark-text-decoration) !important;
+}
+
+body.vscode-high-contrast-light .shiki,
+body.vscode-high-contrast-light .shiki span {
+  color: var(--shiki-contrast-light) !important;
+  background-color: transparent !important;
+  /* Optional, if you also want font styles */
+  font-style: var(--shiki-contrast-light-font-style) !important;
+  font-weight: var(--shiki-contrast-light-font-weight) !important;
+  text-decoration: var(--shiki-contrast-light-text-decoration) !important;
+}
+
 body.vscode-dark .shiki,
 body.vscode-dark .shiki span {
   color: var(--shiki-dark) !important;
@@ -22,4 +45,4 @@ body.vscode-dark .shiki span {
   font-style: var(--shiki-dark-font-style) !important;
   font-weight: var(--shiki-dark-font-weight) !important;
   text-decoration: var(--shiki-dark-text-decoration) !important;
-}
+}
diff --git a/ide/packages/panoptes/src/Code.tsx b/ide/packages/panoptes/src/Code.tsx
@@ -1,15 +1,23 @@
 import MonoSpace from "@argus/print/MonoSpace";
 import { VSCodeProgressRing } from "@vscode/webview-ui-toolkit/react";
+import _ from "lodash";
 import React, { useEffect, useState } from "react";
 import { type Highlighter, getHighlighter } from "shiki";
 
 import "./Code.css";
 
+const ARGUS_THEMES = {
+  dark: "dark-plus",
+  light: "light-plus",
+  "contrast-dark": "synthwave-84",
+  "contrast-light": "github-light-default"
+};
+
 const mkHighlighter = (() => {
   let h: Promise<Highlighter | undefined>;
   try {
     h = getHighlighter({
-      themes: ["dark-plus", "light-plus"],
+      themes: _.values(ARGUS_THEMES),
       langs: ["rust"]
     });
   } catch (e: any) {
@@ -21,18 +29,18 @@ const mkHighlighter = (() => {
 })();
 
 const codeToHtml = async ({ code, lang }: { code: string; lang: string }) => {
-  const highlighter = await mkHighlighter();
-  // TODO: I haven't tested that this works because Shiki has yet to fail :)
-  if (!highlighter) {
+  let highlighter: Highlighter | undefined;
+
+  try {
+    highlighter = await mkHighlighter();
+    if (!highlighter) throw new Error("Highlighter not initialized");
+  } catch (e: any) {
     return `<pre>${code}</pre>`;
   }
 
   return highlighter.codeToHtml(code, {
     lang,
-    themes: {
-      dark: "dark-plus",
-      light: "light-plus"
-    },
+    themes: ARGUS_THEMES,
     defaultColor: "light"
   });
 };

diff --git a/ide/packages/panoptes/src/TreeView/TreeApp.tsx b/ide/packages/panoptes/src/TreeView/TreeApp.tsx
@@ -5,7 +5,6 @@ import { TyCtxt } from "@argus/print/context";
 import React from "react";
 
 import BottomUp from "./BottomUp";
-import Erotisi from "./Erotisi";
 import Panels, { type PanelDescription, usePanelState } from "./Panels";
 import TopDown from "./TopDown";
 import "./TreeApp.css";
@@ -72,8 +71,9 @@ const TreeApp = ({
       )
     });
 
+    // FIXME: we will want to include this eventually, but not right now.
     // Push to place this last
-    tabs.push({ title: "Help Me", Content: Erotisi });
+    // tabs.push({ title: "Help Me", Content: Erotisi });
   }
 
   // HACK: we shouldn't test for eval mode here but Playwright is off on the button click.