Underscore

mogul/src/components/Console.module.css

@@ -132,6 +132,9 @@
   li:last-child :global(.expr-mark-reducible) {
     display: none;
   }
+  li:first-child :global(.expr-mark-reducible) {
+    display: inline;
+  }
 
   li:hover {
     :global(.reducible) {

mogul/src/components/Console.tsx

@@ -1,5 +1,5 @@
 import classNames from "classnames";
-import { For, Index, type JSX, Show, createEffect, onCleanup } from "solid-js";
+import { For, Index, type JSX, Show, onMount, onCleanup } from "solid-js";
 import { type DisplayStyle, renderFunc, sortFuncs } from "~/service/func";
 import {
   consoleOut,
@@ -29,7 +29,7 @@ interface ConsoleProps {
 
 export default function Console(props: ConsoleProps): JSX.Element {
   let wrapper: HTMLDivElement | undefined;
-  createEffect(() => {
+  onMount(() => {
     if (wrapper == null) return;
     const observer = createObserver(wrapper);
     onCleanup(() => {

mogul/src/components/ReduceRow.tsx

@@ -6,26 +6,33 @@ import {
   markReducible,
 } from "~/lib/mark";
 
-export function ReduceRow(props: {
+interface ReduceRowProps {
   expr: string;
   reducedRange?: ExprRange | null;
   reducibleRange?: ReducibleRange | null;
-}): JSX.Element {
+}
+
+export function ReduceRow(props: ReduceRowProps): JSX.Element {
   let reducedRef: HTMLSpanElement | undefined;
-  if (props.reducedRange != null) {
-    const reduced = markReduced(props.expr, props.reducedRange);
-    onMount(() => {
+  let reducibleRef: HTMLSpanElement | undefined;
+
+  onMount(() => {
+    if (props.reducedRange == null && props.reducibleRange == null) {
+      if (reducibleRef != null) {
+        reducibleRef.innerText = props.expr;
+      }
+    }
+
+    if (props.reducedRange != null) {
+      const reduced = markReduced(props.expr, props.reducedRange);
       reducedRef?.appendChild(reduced);
-    });
-  }
+    }
 
-  let reducibleRef: HTMLSpanElement | undefined;
-  if (props.reducibleRange != null) {
-    const reducible = markReducible(props.expr, props.reducibleRange);
-    onMount(() => {
+    if (props.reducibleRange != null) {
+      const reducible = markReducible(props.expr, props.reducibleRange);
       reducibleRef?.appendChild(reducible);
-    });
-  }
+    }
+  });
 
   return (
     <>

mogul/src/components/SideTools/Context.module.css

@@ -5,6 +5,10 @@
     font-size: .9rem;
     font-weight: 500;
     color: #666;
+
+    &:not(:first-child) {
+      margin-top: 1em;
+    }
   }
 
   li {

mogul/src/components/SideTools/Context.tsx

@@ -1,6 +1,7 @@
-import { type JSX, For } from "solid-js";
+import { type JSX, For, Show } from "solid-js";
 import { context } from "~/signals";
 import { type DisplayStyle, renderFunc, sortFuncs } from "~/service/func";
+import { aliases } from "~/service/aliases";
 import styles from "./Context.module.css";
 
 interface ContextProps {
@@ -9,10 +10,25 @@ interface ContextProps {
 
 export default function Context(props: ContextProps): JSX.Element {
   const funcs = () =>
-    sortFuncs(Object.values(context())).map((func) => renderFunc(func));
+    sortFuncs(Object.values(context())).map((func) =>
+      renderFunc(func, props.displayStyle),
+    );
 
   return (
     <div class={styles.context}>
+      <Show when={aliases().length > 0}>
+        <h2>Shortcut Reference</h2>
+        <ul>
+          <For each={aliases()}>
+            {(alias) => (
+              <li>
+                <code>{alias}</code>
+              </li>
+            )}
+          </For>
+        </ul>
+      </Show>
+
       <h2>Context</h2>
       <ul>
         <For each={funcs()}>

mogul/src/components/SideTools/Settings.tsx

@@ -1,12 +1,7 @@
 import type { JSX } from "solid-js";
 import styles from "./Settings.module.css";
-import {
-  resetContext,
-  clearContext,
-  displayStyle,
-  setDisplayStyle,
-  sideTools,
-} from "~/signals";
+import { displayStyle, setDisplayStyle, sideTools } from "~/signals";
+import { resetContext, clearContext } from "~/service/context";
 
 export default function Settings(): JSX.Element {
   return (

mogul/src/service/aliases.ts

@@ -0,0 +1,26 @@
+import { aliases as getAliases, setAliases, displayStyle } from "~/signals";
+import { type Aliases, type Expr, renderExpr } from "../../../ski3/pkg/index";
+export { Aliases };
+
+export function addAlias(expr: Expr) {
+  setAliases((prev) => {
+    const newAliases: Aliases = { _: expr };
+    if (prev._) newAliases._0 = prev._;
+    if (prev._0) newAliases._1 = prev._0;
+    if (prev._1) newAliases._2 = prev._1;
+    if (prev._2) newAliases._3 = prev._2;
+    if (prev._3) newAliases._4 = prev._3;
+    if (prev._4) newAliases._5 = prev._4;
+    if (prev._5) newAliases._6 = prev._5;
+    if (prev._6) newAliases._7 = prev._6;
+    if (prev._7) newAliases._8 = prev._7;
+    if (prev._8) newAliases._9 = prev._8;
+    return newAliases;
+  });
+}
+
+export function aliases(): string[] {
+  return Object.entries(getAliases())
+    .toSorted(([a], [b]) => a.localeCompare(b))
+    .map(([name, expr]) => `${name} = ${renderExpr(expr, displayStyle())}`);
+}

mogul/src/service/command.ts

@@ -12,6 +12,7 @@ import {
   reduceTail,
 } from "~/service/reduce";
 import { unlambda } from "~/service/unlambda";
+import { addAlias } from "~/service/aliases";
 import { type Command, parseCommand } from "../../../ski3/pkg/index";
 export { type Command, parseCommand };
 
@@ -53,6 +54,9 @@ export async function runCommand(command: Command) {
             },
           ]);
         },
+        onEnd: (result) => {
+          addAlias(result.expr);
+        },
       });
       return;
     }
@@ -63,19 +67,28 @@ export async function runCommand(command: Command) {
         readonly formed: FormedReducedExpr;
       } | null>(null);
       await reduceLast(command.expr, {
-        onInit: ({ formed }) => {
-          putConsoleItem({
-            type: "ReduceLast",
-            formed,
-            reduceResult,
-          });
+        onInit: ({ formed, hasNext }) => {
+          hasNext
+            ? putConsoleItem({
+                type: "ReduceLast",
+                formed,
+                reduceResult,
+              })
+            : putConsoleItem({
+                type: "Reduce",
+                formed,
+                reduceResults: () => [],
+              });
         },
         onReduce: ({ step, formed }) => {
           setReduceResult({
             step,
             formed,
           });
         },
+        onEnd: (result) => {
+          addAlias(result.expr);
+        },
       });
       return;
     }
@@ -105,6 +118,9 @@ export async function runCommand(command: Command) {
             },
           ]);
         },
+        onEnd: (result) => {
+          addAlias(result.expr);
+        },
       });
       return;
     }
@@ -134,6 +150,9 @@ export async function runCommand(command: Command) {
             },
           ]);
         },
+        onEnd: (result) => {
+          addAlias(result.expr);
+        },
       });
       return;
     }
@@ -159,6 +178,7 @@ export async function runCommand(command: Command) {
     case "Unlambda": {
       const result = unlambda(command.level, command.expr);
       putConsoleItem({ type: "Unlambda", expr: command.expr, result });
+      addAlias(result);
       return;
     }
   }

mogul/src/service/context.ts

@@ -1,6 +1,5 @@
 import { context, setContext } from "~/signals";
-import type { Func } from "../../../ski3/pkg/index";
-export type { Context } from "../../../ski3/pkg/index";
+import { type Func, defaultContext } from "../../../ski3/pkg/index";
 
 export function updateFunction(func: Func) {
   setContext((prev) => ({ ...prev, [func.name]: func }));
@@ -17,3 +16,11 @@ export function deleteFunction(identifier: string) {
 export function queryFunction(identifier: string): Func | null {
   return context()[identifier] ?? null;
 }
+
+export function resetContext() {
+  setContext(defaultContext());
+}
+
+export function clearContext() {
+  setContext({});
+}

mogul/src/service/reduce.ts

@@ -1,4 +1,4 @@
-import { context, displayStyle } from "~/signals";
+import { context, aliases, displayStyle } from "~/signals";
 import {
   type Expr,
   type FormedReducedExpr,
@@ -12,48 +12,51 @@ const MAX_STEPS = 1000;
 interface ReduceOptions {
   onInit?: (reducer: Reducer) => void;
   onReduce?: (reduceResult: ReduceResult) => void;
+  onEnd?: (reduceResult: ReduceResult) => void;
   maxSteps?: number;
 }
 
 export async function reduceHead(
   expr: Expr,
   options?: ReduceOptions,
 ): Promise<void> {
-  const { onInit, onReduce, maxSteps } = options ?? {};
+  const { onInit, onReduce, onEnd, maxSteps } = options ?? {};
 
-  const reducer = new Reducer(context(), expr, displayStyle());
+  const reducer = new Reducer(context(), aliases(), expr, displayStyle());
 
   onInit?.(reducer);
 
+  let reduceResult: ReduceResult | null = null;
   while (true) {
     const result = reducer.next();
 
-    if (result.done) return;
+    if (result.done) break;
 
-    const reduceResult = result.value;
+    reduceResult = result.value;
 
     if (reduceResult == null) continue;
 
     onReduce?.(reduceResult);
 
-    if ((maxSteps ?? MAX_STEPS) <= reduceResult.step) return;
+    if ((maxSteps ?? MAX_STEPS) <= reduceResult.step) break;
 
     await new Promise((resolve) => setTimeout(resolve, 0));
   }
+
+  reduceResult && onEnd?.(reduceResult);
 }
 
 export async function reduceTail(
   expr: Expr,
   options: ReduceOptions & { count: number },
 ): Promise<void> {
-  const { onInit, onReduce, maxSteps, count } = options;
+  const { onInit, onReduce, onEnd, maxSteps, count } = options;
 
-  const reducer = new Reducer(context(), expr, displayStyle());
+  const reducer = new Reducer(context(), aliases(), expr, displayStyle());
 
   onInit?.(reducer);
 
   let reduceResults: ReduceResult[] = [];
-
   while (true) {
     const result = reducer.next();
 
@@ -79,34 +82,38 @@ export async function reduceTail(
   for (const reduceResult of tail) {
     onReduce?.(reduceResult);
   }
+
+  if (tail.length > 0) {
+    onEnd?.(tail[tail.length - 1]);
+  }
 }
 
 export async function reduceLast(
   expr: Expr,
   options?: ReduceOptions,
 ): Promise<void> {
-  const { onInit, onReduce, maxSteps } = options ?? {};
+  const { onInit, onReduce, onEnd, maxSteps } = options ?? {};
 
-  const reducer = new Reducer(context(), expr, displayStyle());
+  const reducer = new Reducer(context(), aliases(), expr, displayStyle());
 
   onInit?.(reducer);
 
+  let reduceResult: ReduceResult | null = null;
   while (true) {
     const result = reducer.next();
 
-    if (result.done) return;
+    if (result.done) break;
 
-    const reduceResult = result.value;
+    reduceResult = result.value;
 
     if (reduceResult == null) continue;
 
-    if (!reducer.hasNext) {
-      onReduce?.(reduceResult);
-      return;
-    }
-
-    if ((maxSteps ?? MAX_STEPS) <= reduceResult.step) return;
+    if (!reducer.hasNext) break;
+    if ((maxSteps ?? MAX_STEPS) <= reduceResult.step) break;
 
     await new Promise((resolve) => setTimeout(resolve, 0));
   }
+
+  reduceResult && onReduce?.(reduceResult);
+  reduceResult && onEnd?.(reduceResult);
 }