@fraczak/k 6.7.0 → 6.8.0

package/DOCS/REPL.md

@@ -33,29 +33,23 @@ complete.
 | Command | Meaning |
 | --- | --- |
 | `:help` | Show command summary |
-| `:type name = <...>` | Define a type alias |
 | `:type name` | Show the canonical definition of a type |
 | `:code name` | Alias for `:C name` |
-| `:rel name = expr` | Define a relation alias |
-| `:def name = expr` | Alias for `:rel` |
 | `:run expr` | Evaluate `expr` on the current value |
 | `:eval expr` | Alias for `:run` |
 | `:time expr` | Evaluate `expr` and report compilation and execution time |
-| `:timing [on\|off]` | Toggle compilation and execution timing reporting for all evaluations |
 | `:t name` | Show relation input/output filters |
 | `:d name` | Show relation definition |
 | `:C name` | Show canonical code definition |
 | `:codes` | List type aliases |
 | `:rels` | List relation aliases |
 | `:codec load name\|file` | Load a built-in codec (`int`, `utf8`, `json`, `ieee`, `unit`) or an ES module file |
-| `:codec define n t b` | Define an inline custom codec: `name type { parse: ..., print: ... }` |
 | `:codec unload name` | Unload a registered codec |
 | `:codec list` | List loaded REPL codecs (alias: `:codecs`) |
-| `:input type [codec]` | Read the next line as codec input for a type |
+| `:input [<filter=(...)> [codec]]` | Read next input line using specified codec (opens dialog in browser) |
 | `:load [--no-alias] file` | Load `.k` source or `.klib` into the current state |
 | `:klib file` | Export the active relation closure as a `.klib` library |
 | `:ko file expr` | Export a `.ko` executable with `expr` as main |
-| `:val` | Print current value and JSON form |
 | `:reset` | Reset interpreter state |
 | `:quit` / `:exit` | Exit |
 
@@ -143,8 +137,8 @@ Tab completion covers:
 Type aliases also complete in `$name` position inside raw k input.
 
 For codec commands, completion covers `:codec load`, `:codec list`, file paths
-after `:codec load`, type names after `:input`, and loaded codec names
-after the input type.
+after `:codec load`, type names or codec names after `:input`, and loaded codec names
+after the input pattern or type.
 
 ## Loading
 
@@ -193,44 +187,39 @@ property-list pattern that can be canonicalized to a code hash, and that hash is
 recalculated by the REPL. A universal codec exports `universal = true` instead
 of `codes` or `patterns`.
 
-### `:codec define name type { parse: ..., print: ... }`
-
-Registers a dynamic custom codec directly from the REPL:
-
-```k
-> :type bool = <{} true, {} false>
-> :codec define yn bool ({ parse: (t) => Value.variant(t.trim() === 'yes' ? 'true' : 'false', Value.product({})), print: (v) => v.tag === 'true' ? 'YES' : 'NO' })
-```
 
 ### `:codec unload name`
 
 Unloads a previously registered codec by name.
 
-### `:input type [codec]`
+### `:input [<filter=(...)> [codec]]`
 
-Resolves `type` to a canonical code hash, selects the registered codec, and
-consumes the next line verbatim as codec input. `type` may be a type alias, a
-canonical code hash, or an inline type expression such as
-`<{} true, {} false>`. The parsed value is validated against that type before
-becoming the current value.
+Resolves a pattern expression (e.g. `? {string a, float64 n}`, `? (...)`, `? <{} true, {} false>`), a type alias, or a canonical code hash, selects the registered codec, and consumes the next line verbatim as codec input.
 
-## Timing and Profiling
+If only a universal codec is specified (e.g. `:input json`), no pre-declared type or pattern is required; input is parsed directly and derives its pattern from the input payload.
 
-### `:time expr`
+When a pattern expression or type is provided, the parsed value is validated and constrained against that pattern before becoming the current value:
 
