Move some things around

src-web/lib/debounce.ts

@@ -0,0 +1,11 @@
+export function debounce(fn: (...args: any[]) => any, delay: number) {
+  let timer: ReturnType<typeof setTimeout>;
+  const result = function (...args: Parameters<typeof fn>) {
+    clearTimeout(timer);
+    timer = setTimeout(() => fn(...args), delay);
+  };
+  result.cancel = function () {
+    clearTimeout(timer);
+  };
+  return result;
+}

src-web/lib/theme/window.ts

@@ -8,9 +8,9 @@ const darkTheme: AppTheme = {
   appearance: 'dark',
   layers: {
     root: {
-      blackPoint: 0.3,
+      blackPoint: 0.2,
       colors: {
-        gray: '#656196',
+        gray: '#6b5b98',
         red: '#ee3b3b',
         orange: '#ff9411',
         yellow: '#dcc73b',
@@ -59,15 +59,10 @@ export function toggleAppearance(): Appearance {
   return newAppearance;
 }
 
-export function setAppearance(a?: Appearance, gray?: string) {
+export function setAppearance(a?: Appearance) {
   const appearance = a ?? getPreferredAppearance();
   const theme = appearance === 'dark' ? darkTheme : lightTheme;
 
-  // Hack to update the gray color for a demo
-  if (theme.layers.root && gray) {
-    theme.layers.root.colors.gray = gray;
-  }
-
   document.documentElement.setAttribute('data-appearance', appearance);
   document.documentElement.setAttribute('data-theme', theme.name);