framer-export 5.0.0-beta.2 → 5.0.0-beta.3

package/dist/cli/index.js

@@ -15,7 +15,7 @@ var init_package = __esm({
   "package.json"() {
     package_default = {
       name: "framer-export",
-      version: "5.0.0-beta.2",
+      version: "5.0.0-beta.3",
       description: "Export 25+ website platforms (Framer, Webflow, Wix, Shopify, Notion, WordPress, Squarespace, Ghost, and more) into a fully working local mirror. Downloads all assets, strips badges, rewrites URLs, and pretty-prints JS.",
       type: "module",
       main: "dist/cli/index.js",
@@ -1881,6 +1881,171 @@ var init_cooking = __esm({
   }
 });
 
+// src/cli/input.ts
+import { stdin } from "process";
+function parseInput(buffer) {
+  const events = [];
+  let i = 0;
+  while (i < buffer.length) {
+    const ch = buffer[i];
+    if (ch === "") {
+      events.push({ type: "key", name: "ctrl-c" });
+      i++;
+      continue;
+    }
+    if (ch === "\r" || ch === "\n") {
+      events.push({ type: "key", name: "return" });
+      i++;
+      continue;
+    }
+    if (ch === "	") {
+      events.push({ type: "key", name: "tab" });
+      i++;
+      continue;
+    }
+    if (ch === "\x7F" || ch === "\b") {
+      events.push({ type: "key", name: "backspace" });
+      i++;
+      continue;
+    }
+    if (ch === ESC) {
+      const rest = buffer.slice(i);
+      if (rest.length === 1) {
+        return { events, rest };
+      }
+      const next = rest[1];
+      if (next === "[" || next === "O") {
+        const sgr = rest.match(/^\x1B\[<(\d+);(\d+);(\d+)([mM])/);
+        if (sgr) {
+          const code = Number(sgr[1]);
+          const x = Number(sgr[2]);
+          const y = Number(sgr[3]);
+          const release = sgr[4] === "m";
+          if (code === 64) events.push({ type: "mouse", kind: "wheel-up", x, y });
+          else if (code === 65) events.push({ type: "mouse", kind: "wheel-down", x, y });
+          else if ((code & 32) === 32) events.push({ type: "mouse", kind: "move", x, y });
+          else if (release) events.push({ type: "mouse", kind: "click", x, y });
+          else events.push({ type: "mouse", kind: "press", x, y });
+          i += sgr[0].length;
+          continue;
+        }
+        if (/^\x1B\[<[\d;]*$/.test(rest)) {
+          return { events, rest };
+        }
+        const legacy = rest.match(/^\x1B\[M([\s\S])([\s\S])([\s\S])/);
+        if (legacy) {
+          const code = legacy[1].charCodeAt(0) - 32;
+          const x = legacy[2].charCodeAt(0) - 32;
+          const y = legacy[3].charCodeAt(0) - 32;
+          if (code === 64) events.push({ type: "mouse", kind: "wheel-up", x, y });
+          else if (code === 65) events.push({ type: "mouse", kind: "wheel-down", x, y });
+          else if ((code & 32) === 32) events.push({ type: "mouse", kind: "move", x, y });
+          else if ((code & 3) === 3) events.push({ type: "mouse", kind: "click", x, y });
+          else events.push({ type: "mouse", kind: "press", x, y });
+          i += legacy[0].length;
+          continue;
+        }
+        if (/^\x1B\[M[\s\S]{0,2}$/.test(rest)) {
+          return { events, rest };
+        }
+        const arrow = rest.match(/^\x1B[[O]([ABCD])/);
+        if (arrow) {
+          const names = { A: "up", B: "down", C: "right", D: "left" };
+          events.push({ type: "key", name: names[arrow[1]] });
+          i += arrow[0].length;
+          continue;
+        }
+        if (rest.startsWith("\x1B[3~")) {
+          events.push({ type: "key", name: "delete" });
+          i += 4;
+          continue;
+        }
+        const csi = rest.match(/^\x1B\[[0-?]*[ -/]*[@-~]/);
+        if (csi) {
+          i += csi[0].length;
+          continue;
+        }
+        if (/^\x1B\[[0-?]*[ -/]*$/.test(rest)) {
+          return { events, rest };
+        }
+        if (rest.length === 2) {
+          return { events, rest };
+        }
+        i += 2;
+        continue;
+      }
+      i += 2;
+      continue;
+    }
+    if (ch >= " ") {
+      const code = buffer.codePointAt(i);
+      const char = String.fromCodePoint(code);
+      events.push({ type: "char", char });
+      i += char.length;
+      continue;
+    }
+    i++;
+  }
+  return { events, rest: "" };
+}
+var ESC, ESC_TIMEOUT_MS, RawInput;
+var init_input = __esm({
+  "src/cli/input.ts"() {
+    "use strict";
+    ESC = "\x1B";
+    ESC_TIMEOUT_MS = 40;
+    RawInput = class {
+      constructor(handler) {
+        this.handler = handler;
+      }
+      handler;
+      buffer = "";
+      escTimer = null;
+      active = false;
+      onData = (chunk) => {
+        this.buffer += chunk.toString("utf-8");
+        this.drain();
+      };
+      start() {
+        if (this.active) return;
+        this.active = true;
+        stdin.setRawMode(true);
+        stdin.resume();
+        stdin.on("data", this.onData);
+      }
+      stop() {
+        if (!this.active) return;
+        this.active = false;
+        if (this.escTimer) clearTimeout(this.escTimer);
+        this.escTimer = null;
+        stdin.removeListener("data", this.onData);
+        stdin.setRawMode(false);
+        stdin.pause();
+      }
+      drain() {
+        if (this.escTimer) {
+          clearTimeout(this.escTimer);
+          this.escTimer = null;
+        }
+        const { events, rest } = parseInput(this.buffer);
+        this.buffer = rest;
+        for (const event of events) {
+          if (!this.active) return;
+          this.handler(event);
+        }
+        if (rest === ESC) {
+          this.escTimer = setTimeout(() => {
+            if (this.buffer === ESC) {
+              this.buffer = "";
+              if (this.active) this.handler({ type: "key", name: "escape" });
+            }
+          }, ESC_TIMEOUT_MS);
+        }
+      }
+    };
+  }
+});
+
 // src/cli/box.ts
 import chalk3 from "chalk";
 function maxWidth() {
@@ -1983,77 +2148,203 @@ var init_box = __esm({
 // src/cli/backdrop.ts
 import chalk4 from "chalk";
 import { stdout } from "process";
-function hash(x, y, frame) {
-  let h = x * 374761393 + y * 668265263 + frame * 2246822519;
-  h = (h ^ h >> 13) * 1274126177;
-  h = h ^ h >> 16;
-  return Math.abs(h) % 1e3;
-}
-var GLYPHS, COLORS, FRAME_MS, DENSITY, Backdrop;
+function fract(v) {
+  return v - Math.floor(v);
+}
+function hash11(n) {
+  return fract(Math.sin(n) * 43758.5453);
+}
+function mix(a, b, t) {
+  return a + (b - a) * t;
+}
+function vnoise(px, py, pz) {
+  const ix = Math.floor(px);
+  const iy = Math.floor(py);
+  const iz = Math.floor(pz);
+  const fx = px - ix;
+  const fy = py - iy;
+  const fz = pz - iz;
+  const dot = (ox, oy, oz) => (ix + ox) * 1 + (iy + oy) * 57 + (iz + oz) * 113;
+  const n000 = hash11(dot(0, 0, 0));
+  const n100 = hash11(dot(1, 0, 0));
+  const n010 = hash11(dot(0, 1, 0));
+  const n110 = hash11(dot(1, 1, 0));
+  const n001 = hash11(dot(0, 0, 1));
+  const n101 = hash11(dot(1, 0, 1));
+  const n011 = hash11(dot(0, 1, 1));
+  const n111 = hash11(dot(1, 1, 1));
+  const wx = fx * fx * fx * (fx * (fx * 6 - 15) + 10);
+  const wy = fy * fy * fy * (fy * (fy * 6 - 15) + 10);
+  const wz = fz * fz * fz * (fz * (fz * 6 - 15) + 10);
+  const x00 = mix(n000, n100, wx);
+  const x10 = mix(n010, n110, wx);
+  const x01 = mix(n001, n101, wx);
+  const x11 = mix(n011, n111, wx);
+  const y0 = mix(x00, x10, wy);
+  const y1 = mix(x01, x11, wy);
+  return mix(y0, y1, wz) * 2 - 1;
+}
+function fbm2(ux, uy, t) {
+  const px = ux * PATTERN_SCALE;
+  const py = uy * PATTERN_SCALE;
+  let amp = 1;
+  let freq = 1;
+  let sum = 1;
+  for (let i = 0; i < FBM_OCTAVES; i++) {
+    sum += amp * vnoise(px * freq, py * freq, t * freq);
+    freq *= FBM_LACUNARITY;
+    amp *= FBM_GAIN;
+  }
+  return sum * 0.5 + 0.5;
+}
+function bayer2exact(x, y) {
+  const ax = Math.floor(x);
+  const ay = Math.floor(y);
+  return fract(ax / 2 + ay * ay * 0.75);
+}
+function bayer4(x, y) {
+  return bayer2exact(0.5 * x, 0.5 * y) * 0.25 + bayer2exact(x, y);
+}
+function bayer8(x, y) {
+  return bayer4(0.5 * x, 0.5 * y) * 0.25 + bayer2exact(x, y);
+}
+var FRAME_MS, FBM_OCTAVES, FBM_LACUNARITY, FBM_GAIN, PATTERN_SCALE, PATTERN_DENSITY, PIXEL_JITTER, SPEED, EDGE_FADE, RIPPLE_SPEED, RIPPLE_THICKNESS, RIPPLE_INTENSITY, MAX_CLICKS, DAMP_T, DAMP_R, CELL_PX, GLYPHS, COLORS, Backdrop;
 var init_backdrop = __esm({
   "src/cli/backdrop.ts"() {
     "use strict";
-    GLYPHS = ["\xB7", "\xB7", "\u2022", "\u25AA"];
-    COLORS = ["#3d332a", "#4a3b2d", "#584535", "#33302c"];
-    FRAME_MS = 160;
-    DENSITY = 28;
+    FRAME_MS = 100;
+    FBM_OCTAVES = 5;
+    FBM_LACUNARITY = 1.25;
+    FBM_GAIN = 1;
+    PATTERN_SCALE = 3;
+    PATTERN_DENSITY = 1.1;
+    PIXEL_JITTER = 0.4;
+    SPEED = 0.5;
+    EDGE_FADE = 0.18;
+    RIPPLE_SPEED = 0.4;
+    RIPPLE_THICKNESS = 0.12;
+    RIPPLE_INTENSITY = 1.4;
+    MAX_CLICKS = 10;
+    DAMP_T = 1;
+    DAMP_R = 10;
+    CELL_PX = 8;
+    GLYPHS = ["\xB7", "\u2022", "\u25AA", "\u25CF"];
+    COLORS = ["#54402f", "#6b4c37", "#82593d", "#8f6244"];
     Backdrop = class {
       timer = null;
-      frame = 0;
-      prev = [];
+      disabled = false;
       exclude = null;
+      prev = /* @__PURE__ */ new Map();
+      clicks = [];
+      clickIx = 0;
+      timeOffset = Math.random() * 1e3;
+      startedAt = Date.now();
       constructor() {
-        if (process.env.FRAMER_EXPORT_NO_BG) this.frame = -1;
+        if (process.env.FRAMER_EXPORT_NO_BG) this.disabled = true;
       }
       setExclude(rect) {
         this.exclude = rect;
       }
+      addClick(col, row2) {
+        if (this.clicks.length < MAX_CLICKS) {
+          this.clicks.push({ x: col, y: row2 * 2, time: this.now() });
+        } else {
+          this.clicks[this.clickIx] = { x: col, y: row2 * 2, time: this.now() };
+        }
+        this.clickIx = (this.clickIx + 1) % MAX_CLICKS;
+      }
       start() {
-        if (this.frame === -1 || !stdout.isTTY || this.timer) return;
+        if (this.disabled || !stdout.isTTY || this.timer) return;
+        this.startedAt = Date.now();
         this.paint();
         this.timer = setInterval(() => this.paint(), FRAME_MS);
       }
       stop() {
         if (this.timer) clearInterval(this.timer);
         this.timer = null;
-        this.erasePrev();
-        this.prev = [];
+        this.erase();
+      }
+      now() {
+        return this.timeOffset + (Date.now() - this.startedAt) / 1e3 * SPEED;
       }
       inExclude(x, y) {
         const r = this.exclude;
         if (!r) return false;
         return y >= r.top && y < r.top + r.height && x >= r.left && x < r.left + r.width;
       }
-      erasePrev() {
-        if (this.prev.length === 0) return;
+      erase() {
+        if (this.prev.size === 0) return;
+        const columns = stdout.columns || 80;
         let out = "";
-        for (const [x, y] of this.prev) {
+        for (const key of this.prev.keys()) {
+          const x = key % columns + 1;
+          const y = Math.floor(key / columns) + 1;
           out += `\x1B[${y};${x}H `;
         }
         stdout.write(out);
+        this.prev.clear();
       }
       paint() {
         const rows = stdout.rows || 24;
         const columns = stdout.columns || 80;
-        this.frame++;
+        const resX = columns;
+        const resY = rows * 2;
+        const aspect = resX / resY;
+        const t = this.now();
+        const next = /* @__PURE__ */ new Map();
         let out = "";
-        for (const [x, y] of this.prev) {
-          if (!this.inExclude(x, y)) out += `\x1B[${y};${x}H `;
-        }
-        const next = [];
-        for (let y = 1; y <= rows; y += 2) {
-          for (let x = 1; x <= columns; x += 2) {
-            const h = hash(x, y, Math.floor(this.frame / 3) + Math.floor(x / 24) + Math.floor(y / 12));
-            if (h >= DENSITY) continue;
-            if (this.inExclude(x, y)) continue;
-            const glyph = GLYPHS[h % GLYPHS.length];
-            const color = COLORS[(h >> 2) % COLORS.length];
-            out += `\x1B[${y};${x}H${chalk4.hex(color)(glyph)}`;
-            next.push([x, y]);
+        for (let row2 = 1; row2 <= rows; row2++) {
+          const fy = row2 * 2 - resY * 0.5;
+          for (let col = 1; col <= columns; col++) {
+            if (this.inExclude(col, row2)) continue;
+            const fx = col - resX * 0.5;
+            const cellX = Math.floor(fx / CELL_PX) * CELL_PX;
+            const cellY = Math.floor(fy / CELL_PX) * CELL_PX;
+            const ux = cellX / resX * aspect;
+            const uy = cellY / resY;
+            let base = fbm2(ux, uy, t * 0.05);
+            base = base * 0.5 - 0.65;
+            let feed = base + (PATTERN_DENSITY - 0.5) * 0.3;
+            for (const click of this.clicks) {
+              const cux = (click.x - resX * 0.5 - CELL_PX * 0.5) / resX * aspect;
+              const cuy = (click.y - resY * 0.5 - CELL_PX * 0.5) / resY;
+              const dt = Math.max(t - click.time, 0);
+              const r = Math.hypot(ux - cux, uy - cuy);
+              const waveR = RIPPLE_SPEED * dt;
+              const ring = Math.exp(-(((r - waveR) / RIPPLE_THICKNESS) ** 2));
+              const atten = Math.exp(-DAMP_T * dt) * Math.exp(-DAMP_R * r);
+              feed = Math.max(feed, ring * atten * RIPPLE_INTENSITY);
+            }
+            const bayer = bayer8(fx, fy) - 0.5;
+            const bw = feed + bayer > 0.5 ? 1 : 0;
+            if (!bw) continue;
+            const h = fract(Math.sin(Math.floor(fx) * 127.1 + Math.floor(fy) * 311.7) * 43758.5453);
+            const jitterScale = 1 + (h - 0.5) * PIXEL_JITTER;
+            let coverage = bw * jitterScale;
+            if (EDGE_FADE > 0) {
+              const nx = col / columns;
+              const ny = row2 / rows;
+              const edge = Math.min(nx, ny, 1 - nx, 1 - ny);
+              const fade = Math.min(1, Math.max(0, edge / EDGE_FADE));
+              coverage *= fade * fade * (3 - 2 * fade);
+            }
+            if (coverage < 0.35) continue;
+            const level = Math.min(3, Math.floor(h * 4));
+            const key = (row2 - 1) * columns + (col - 1);
+            next.set(key, level);
+            if (this.prev.get(key) !== level) {
+              out += `\x1B[${row2};${col}H${chalk4.hex(COLORS[level])(GLYPHS[level])}`;
+            }
+            this.prev.delete(key);
           }
         }
+        for (const key of this.prev.keys()) {
+          const x = key % columns + 1;
+          const y = Math.floor(key / columns) + 1;
+          if (!this.inExclude(x, y)) out += `\x1B[${y};${x}H `;
+        }
         this.prev = next;
-        stdout.write(out);
+        if (out) stdout.write(out);
       }
     };
   }
@@ -2062,7 +2353,7 @@ var init_backdrop = __esm({
 // src/cli/select.ts
 import readline from "readline";
 import chalk5 from "chalk";
-import { stdin, stdout as stdout2 } from "process";
+import { stdin as stdin2, stdout as stdout2 } from "process";
 function panelRow(width, content = "") {
   const visible = stripAnsi(content).length;
   const pad = Math.max(0, width - visible);
@@ -2081,7 +2372,7 @@ function titleRow(width, title) {
   return chalk5.bgHex(THEME.panel)(left + " ".repeat(gap) + right);
 }
 async function select(question, options, defaultIndex = 0, config = {}) {
-  const isTTY = stdin.isTTY && stdout2.isTTY;
+  const isTTY = stdin2.isTTY && stdout2.isTTY;
   if (!isTTY) {
     const flat = options.map((o) => o.heading ? { ...o, disabled: true } : o);
     return fallbackPrompt(question, flat, defaultIndex, config);
@@ -2089,7 +2380,7 @@ async function select(question, options, defaultIndex = 0, config = {}) {
   return arrowSelect(question, options, defaultIndex, config);
 }
 async function promptInput(question, defaultValue = "", config = {}) {
-  if (!stdin.isTTY || !stdout2.isTTY) {
+  if (!stdin2.isTTY || !stdout2.isTTY) {
     return fallbackInput(question, defaultValue);
   }
   return fullscreenInput(question, defaultValue, config);
@@ -2098,22 +2389,33 @@ async function arrowSelect(question, options, defaultIndex, config) {
   const actions = config.actions ?? [];
   const headerLines = config.headerLines ?? [];
   const searchable = config.searchable === true;
-  const width = Math.max(50, Math.min(maxWidth(), 64));
-  const inner = width - 4;
   const hasActions = actions.length > 0;
   const headerCount = headerLines.length;
-  const rows = process.stdout.rows || 24;
-  const columns = process.stdout.columns || 80;
   const searchRows = searchable ? 1 : 0;
   const optionStartOffset = 3 + searchRows + headerCount + (headerCount > 0 ? 1 : 0);
-  const chromeLines = optionStartOffset + (hasActions ? 3 : 1) + 2;
-  const maxVisible = Math.max(4, rows - chromeLines);
-  const visibleCount = Math.min(options.length, maxVisible);
-  const actionLineOffset = optionStartOffset + visibleCount + 1;
-  const lineCount = actionLineOffset + (hasActions ? 2 : 1);
-  const panelTopRow = Math.max(2, Math.floor((rows - lineCount) / 2) + 1);
-  const panelLeftCol = Math.max(1, Math.floor((columns - width) / 2) + 1);
-  const footerRow = Math.min(rows, panelTopRow + lineCount + 1);
+  let width = 0;
+  let inner = 0;
+  let visibleCount = 0;
+  let actionLineOffset = 0;
+  let lineCount = 0;
+  let panelTopRow = 0;
+  let panelLeftCol = 0;
+  let footerRow = 0;
+  const recomputeLayout = () => {
+    width = Math.max(50, Math.min(maxWidth(), 64));
+    inner = width - 4;
+    const rows = process.stdout.rows || 24;
+    const columns = process.stdout.columns || 80;
+    const chromeLines = optionStartOffset + (hasActions ? 3 : 1) + 2;
+    const maxVisible = Math.max(4, rows - chromeLines);
+    visibleCount = Math.min(options.length, maxVisible);
+    actionLineOffset = optionStartOffset + visibleCount + 1;
+    lineCount = actionLineOffset + (hasActions ? 2 : 1);
+    panelTopRow = Math.max(2, Math.floor((rows - lineCount) / 2) + 1);
+    panelLeftCol = Math.max(1, Math.floor((columns - width) / 2) + 1);
+    footerRow = Math.min(rows, panelTopRow + lineCount + 1);
+  };
+  recomputeLayout();
   return new Promise((resolve) => {
     let query = "";
     const buildView = () => {
@@ -2153,6 +2455,8 @@ async function arrowSelect(question, options, defaultIndex, config) {
     }
     let selectedAction = null;
     let scrollOffset = 0;
+    let prevLines = [];
+    let prevFooter = "";
     const move = (direction) => {
       let next = selected + direction;
       while (next >= 0 && next < view.length) {
@@ -2174,14 +2478,18 @@ async function arrowSelect(question, options, defaultIndex, config) {
       scrollOffset = Math.max(0, Math.min(scrollOffset, view.length - visibleCount));
     };
     const backdrop = new Backdrop();
-    backdrop.setExclude({
-      top: panelTopRow - 1,
-      left: panelLeftCol - 2,
-      width: width + 4,
-      height: lineCount + 3
-    });
+    const syncBackdropExclude = () => {
+      backdrop.setExclude({
+        top: panelTopRow - 1,
+        left: panelLeftCol - 2,
+        width: width + 4,
+        height: lineCount + 3
+      });
+    };
+    syncBackdropExclude();
     const searchRow = () => {
-      const shown = query ? `${chalk5.hex(THEME.text)(query)}${chalk5.hex(THEME.primary)("\u258C")}` : ui.muted("type to search");
+      const clipped = truncatePlain(query, Math.max(10, inner - 6));
+      const shown = query ? `${chalk5.hex(THEME.text)(clipped)}${chalk5.hex(THEME.primary)("\u258C")}` : ui.muted("type to search");
       const content = ` ${chalk5.hex(THEME.text)("\u258F")} ${shown}`;
       const visible = stripAnsi(content).length;
       return chalk5.bgHex(THEME.element)(content + " ".repeat(Math.max(0, width - visible)));
@@ -2222,17 +2530,23 @@ async function arrowSelect(question, options, defaultIndex, config) {
         lines.push(panelRow(width, renderActions(actions, selectedAction)));
         lines.push(panelRow(width));
       }
-      lines.forEach((line, index) => writeAt(panelTopRow + index, panelLeftCol, line));
-      writeAt(
-        footerRow,
-        panelLeftCol,
-        centerText(
-          ui.muted(
-            config.footer || (searchable ? "type to search   \u2191\u2193 move   enter select   esc close" : "\u2191\u2193 move   enter select   mouse click   esc close")
-          ),
-          width
-        )
+      const sameLength = prevLines.length === lines.length;
+      lines.forEach((line, index) => {
+        if (!sameLength || prevLines[index] !== line) {
+          writeAt(panelTopRow + index, panelLeftCol, line);
+        }
+      });
+      prevLines = lines;
+      const footer = centerText(
+        ui.muted(
+          config.footer || (searchable ? "type to search   \u2191\u2193 move   enter select   esc close" : "\u2191\u2193 move   enter select   mouse click   esc close")
+        ),
+        width
       );
+      if (footer !== prevFooter) {
+        writeAt(footerRow, panelLeftCol, footer);
+        prevFooter = footer;
+      }
     };
     const refilter = () => {
       view = buildView();
@@ -2252,97 +2566,128 @@ async function arrowSelect(question, options, defaultIndex, config) {
       );
       resolve(value);
     };
-    const onMouseData = (chunk) => {
-      const mouse = parseMouseEvent(chunk);
-      if (!mouse) return;
-      if (mouse.kind === "wheel-up") {
-        move(-1);
-        render();
-        return;
-      }
-      if (mouse.kind === "wheel-down") {
-        move(1);
-        render();
-        return;
-      }
-      if (hasActions && mouse.y === panelTopRow + actionLineOffset) {
-        const actionIdx = actionIndexAtX(actions, mouse.x, panelLeftCol, inner);
+    const hitOption = (x, y) => {
+      const relative = y - panelTopRow - optionStartOffset;
+      if (relative < 0 || relative >= visibleCount) return null;
+      if (x < panelLeftCol || x >= panelLeftCol + width) return null;
+      const pos = scrollOffset + relative;
+      if (pos >= view.length || !selectableAt(pos)) return null;
+      return pos;
+    };
+    const onMouse = (kind, x, y) => {
+      if (kind === "click") backdrop.addClick(x, y);
+      if (hasActions && y === panelTopRow + actionLineOffset) {
+        const actionIdx = actionIndexAtX(actions, x, panelLeftCol, inner);
         if (actionIdx === null || actions[actionIdx].disabled) return;
         if (selectedAction !== actionIdx) {
           selectedAction = actionIdx;
           render();
         }
-        if (mouse.kind === "click") choose(actions[actionIdx].value);
+        if (kind === "click") choose(actions[actionIdx].value);
         return;
       }
-      const relative = mouse.y - panelTopRow - optionStartOffset;
-      if (relative < 0 || relative >= visibleCount) return;
-      const pos = scrollOffset + relative;
-      if (pos >= view.length || !selectableAt(pos)) return;
-      if (selected !== pos) {
+      const pos = hitOption(x, y);
+      if (pos === null) {
+        if (kind === "move" && selectedAction !== null) {
+          selectedAction = null;
+          render();
+        }
+        return;
+      }
+      if (selected !== pos || selectedAction !== null) {
         selected = pos;
         selectedAction = null;
         render();
       }
-      if (mouse.kind === "click") {
-        choose();
+      if (kind === "click") choose();
+    };
+    const onEvent = (event) => {
+      if (event.type === "mouse") {
+        if (event.kind === "wheel-up") {
+          move(-1);
+          render();
+        } else if (event.kind === "wheel-down") {
+          move(1);
+          render();
+        } else {
+          onMouse(event.kind, event.x, event.y);
+        }
+        return;
+      }
+      if (event.type === "key") {
+        switch (event.name) {
+          case "up":
+            move(-1);
+            selectedAction = null;
+            render();
+            return;
+          case "down":
+            move(1);
+            selectedAction = null;
+            render();
+            return;
+          case "tab":
+            if (hasActions) {
+              selectedAction = selectedAction === null ? 0 : null;
+              render();
+            }
+            return;
+          case "return":
+            if (selectedAction !== null) choose(actions[selectedAction].value);
+            else choose();
+            return;
+          case "ctrl-c":
+            cleanup();
+            process.exit(0);
+            return;
+          case "escape":
+            if (searchable && query) {
+              query = "";
+              refilter();
+              return;
+            }
+            cleanup();
+            process.exit(0);
+            return;
+          case "backspace":
+            if (searchable) {
+              query = query.slice(0, -1);
+              refilter();
+            }
+            return;
+          default:
+            return;
+        }
+      }
+      if (event.type === "char" && searchable && query.length < 40) {
+        query += cleanInputValue(event.char);
+        refilter();
       }
     };
+    const input = new RawInput(onEvent);
+    const onResize = () => {
+      recomputeLayout();
+      syncBackdropExclude();
+      prevLines = [];
+      prevFooter = "";
+      stdout2.write("\x1B[2J");
+      render();
+    };
     const cleanup = () => {
       backdrop.stop();
+      stdout2.removeListener("resize", onResize);
+      input.stop();
       leaveInteractiveScreen();
-      stdin.setRawMode(false);
-      stdin.removeListener("keypress", onKeypress);
-      stdin.removeListener("data", onMouseData);
-      stdin.pause();
     };
-    readline.emitKeypressEvents(stdin);
-    stdin.setRawMode(true);
     enterInteractiveScreen(true);
     render();
     backdrop.start();
-    const onKeypress = (str, key) => {
-      if (!key) return;
-      if (key.name === "up") {
-        move(-1);
-        selectedAction = null;
-        render();
-      } else if (key.name === "down") {
-        move(1);
-        selectedAction = null;
-        render();
-      } else if (key.name === "tab" && hasActions) {
-        selectedAction = selectedAction === null ? 0 : null;
-        render();
-      } else if (key.name === "return") {
-        if (selectedAction !== null) choose(actions[selectedAction].value);
-        else choose();
-      } else if (key.ctrl && key.name === "c") {
-        cleanup();
-        process.exit(0);
-      } else if (key.name === "escape") {
-        if (searchable && query) {
-          query = "";
-          refilter();
-          return;
-        }
-        cleanup();
-        process.exit(0);
-      } else if (searchable && key.name === "backspace") {
-        query = query.slice(0, -1);
-        refilter();
-      } else if (searchable && str && !key.ctrl && !key.meta && str >= " " && !isTerminalSequence(str, key)) {
-        query += cleanInputValue(str.replace(/[\r\n]/g, ""));
-        refilter();
-      }
-    };
-    stdin.resume();
-    stdin.on("data", onMouseData);
-    stdin.on("keypress", onKeypress);
+    stdout2.on("resize", onResize);
+    input.start();
   });
 }
 async function fallbackPrompt(question, options, defaultIndex, config) {
-  if (!stdin.isTTY) {
+  if (!stdin2.isTTY) {
     const firstEnabled = options.findIndex((option) => !option.disabled);
     const enabledDefault = options[defaultIndex]?.disabled ? firstEnabled : defaultIndex;
     const def = String(enabledDefault + 1);
@@ -2371,7 +2716,7 @@ async function fallbackPrompt(question, options, defaultIndex, config) {
     }
   }
   return new Promise((resolve) => {
-    const rl = readline.createInterface({ input: stdin, output: stdout2 });
+    const rl = readline.createInterface({ input: stdin2, output: stdout2 });
     const firstEnabled = options.findIndex((option) => !option.disabled);
     const enabledDefault = options[defaultIndex]?.disabled ? firstEnabled : defaultIndex;
     printFallbackOptions(question, options, enabledDefault, config);
@@ -2421,24 +2766,37 @@ async function fallbackPrompt(question, options, defaultIndex, config) {
 }
 function fullscreenInput(question, defaultValue, config) {
   const headerLines = config.headerLines ?? [];
-  const width = Math.max(50, Math.min(maxWidth(), 64));
-  const inner = width - 4;
   const headerCount = headerLines.length;
   const lineCount = 3 + headerCount + (headerCount > 0 ? 1 : 0) + 2;
-  const rows = process.stdout.rows || 24;
-  const columns = process.stdout.columns || 80;
-  const panelTopRow = Math.max(2, Math.floor((rows - lineCount) / 2) + 1);
-  const panelLeftCol = Math.max(1, Math.floor((columns - width) / 2) + 1);
-  const footerRow = Math.min(rows, panelTopRow + lineCount + 1);
+  let width = 0;
+  let inner = 0;
+  let panelTopRow = 0;
+  let panelLeftCol = 0;
+  let footerRow = 0;
+  const recomputeLayout = () => {
+    width = Math.max(50, Math.min(maxWidth(), 64));
+    inner = width - 4;
+    const rows = process.stdout.rows || 24;
+    const columns = process.stdout.columns || 80;
+    panelTopRow = Math.max(2, Math.floor((rows - lineCount) / 2) + 1);
+    panelLeftCol = Math.max(1, Math.floor((columns - width) / 2) + 1);
+    footerRow = Math.min(rows, panelTopRow + lineCount + 1);
+  };
+  recomputeLayout();
   return new Promise((resolve) => {
     let value = defaultValue;
+    let prevLines = [];
+    let prevFooter = "";
     const backdrop = new Backdrop();
-    backdrop.setExclude({
-      top: panelTopRow - 1,
-      left: panelLeftCol - 2,
-      width: width + 4,
-      height: lineCount + 3
-    });
+    const syncBackdropExclude = () => {
+      backdrop.setExclude({
+        top: panelTopRow - 1,
+        left: panelLeftCol - 2,
+        width: width + 4,
+        height: lineCount + 3
+      });
+    };
+    syncBackdropExclude();
     const render = () => {
       const shown = value || "";
       const clipped = truncatePlain(shown, Math.max(12, inner - 6));
@@ -2457,67 +2815,86 @@ function fullscreenInput(question, defaultValue, config) {
       if (headerCount > 0) lines.push(panelRow(width));
       lines.push(inputRow);
       lines.push(panelRow(width));
-      lines.forEach((line, index) => writeAt(panelTopRow + index, panelLeftCol, line));
-      writeAt(
-        footerRow,
-        panelLeftCol,
-        centerText(ui.muted(config.footer || "type value   enter confirm   esc close"), width)
+      const sameLength = prevLines.length === lines.length;
+      lines.forEach((line, index) => {
+        if (!sameLength || prevLines[index] !== line) {
+          writeAt(panelTopRow + index, panelLeftCol, line);
+        }
+      });
+      prevLines = lines;
+      const footer = centerText(
+        ui.muted(config.footer || "type value   enter confirm   esc close"),
+        width
       );
+      if (footer !== prevFooter) {
+        writeAt(footerRow, panelLeftCol, footer);
+        prevFooter = footer;
+      }
+    };
+    const onResize = () => {
+      recomputeLayout();
+      syncBackdropExclude();
+      prevLines = [];
+      prevFooter = "";
+      stdout2.write("\x1B[2J");
+      render();
     };
     const cleanup = () => {
       backdrop.stop();
+      stdout2.removeListener("resize", onResize);
+      input.stop();
       leaveInteractiveScreen();
-      stdin.setRawMode(false);
-      stdin.removeListener("keypress", onKeypress);
-      stdin.pause();
     };
     const submit = () => {
       const output2 = cleanInputValue(value.trim() || defaultValue);
       cleanup();
       resolve(output2);
     };
-    const onKeypress = (str, key) => {
-      if (key.ctrl && key.name === "c" || key.name === "escape") {
-        cleanup();
-        process.exit(0);
-      }
-      if (key.name === "return") {
-        submit();
-        return;
-      }
-      if (key.name === "backspace") {
-        value = value.slice(0, -1);
-        render();
-        return;
-      }
-      if (key.name === "delete") {
-        value = "";
-        render();
-        return;
+    const onEvent = (event) => {
+      if (event.type === "key") {
+        switch (event.name) {
+          case "ctrl-c":
+          case "escape":
+            cleanup();
+            process.exit(0);
+            return;
+          case "return":
+            submit();
+            return;
+          case "backspace":
+            value = value.slice(0, -1);
+            render();
+            return;
+          case "delete":
+            value = "";
+            render();
+            return;
+          default:
+            return;
+        }
       }
-      if (str && !key.ctrl && !key.meta && str >= " " && !isTerminalSequence(str, key)) {
-        value += cleanInputValue(str.replace(/[\r\n]/g, ""));
+      if (event.type === "char") {
+        value += cleanInputValue(event.char);
         render();
       }
     };
-    readline.emitKeypressEvents(stdin);
-    stdin.setRawMode(true);
+    const input = new RawInput(onEvent);
     enterInteractiveScreen(false);
     render();
     backdrop.start();
-    stdin.resume();
-    stdin.on("keypress", onKeypress);
+    stdout2.on("resize", onResize);
+    input.start();
   });
 }
 async function fallbackInput(question, defaultValue) {
-  if (!stdin.isTTY) {
+  if (!stdin2.isTTY) {
     const suffix = defaultValue ? ui.muted(` (${defaultValue})`) : "";
     console.log(`  ${ui.primary(">")} ${ui.text.bold(question)}${suffix}: `);
     const answer = await readPipedLine();
     return cleanInputValue(answer.trim() || defaultValue);
   }
   return new Promise((resolve) => {
-    const rl = readline.createInterface({ input: stdin, output: stdout2 });
+    const rl = readline.createInterface({ input: stdin2, output: stdout2 });
     const suffix = defaultValue ? ui.muted(` (${defaultValue})`) : "";
     rl.question(`  ${ui.primary(">")} ${ui.text.bold(question)}${suffix}: `, (answer) => {
       rl.close();
@@ -2550,14 +2927,14 @@ function readPipedLine() {
   if (!pipedLinesPromise) {
     pipedLinesPromise = new Promise((resolve) => {
       let data = "";
-      stdin.setEncoding("utf8");
-      stdin.on("data", (chunk) => {
+      stdin2.setEncoding("utf8");
+      stdin2.on("data", (chunk) => {
         data += chunk;
       });
-      stdin.on("end", () => {
+      stdin2.on("end", () => {
         resolve(data.split(/\r?\n/));
       });
-      stdin.on("error", () => {
+      stdin2.on("error", () => {
         resolve([]);
       });
     });
@@ -2586,21 +2963,32 @@ function labelForValue(value, options, actions) {
     options.find((option) => option.value === value)?.label || actions.find((action) => action.value === value)?.label || value
   );
 }
+function betaBadge() {
+  return chalk5.bgHex(THEME.warning).hex(THEME.background).bold(" beta ");
+}
+function splitBetaLabel(plain) {
+  if (plain.endsWith(BETA_SUFFIX)) {
+    return { base: plain.slice(0, -BETA_SUFFIX.length).trimEnd(), beta: true };
+  }
+  return { base: plain, beta: false };
+}
 function renderOption(option, isSelected, isDefault, width, inner) {
   const plain = truncatePlain(stripAnsi(option.label), Math.max(10, inner - 2));
   if (option.heading) {
     return panelRow(width, `   ${ui.accent.bold(plain)}`);
   }
+  const { base, beta } = splitBetaLabel(plain);
   if (isSelected && !option.disabled) {
     return selectedRow(width, ` ${isDefault ? "\u25CF" : " "} ${plain}`);
   }
+  const badge = beta ? `  ${betaBadge()}` : "";
   if (option.disabled) {
-    return panelRow(width, `   ${ui.muted(plain)}`);
+    return panelRow(width, `   ${ui.muted(base)}${badge}`);
   }
   if (isDefault) {
-    return panelRow(width, ` ${ui.primary("\u25CF")} ${ui.primary(plain)}`);
+    return panelRow(width, ` ${ui.primary("\u25CF")} ${ui.primary(base)}${badge}`);
   }
-  return panelRow(width, `   ${ui.text(plain)}`);
+  return panelRow(width, `   ${ui.text(base)}${badge}`);
 }
 function enterInteractiveScreen(enableMouse) {
   stdout2.write("\x1B[?1049h\x1B[2J\x1B[H\x1B[?25l");
@@ -2613,51 +3001,23 @@ function leaveInteractiveScreen() {
     "\x1B[?1003l\x1B[?1002l\x1B[?1000l\x1B[?1006l\x1B[?25h\x1B[?1049l"
   );
 }
-function parseMouseEvent(chunk) {
-  const text = chunk.toString("utf-8");
-  const match = text.match(/\x1B\[<(\d+);(\d+);(\d+)([mM])/);
-  if (!match) return parseLegacyMouseEvent(text);
-  const code = Number(match[1]);
-  const x = Number(match[2]);
-  const y = Number(match[3]);
-  const state2 = match[4];
-  if (code === 64) return { kind: "wheel-up", x, y };
-  if (code === 65) return { kind: "wheel-down", x, y };
-  if (state2 === "m") return { kind: "click", x, y };
-  if ((code & 32) === 32 || code === 35) return { kind: "hover", x, y };
-  if ((code & 3) === 0) return { kind: "hover", x, y };
-  return null;
-}
-function parseLegacyMouseEvent(text) {
-  const match = text.match(/\x1B\[M([\s\S])([\s\S])([\s\S])/);
-  if (!match) return null;
-  const code = match[1].charCodeAt(0) - 32;
-  const x = match[2].charCodeAt(0) - 32;
-  const y = match[3].charCodeAt(0) - 32;
-  if (code === 64) return { kind: "wheel-up", x, y };
-  if (code === 65) return { kind: "wheel-down", x, y };
-  if ((code & 3) === 3) return { kind: "click", x, y };
-  if ((code & 32) === 32) return { kind: "hover", x, y };
-  return { kind: "hover", x, y };
-}
 function writeAt(row2, col, text) {
   stdout2.write(`\x1B[${row2};${col}H${text}`);
 }
-function isTerminalSequence(str, key) {
-  return str.includes("\x1B") || !!key.sequence?.includes("\x1B") || /^(?:\d+;){2}\d+[mM]$/.test(str);
-}
 function cleanInputValue(value) {
   return value.replace(/\x1B\[<\d+;\d+;\d+[mM]/g, "").replace(/\x1B\[[0-?]*[ -/]*[@-~]/g, "").replace(/(?:\d+;){2}\d+[mM]/g, "").replace(/[\x00-\x08\x0B\x0C\x0E-\x1F\x7F]/g, "");
 }
-var pipedLinesPromise, pipedLineIndex;
+var pipedLinesPromise, pipedLineIndex, BETA_SUFFIX;
 var init_select = __esm({
   "src/cli/select.ts"() {
     "use strict";
+    init_input();
     init_box();
     init_backdrop();
     init_theme();
     pipedLinesPromise = null;
     pipedLineIndex = 0;
+    BETA_SUFFIX = "[beta]";
   }
 });
 
@@ -2763,11 +3123,13 @@ var init_page = __esm({
   .badge-beta {
     font-size: 10px;
     font-weight: 700;
-    color: var(--warning);
-    border: 1px solid var(--warning);
+    color: #131010;
+    background: var(--warning);
     border-radius: 3px;
-    padding: 1px 5px;
-    letter-spacing: 0.04em;
+    padding: 2px 7px;
+    letter-spacing: 0.05em;
+    text-transform: uppercase;
+    box-shadow: 0 0 10px rgba(245, 167, 66, 0.35);
   }
   .search-wrap { max-width: 420px; margin-bottom: 1.6rem; }
   .card .hint { font-size: 12px; color: var(--muted); margin-top: 8px; opacity: 0; transition: opacity .15s ease; }
@@ -3687,12 +4049,12 @@ var init_asset_map = __esm({
         }
         let filename;
         const baseName = path.basename(pathname.split("?")[0]);
-        const hash2 = crypto.createHash("md5").update(urlStr).digest("hex").slice(0, 6);
+        const hash = crypto.createHash("md5").update(urlStr).digest("hex").slice(0, 6);
         if (baseName && baseName.length > 1 && baseName !== "/") {
           const clean = baseName.replace(/[^a-zA-Z0-9._-]/g, "_");
-          filename = clean.includes(".") ? clean : `${clean}-${hash2}`;
+          filename = clean.includes(".") ? clean : `${clean}-${hash}`;
         } else {
-          filename = `asset-${hash2}${ext || ""}`;
+          filename = `asset-${hash}${ext || ""}`;
         }
         if (ext === ".mjs" || ext === ".js") {
           filename = baseName.replace(/[^a-zA-Z0-9._-]/g, "_");
@@ -5135,10 +5497,10 @@ var init_summary = __esm({
 // src/ai/prompt-assistant.ts
 import fs4 from "fs/promises";
 import path5 from "path";
-import { stdin as stdin2, stdout as stdout4 } from "process";
+import { stdin as stdin3, stdout as stdout4 } from "process";
 import { spawn } from "child_process";
 async function runAiPromptAssistant(exporter) {
-  if (!stdin2.isTTY || !stdout4.isTTY) return;
+  if (!stdin3.isTTY || !stdout4.isTTY) return;
   const serveCommand = buildServeCommand(exporter);
   const shouldConvert = await runExportCompletePrompt(exporter, serveCommand);
   if (!shouldConvert) return;
@@ -6195,7 +6557,7 @@ __export(setup_exports, {
   runSetup: () => runSetup
 });
 import readline2 from "readline/promises";
-import { stdin as stdin3, stdout as stdout5 } from "process";
+import { stdin as stdin4, stdout as stdout5 } from "process";
 import path8 from "path";
 import { URL as URL5 } from "url";
 import chalk9 from "chalk";
@@ -6332,7 +6694,7 @@ async function runSetup(legacyMode = false) {
   });
 }
 async function runLegacySetup() {
-  const rl = readline2.createInterface({ input: stdin3, output: stdout5 });
+  const rl = readline2.createInterface({ input: stdin4, output: stdout5 });
   const ask = async (question, defaultVal) => {
     const suffix = defaultVal ? chalk9.gray(` (${defaultVal})`) : "";
     const prompt = `  ${ui.primary("\u25CF")} ${ui.text.bold(question)}${suffix} ${ui.muted(">")} `;