-Evaluates `expr` and reports the elapsed time broken down into compilation
-(type derivation + WebAssembly lowering/compilation) and runtime execution:
+```text
+> :input ? {string a, float64 n} json
+input ? {string a, float64 n} using json: enter value text
+json> {"a": "Woj", "n": 123}
+```
+
+## Timing and Profiling
+
+Timing reporting is enabled by default for all evaluations, reporting elapsed time
+broken down into compilation (type derivation + WebAssembly lowering/compilation) and runtime execution:
 
 ```text
-> :time {10 int x, 5 int y} plus
+> {10 int x, 5 int y} plus
 {}|_|1|1|1|1|+ ?<{} _, ...>
 /* comp: 12.4ms, exec: 0.8ms */
 ```
 
-### `:timing [on|off]`
+### `:time expr`
 
-Toggles automatic timing reporting for every snippet or expression evaluated in
-the session.
+Evaluates `expr` with explicit timing and records performance metrics in session state.
 
 ## Web REPL (Studio)
 
@@ -279,11 +268,9 @@ Evaluated values print in k syntax together with the inferred envelope:
 ## Example Session
 
 ```text
-> :type nat = <{} 0, nat +1>
-$ nat = @...
-> :rel inc = |+1
-inc = @...
-> {} |0
+> $ nat = < {} 0, nat +1 >;
+> inc = | +1;
+> {} | 0
 {}|0 ?<{} 0, ...>
 > :t inc
 inc : ?X0  -->  ?<X0 +1, ...>  (@...)

package/TODO.md

@@ -0,0 +1,112 @@
+# Web REPL Improvements & Conceptual Cleanup Plan
+
+This document details the issues, conceptual improvements, and completed enhancements for the `k` Web REPL (`browser/repl-browser.mjs`, `scripts/build-repl-html.mjs`, and `repl.html`).
+
+---
+
+## 1. General Branding & Visual Cleanup
+
+### Removal of `λ` (Lambda) Symbol
+- [x] Remove `<span class="brand-lambda">λ</span>` from the navbar in `scripts/build-repl-html.mjs`.
+- [x] Remove the `.brand-lambda` CSS class.
+- [x] Update welcome banner in `browser/repl-browser.mjs` to `k interactive repl`.
+- [x] Replace `λ` in string codec sample inputs with ASCII/Unicode text samples (e.g. `"abc"`).
+
+---
+
+## 2. Help Modal (`? Help` / `:help`) Overhaul
+
+### Language Overview & Grammar Categorization
+- [x] **Language Overview**: Short, positive, accessible description: `k` is a concise language of types and relations (functions) over tree-like (JSON-like) documents.
+- [x] **Content-Addressed Identity**: Functions and types are identified by their canonical content hash (`@...`) derived directly from their structure; local names are just temporary aliases used for recursion and readability.
+- [x] **Three Clean Grammar Categories**:
+   1. **Definitions (Local Aliases)**:
+     - `name = relExpr;` &mdash; Relation alias (e.g. `swap = { . y x, . x y };`).
+     - `$ name = typeExpr;` &mdash; Type alias (e.g. `$ bool = < {} true, {} false >;`).
+  2. **Type Expressions (`typeExpr`)**: Schemas describing tree-like documents:
+     - `{ Type_1 label_1, ..., Type_k label_k }` &mdash; Product type of arity $k$ (labeled records, e.g. `{float64 x, string n}`; special case: `{}` is the 0-ary product).
+     - `< Type_1 tag_1, ..., Type_k tag_k >` &mdash; Union type of arity $k$ (tagged sum of variants, e.g. `<int ok, string err>`).
+     - `name` / `@hash` &mdash; Type reference.
+  3. **Relation Expressions (`relExpr`)**: Functions transforming an input document to an output document:
+     - `{ rel_1 label_1, ..., rel_k label_k }` &mdash; Product of arity $k$ (evaluates relations into record fields; special case: `{}` evaluates 0 relations, producing empty record `{}`).
+     - `< rel_1, ..., rel_k >` &mdash; Union / ordered choice of arity $k$ (evaluates relations in order until one succeeds).
+     - `( rel_1 ... rel_k )` &mdash; Composition of arity $k$ (sequentially composes relations; special case: `()` is the 0-ary composition denoting identity; parentheses can be omitted when non-empty: `f g`).
+     - `. label` &mdash; Field projection (extracts field `label`).
+     - `/ tag` &mdash; Variant branch projection (extracts payload of variant `tag`).
+     - `| tag` &mdash; Variant constructor (wraps document into variant `tag`).
+     - `$ typeExpr` &mdash; Type constraint (asserts input matches schema; compile-time Type Error on mismatch).
+     - `name` / `@hash` &mdash; Relation reference.
+- [x] **Simplified Intro**:
+  - Made arbitrary arity explicit across products `{...}`, unions `<...>`, and compositions `(...)`; explained `{}` and `()` as the natural 0-ary special cases; omitted the pattern/filter expressions table from the introductory reference.
+- [x] **Replaced Misleading Expressions & Snippets**:
+  - Removed phantom concepts (`10` as literal, "bit-path", `{10 int x, 5 int y} plus` in default state).
+  - Added self-contained snippets (`{} | ok`, `not = < / true | false, / false | true >;`, `$ bool = < {} true, {} false >;`, `not = $ bool < / true | false, {} | true > $ bool;`, `swap = { . y x, . x y };`).
+- [x] **Command Reference Table**:
+  - Added `:time <expr>`.
+  - Removed obsolete commands: `:rel <name> = expr`, `:val`, `:timing [on|off]`, `:codec define n t b`.
+  - Updated `:type <name>` to purely inspect and display type definitions (type definition is native via `$ name = typeExpr;`).
+  - Timing is now always enabled by default across all evaluations.
+  - Updated `:input` documentation to note the interactive browser dialog.
+  - Clarified `:codes` (type aliases/hashes) and `:rels` (relation aliases).
+
+---
+
+## 3. Codecs Modal Overhaul
+
+### Concept Correction: External Format Adapters
+- [x] Reframed codecs as format adapters translating external text to/from $k$ values defined as pairs `(filter, tree)`.
+- [x] **Type-Specific Codecs**:
+  - `int`: Converts decimal integers to/from `$ int = < bits '+', bits '-' >`.
+  - `ieee`: Converts decimal floats to/from `$ float64` records (`sign`, `exponent`, `fraction`).
+  - `utf8`: Converts text to/from `$ string` (aliased to `$ utf8`), a list of Unicode scalar values (`$ unicode`) partitioned by Unicode planes.
+  - `unit`: Converts to/from `{}`.
+- [x] **Parameterized Codecs**:
+  - `json`: JSON text is untyped; deserializing JSON requires a target $k$ type schema parameter (e.g. `:input {float64 x, string n} json`).
+- [x] **Custom Codec Studio**:
+  - Updated explanation to emphasize pairs `(filter, tree)`.
+  - Fixed `yn` preset to provide self-contained type definition `$ bool = < {} true, {} false >;`.
+  - Fixed `blank` preset with proper Value payload formatting.
+
+---
+
+## 4. 'Input' Modal Overhaul
+
+- [x] **Parameterized Codec Support**:
+  - Converted "Target Type" control into an editable combobox / text input with datalist autocomplete for known aliases, while allowing arbitrary composite type expressions (`{float64 x, string n}`, `<int ok, string err>`).
+  - Integrated `resolveInputTypeHash(state, rawType)` into live validation and modal submit.
+  - Marked `json` as a Parameterized Codec requiring a target type schema.
+  - Added composite quick samples demonstrating type + JSON payload pairs (e.g. `{float64 x, string n}` with `{"x":12, "n":"Woj"}`).
+  - Preserved CLI-specified type expressions when opening via `:input <type> [codec]`.
+
+---
+
+## 5. Welcome Banner
+
+- [x] Shortened initial welcome message to just the title line: `k interactive repl`.
+- [x] Removed secondary description and quick link lists to keep the terminal prompt clean and uncluttered.
+
+---
+
+## 6. Curated VFS & Navbar Examples Dropdown
+
+- [x] Added `poly.k` to `verifiedExamples` and `#example-select`.
+- [x] Structured Navbar Examples dropdown into self-contained basic expressions vs. library-dependent workflows.
+- [x] Removed `:val` from example dropdown list.
+- [x] Fixed `() ()` option display text.
+
+---
+
+## 7. Responsive Navbar & Obsolete Command Removal
+
+- [x] **Responsive Navbar on Narrow Screens**:
+  - Changed `.navbar` from fixed `height: 48px;` to `min-height: 48px; height: auto; flex-wrap: wrap; padding: 6px 16px; gap: 8px 12px;`.
+  - Styled `.nav-right` with `flex-wrap: wrap; justify-content: flex-end; min-width: 0;` so controls wrap smoothly without overflowing or clipping buttons (such as `? Help`).
+  - Added comprehensive responsive media query for narrow screens ($\le 768\text{px}$) with full width wrapping and adaptable control inputs.
+  - Verified via headless Chromium CDP automated tests that `#btn-help` is completely visible and interactable at narrow viewport widths (e.g. 600px).
+- [x] **Removed Obsolete Commands**:
+  - Removed `:rel <name> = expr` and `:def` (relations are defined using native syntax `name = expr;`).
+  - Removed `:type <name> = <...>` definition syntax from `:type` (types are defined using native syntax `$ name = typeExpr;`; `:type <name>` remains for inspecting type definitions).
+  - Removed `:val` completely.
+  - Removed `:timing [on|off]` (timing reporting is now permanently enabled by default for all evaluations; `:time <expr>` remains for explicit timing).
+  - Removed `:codec define n t b` (custom codecs are created using the browser Custom Codec Studio UI or loaded from modules via `:codec load`).
+

package/browser/repl-browser.mjs

@@ -3,19 +3,18 @@ import {
   evaluateInput,
   createCompleter,
   promptForState,
-  helpText,
   analyzeRawSnippet,
   lineTerminatesSnippet,
   lineHasExplicitContinuation,
   savedLibrary,
-  listCodecs,
-  loadCodecModule,
   registerCodec,
   unregisterCodec,
   resolveCodec,
   codeHashToPattern,
-  BUILTIN_CODECS,
-  formatDuration
+  formatDuration,
+  resolveInputTypeHash,
+  resolveInputPattern,
+  valueForPattern
 } from "../repl.mjs";
 import { Value, isProduct, isVariant } from "../Value.mjs";
 import { encodeLibrary } from "../object.mjs";
@@ -71,6 +70,7 @@ let inputPopupCodec;
 let inputPopupText;
 let inputPopupStatus;
 let inputPopupHint;
+let inputPopupCodecHint;
 let inputSamplesList;
 
 function escapeHtml(str) {
@@ -569,19 +569,19 @@ function exportKlib() {
 const CODEC_PRESETS = {
   yn: {
     name: "yn",
-    type: "bool",
+    type: "yes_no",
     universal: false,
-    parse: `// Parse 'yes', 'no', 'true', 'false' into $bool
+    parse: `// Parse 'yes', 'no', 'true', 'false' into $yes_no (< {} yes, {} no >)
 const tag = text.trim().toLowerCase();
 if (tag === "yes" || tag === "true" || tag === "1") {
-  return Value.variant("true", Value.product({}));
+  return Value.variant("yes", Value.product({}));
 }
 if (tag === "no" || tag === "false" || tag === "0") {
-  return Value.variant("false", Value.product({}));
+  return Value.variant("no", Value.product({}));
 }
 throw new Error("Expected yes/no or true/false");`,
-    print: `// Serialize boolean value to YES / NO
-return value.tag === "true" ? "YES" : "NO";`
+    print: `// Serialize yes_no value to YES / NO
+return value.tag === "yes" ? "YES" : "NO";`
   },
   hex: {
     name: "hex",
@@ -652,8 +652,9 @@ return "$" + dollars.toString() + "." + cents;`
     parse: `// Parse text string and return a K Value
 // Available: Value.product({ field: val }), Value.variant("tag", val)
 return Value.product({});`,
-    print: `// Serialize K Value into string or Buffer
-return JSON.stringify(value);`
+    print: `// Serialize K Value into string
+// value is a Value instance: inspect value.fields or value.tag & value.value
+return String(value);`
   }
 };
 
@@ -696,7 +697,7 @@ function renderCodecsModal() {
     for (const [alias, hash] of aliases) {
       const opt = document.createElement("option");
       opt.value = alias;
-      opt.textContent = `$${alias} (${hash.slice(0, 10)}...)`;
+      opt.textContent = `$ ${alias} (${hash.slice(0, 10)}...)`;
       typeGroup.appendChild(opt);
     }
     codecTypeSelect.appendChild(typeGroup);
@@ -838,9 +839,9 @@ function registerCustomCodecFromForm() {
       );
     }
 
-    let codeHash = rawType === "*" ? "*" : state.typeAliases[rawType] || rawType;
-    if (!codeHash.startsWith("@") && codeHash !== "*") {
-      throw new Error(`Cannot resolve type '${rawType}' to a canonical code hash. Define the type first (e.g. :type ${rawType} = ...).`);
+    let codeHash = "*";
+    if (rawType !== "*") {
+      codeHash = resolveInputTypeHash(state, rawType);
     }
 
     registerCodec(state, {
@@ -945,8 +946,8 @@ export function print(value, context) {
 
 const CODEC_SAMPLES = {
   int: ["0", "10", "42", "-15", "1000000"],
-  utf8: ["hello", "hello world", "k repl", "λ"],
-  json: ['{"name":"Alice"}', '{"x":10,"y":20}', 'true', '[1, 2, 3]'],
+  utf8: ["hello", "hello world", "k repl", "abc"],
+  json: ['{"x":12,"n":"Woj"}', '{"name":"Alice"}', 'true', '[1, 2, 3]'],
   ieee: ["0.0", "3.14159", "-2.718", "1e6"],
   yn: ["yes", "no", "true", "false"],
   hex: ["0x2A", "0xFF", "0x1000", "-0x10"],
@@ -997,6 +998,10 @@ function renderInputSamples(codecName) {
     btn.onclick = () => {
       if (inputPopupText) {
         inputPopupText.value = s;
+        if (codecName === "json" && s === '{"x":12,"n":"Woj"}' && (!inputPopupType?.value || inputPopupType.value === "*")) {
+          inputPopupType.value = "{float64 x, string n}";
+          updateInputPopupCodecs();
+        }
         inputPopupText.focus();
         updateLiveValidation();
       }
@@ -1007,19 +1012,36 @@ function renderInputSamples(codecName) {
 
 function updateInputPopupHint() {
   if (!inputPopupHint) return;
+  const rawPattern = inputPopupType ? inputPopupType.value.trim() : "(...)";
+  const codecName = inputPopupCodec?.value || state.pendingInput?.codecName;
   if (state.pendingInput) {
-    const rawType = inputPopupType?.value || state.pendingInput.codeHash;
-    const codecName = inputPopupCodec?.value || state.pendingInput.codecName;
-    inputPopupHint.innerHTML = `Enter input value for <b>$${escapeHtml(rawType)}</b> using codec <b>${escapeHtml(codecName || "default")}</b>:`;
+    const displayPattern = rawPattern || state.pendingInput.rawExpr || "(...)";
+    inputPopupHint.innerHTML = `Enter input value for <b>${escapeHtml(displayPattern)}</b> using codec <b>${escapeHtml(codecName || "default")}</b>:`;
   } else {
-    inputPopupHint.innerHTML = `Choose target type &amp; deserializer, then enter input string:`;
+    inputPopupHint.innerHTML = `Choose target pattern &amp; deserializer, then enter input string:`;
+  }
+
+  if (inputPopupCodecHint) {
+    if (codecName === "json") {
+      inputPopupCodecHint.textContent = "Parameterized codec: deserializes JSON into the specified Target Pattern.";
+    } else {
+      inputPopupCodecHint.textContent = "";
+    }
   }
 }
 
 function updateInputPopupCodecs() {
   if (!inputPopupCodec) return;
-  const rawType = inputPopupType?.value || "*";
-  const codeHash = rawType === "*" ? "*" : state.typeAliases?.[rawType] || rawType;
+  const rawPattern = inputPopupType ? inputPopupType.value.trim() : "(...)";
+  let codeHash = null;
+  if (rawPattern && rawPattern !== "*" && rawPattern !== "(...)") {
+    try {
+      const resolved = resolveInputPattern(state, rawPattern);
+      codeHash = resolved.codeHash;
+    } catch {
+      codeHash = null;
+    }
+  }
   const prev = inputPopupCodec.value;
 
   inputPopupCodec.innerHTML = "";
@@ -1027,8 +1049,8 @@ function updateInputPopupCodecs() {
   const store = state.codecs || {};
 
   const candidates = [
-    ...(store[codeHash] || []),
-    ...(codeHash !== "*" ? (store["*"] || []) : [])
+    ...(codeHash ? (store[codeHash] || []) : []),
+    ...(store["*"] || [])
   ];
 
   const seen = new Set();
@@ -1039,11 +1061,26 @@ function updateInputPopupCodecs() {
     }
   }
 
-  if (matchingCodecs.length === 0) {
-    if (rawType === "int") matchingCodecs.push("int");
-    if (rawType === "bool") matchingCodecs.push("yn");
-    if (rawType === "string") matchingCodecs.push("utf8");
+  const bareName = rawPattern.replace(/^(\?|\$)\s*/, "").trim();
+  if (!seen.has("json")) {
     matchingCodecs.push("json");
+    seen.add("json");
+  }
+  if ((bareName === "int" || (codeHash && codeHash === state.typeAliases?.int)) && !seen.has("int")) {
+    matchingCodecs.push("int");
+    seen.add("int");
+  }
+  if ((bareName === "string" || bareName === "utf8" || (codeHash && (codeHash === state.typeAliases?.string || codeHash === state.typeAliases?.utf8))) && !seen.has("utf8")) {
+    matchingCodecs.push("utf8");
+    seen.add("utf8");
+  }
+  if ((bareName === "float64" || bareName === "ieee" || (codeHash && codeHash === state.typeAliases?.float64)) && !seen.has("ieee")) {
+    matchingCodecs.push("ieee");
+    seen.add("ieee");
+  }
+  if ((bareName === "yes_no" || bareName === "bool" || (codeHash && codeHash === state.typeAliases?.yes_no)) && !seen.has("yn")) {
+    matchingCodecs.push("yn");
+    seen.add("yn");
   }
 
   for (const name of matchingCodecs) {
@@ -1064,39 +1101,38 @@ function updateInputPopupCodecs() {
   updateLiveValidation();
 }
 
-function populateInputPopupDropdowns(preselectedType = null, preselectedCodec = null) {
+function populateInputPopupDropdowns(preselectedPattern = null, preselectedCodec = null) {
   if (!inputPopupType) return;
 
-  let prevType = preselectedType;
-  if (!prevType && state.pendingInput) {
-    const foundAlias = Object.entries(state.typeAliases || {}).find(([, h]) => h === state.pendingInput.codeHash);
-    prevType = foundAlias ? foundAlias[0] : state.pendingInput.codeHash;
-  }
-  if (!prevType) {
-    prevType = inputPopupType.value;
+  const datalist = document.getElementById("input-popup-type-list");
+  if (datalist) {
+    datalist.innerHTML = "";
+    const aliases = Object.entries(state.typeAliases || {}).sort(([a], [b]) => a.localeCompare(b));
+    for (const [alias, hash] of aliases) {
+      const opt = document.createElement("option");
+      opt.value = `$ ${alias}`;
+      opt.textContent = `$ ${alias} (${hash.slice(0, 10)}...)`;
+      datalist.appendChild(opt);
+    }
+    const universalOpt = document.createElement("option");
+    universalOpt.value = "(...)";
+    universalOpt.textContent = "(...) (Any document)";
+    datalist.appendChild(universalOpt);
   }
 
-  inputPopupType.innerHTML = "";
-
-  const aliases = Object.entries(state.typeAliases || {}).sort(([a], [b]) => a.localeCompare(b));
-  for (const [alias, hash] of aliases) {
-    const opt = document.createElement("option");
-    opt.value = alias;
-    opt.textContent = `$${alias} (${hash.slice(0, 10)}...)`;
-    inputPopupType.appendChild(opt);
+  let prevPattern = preselectedPattern;
+  if (!prevPattern && state.pendingInput) {
+    prevPattern = state.pendingInput.rawExpr;
+    if (!prevPattern && state.pendingInput.codeHash) {
+      const foundAlias = Object.entries(state.typeAliases || {}).find(([, h]) => h === state.pendingInput.codeHash);
+      prevPattern = foundAlias ? `$ ${foundAlias[0]}` : state.pendingInput.codeHash;
+    }
   }
-
-  const universalOpt = document.createElement("option");
-  universalOpt.value = "*";
-  universalOpt.textContent = "* (Universal / Any)";
-  inputPopupType.appendChild(universalOpt);
-
-  if (prevType && (aliases.some(([a]) => a === prevType) || prevType === "*")) {
-    inputPopupType.value = prevType;
-  } else if (aliases.length > 0) {
-    inputPopupType.value = aliases[0][0];
+  if (!prevPattern) {
+    prevPattern = inputPopupType.value || "(...)";
   }
 
+  inputPopupType.value = prevPattern;
   updateInputPopupCodecs();
 
   const targetCodec = preselectedCodec || state.pendingInput?.codecName;
@@ -1114,26 +1150,39 @@ function updateLiveValidation() {
     return;
   }
 
-  const rawType = inputPopupType?.value;
+  const rawPattern = inputPopupType ? inputPopupType.value.trim() : "(...)";
   const codecName = inputPopupCodec?.value;
-  if (!rawType) {
-    inputPopupStatus.innerHTML = `<span class="line-warning" style="margin:0;padding:2px 6px;">Select a target type first.</span>`;
+  if (!rawPattern && !codecName) {
+    inputPopupStatus.innerHTML = `<span class="line-warning" style="margin:0;padding:2px 6px;">Specify a target pattern or codec first.</span>`;
     return;
   }
 
-  const codeHash = rawType === "*" ? "*" : state.typeAliases?.[rawType] || rawType;
+  let pattern = null;
+  let codeHash = null;
+  if (rawPattern && rawPattern !== "*" && rawPattern !== "(...)") {
+    try {
+      const resolved = resolveInputPattern(state, rawPattern);
+      pattern = resolved.pattern;
+      codeHash = resolved.codeHash;
+    } catch (err) {
+      inputPopupStatus.innerHTML = `<span class="line-warning" style="margin:0;padding:2px 6px;">⚠ Pattern Error: ${escapeHtml(err.message || String(err))}</span>`;
+      return;
+    }
+  }
+
   try {
     const codec = resolveCodec(state, codeHash, codecName || null, "parse");
-    const pattern = codeHashToPattern(codeHash, (h) => state.codes?.[h]);
+    const resolvedPattern = pattern || (codeHash && codeHash !== "*" ? codeHashToPattern(codeHash, (h) => state.codes?.[h]) : null);
     const parsed = codec.parse(text, {
       codeHash,
-      pattern,
+      pattern: resolvedPattern,
       state,
       Value,
       isProduct,
       isVariant
     });
-    const repr = parsed instanceof Value ? parsed.toJSON() : (typeof parsed === "object" ? JSON.stringify(parsed) : String(parsed));
+    const validated = valueForPattern(parsed, resolvedPattern, text, codec.name);
+    const repr = validated instanceof Value ? validated.toJSON() : (typeof validated === "object" ? JSON.stringify(validated) : String(validated));
     inputPopupStatus.innerHTML = `<span class="line-output" style="margin:0;padding:2px 6px;">✓ Valid: <code>${escapeHtml(String(repr))}</code></span>`;
   } catch (err) {
     inputPopupStatus.innerHTML = `<span class="line-warning" style="margin:0;padding:2px 6px;">⚠ ${escapeHtml(err.message || String(err))}</span>`;
@@ -1142,25 +1191,43 @@ function updateLiveValidation() {
 
 export async function submitInputPopup() {
   const text = inputPopupText?.value ?? "";
+  const rawPattern = inputPopupType ? inputPopupType.value.trim() : "(...)";
+  const codecName = inputPopupCodec?.value;
 
-  // If state.pendingInput is not set, configure it from the popup selections
-  if (!state.pendingInput) {
-    const rawType = inputPopupType?.value;
-    const codecName = inputPopupCodec?.value;
-    if (!rawType) {
-      if (inputPopupStatus) inputPopupStatus.innerHTML = `<span class="line-error">Please select a target type.</span>`;
-      return;
-    }
-    const codeHash = rawType === "*" ? "*" : state.typeAliases?.[rawType] || rawType;
+  if (!rawPattern && !codecName) {
+    if (inputPopupStatus) inputPopupStatus.innerHTML = `<span class="line-error">Please specify a target pattern or codec.</span>`;
+    return;
+  }
+
+  let pattern = null;
+  let codeHash = null;
+  let rawExpr = rawPattern || "(...)";
+  if (rawPattern && rawPattern !== "*" && rawPattern !== "(...)") {
     try {
-      const codec = resolveCodec(state, codeHash, codecName || null, "parse");
-      state.pendingInput = { codeHash, codecName: codec.name, promptName: codec.name };
+      const resolved = resolveInputPattern(state, rawPattern);
+      pattern = resolved.pattern;
+      codeHash = resolved.codeHash;
+      rawExpr = rawPattern;
     } catch (err) {
-      if (inputPopupStatus) inputPopupStatus.innerHTML = `<span class="line-error">${escapeHtml(err.message)}</span>`;
+      if (inputPopupStatus) inputPopupStatus.innerHTML = `<span class="line-error">Pattern Error: ${escapeHtml(err.message || String(err))}</span>`;
       return;
     }
   }
 
+  try {
+    const codec = resolveCodec(state, codeHash, codecName || null, "parse");
+    state.pendingInput = {
+      pattern,
+      codeHash,
+      codecName: codec.name,
+      promptName: codec.name,
+      rawExpr: rawExpr || codec.name
+    };
+  } catch (err) {
+    if (inputPopupStatus) inputPopupStatus.innerHTML = `<span class="line-error">${escapeHtml(err.message || String(err))}</span>`;
+    return;
+  }
+
   closeInputPopup();
   await executeCommand(text);
 }
@@ -1190,6 +1257,7 @@ export function initRepl() {
   inputPopupText = document.getElementById("input-popup-text");
   inputPopupStatus = document.getElementById("input-popup-status");
   inputPopupHint = document.getElementById("input-popup-hint");
+  inputPopupCodecHint = document.getElementById("input-popup-codec-hint");
   inputSamplesList = document.getElementById("input-samples-list");
 
   updatePrompt();
@@ -1197,16 +1265,7 @@ export function initRepl() {
   // Welcome message
   appendSystemMessage(`
 <div class="welcome-banner">
-  <div class="welcome-title">λ k interactive repl</div>
-  <div class="welcome-desc">First-order partial functions over algebraic data types &bull; WebAssembly execution engine &bull; Custom Serializers &amp; Deserializers (:codecs)</div>
-  <div class="welcome-tips">
-    <span>💡 Try: <a href="javascript:void(0)" class="quick-link" data-code=":load core.k">:load core.k</a></span>
-    <span>• <a href="javascript:void(0)" class="quick-link" data-code=":codec load int">:codec load int</a></span>
-    <span>• <a href="javascript:void(0)" class="quick-link" data-code="10 int">10 int</a></span>
-    <span>• <a href="javascript:void(0)" class="quick-link" data-code="{10 int x, 5 int y} plus">{10 int x, 5 int y} plus</a></span>
-    <span>• <a href="javascript:void(0)" class="quick-link" data-code=":codecs">:codecs</a></span>
-    <span>• <a href="javascript:void(0)" class="quick-link" data-code=":help">:help</a></span>
-  </div>
+  <div class="welcome-title">k interactive repl</div>
 </div>
 `, false, true);
 
@@ -1365,14 +1424,6 @@ export function initRepl() {
   const clearBtn = document.getElementById("btn-clear");
   if (clearBtn) clearBtn.onclick = clearOutput;
 
-  // Reset button
-  const resetBtn = document.getElementById("btn-reset");
-  if (resetBtn) {
-    resetBtn.onclick = () => {
-      executeCommand(":reset");
-    };
-  }
-
   // Help button
   const helpBtn = document.getElementById("btn-help");
   if (helpBtn) {
@@ -1458,6 +1509,7 @@ export function initRepl() {
 
   if (inputPopupType) {
     inputPopupType.addEventListener("change", updateInputPopupCodecs);
+    inputPopupType.addEventListener("input", updateInputPopupCodecs);
   }
 
   if (inputPopupCodec) {