dotenvx-ui 0.1.1 → 0.2.0

package/dist/cli.js

@@ -1,141 +1,34 @@
 #!/usr/bin/env node
+import {
+  addKey,
+  decryptAllValues,
+  decryptFile,
+  decryptValue,
+  encryptFile,
+  encryptKey,
+  isEncryptedValue,
+  readEnvFile,
+  removeKey,
+  scan,
+  updateKey
+} from "./chunk-GSBFG44K.js";
 
 // src/cli.tsx
+import { createRequire } from "module";
 import { render } from "ink";
 
-// src/core/scanner.ts
-import { readdirSync, readFileSync, statSync } from "fs";
-import { join, relative, basename, dirname } from "path";
-var SKIP_DIRS = /* @__PURE__ */ new Set([
-  "node_modules",
-  ".git",
-  "dist",
-  ".next",
-  ".turbo",
-  "build",
-  ".cache"
-]);
-function detectRoot(cwd) {
-  let dir = cwd;
-  while (true) {
-    try {
-      statSync(join(dir, ".git"));
-      return dir;
-    } catch {
-    }
-    const parent = dirname(dir);
-    if (parent === dir) break;
-    dir = parent;
-  }
-  return cwd;
-}
-function scanForEnvFiles(root) {
-  const results = [];
-  function walk(dir) {
-    let entries;
-    try {
-      entries = readdirSync(dir);
-    } catch {
-      return;
-    }
-    for (const entry of entries) {
-      if (SKIP_DIRS.has(entry)) continue;
-      const full = join(dir, entry);
-      try {
-        const stat = statSync(full);
-        if (stat.isDirectory()) {
-          walk(full);
-        } else if (isEnvFile(entry)) {
-          results.push(full);
-        }
-      } catch {
-      }
-    }
-  }
-  walk(root);
-  return results;
-}
-function isEnvFile(name) {
-  if (name === ".env.keys") return false;
-  return name === ".env" || name.startsWith(".env.");
-}
-function parseEnvironmentFromFilename(filename) {
-  const name = basename(filename);
-  if (name === ".env") return "default";
-  const suffix = name.slice(".env.".length);
-  return suffix || "default";
-}
-function scan(cwd) {
-  const root = detectRoot(cwd);
-  const paths = scanForEnvFiles(root);
-  return paths.map((filePath) => {
-    const rel = relative(root, filePath);
-    const pkg = relative(root, dirname(filePath)) || ".";
-    const environment = parseEnvironmentFromFilename(basename(filePath));
-    let content = "";
-    try {
-      content = readFileSync(filePath, "utf8");
-    } catch {
-    }
-    const hasPublicKey = content.includes("DOTENV_PUBLIC_KEY=");
-    const encrypted = /encrypted:/.test(content);
-    return {
-      path: filePath,
-      relativePath: rel,
-      package: pkg,
-      environment,
-      encrypted,
-      hasPublicKey,
-      keys: []
-    };
-  });
-}
-
 // src/tui/App.tsx
-import { useState as useState4 } from "react";
-import { Box as Box7, Text as Text7, useApp, useInput as useInput6, useStdin as useStdin6 } from "ink";
 import clipboard from "clipboardy";
+import { Box as Box7, Text as Text7, useApp, useInput as useInput6, useStdin as useStdin6 } from "ink";
+import { useState as useState4 } from "react";
 
-// src/tui/FileList.tsx
+// src/tui/DiffView.tsx
 import { Box, Text, useInput, useStdin } from "ink";
-import { jsx, jsxs } from "react/jsx-runtime";
-function FileList({ files, selectedIndex, focused, interactive, onSelect }) {
-  const { isRawModeSupported } = useStdin();
-  useInput((_, key) => {
-    if (!focused) return;
-    if (key.upArrow) onSelect(Math.max(0, selectedIndex - 1));
-    if (key.downArrow) onSelect(Math.min(files.length - 1, selectedIndex + 1));
-  }, { isActive: isRawModeSupported && interactive });
-  const byPkg = Map.groupBy(files, (f) => f.package);
-  return /* @__PURE__ */ jsx(Box, { flexDirection: "column", width: 24, borderStyle: "single", borderRight: true, borderTop: false, borderBottom: false, borderLeft: false, children: Array.from(byPkg.entries()).map(([pkg, pkgFiles]) => /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
-    /* @__PURE__ */ jsxs(Text, { bold: true, dimColor: true, children: [
-      " ",
-      pkg
-    ] }),
-    pkgFiles.map((f) => {
-      const idx = files.indexOf(f);
-      const selected = idx === selectedIndex;
-      return /* @__PURE__ */ jsx(Box, { paddingLeft: 2, children: /* @__PURE__ */ jsxs(
-        Text,
-        {
-          backgroundColor: selected && focused ? "blue" : void 0,
-          color: selected && focused ? "white" : selected ? "cyan" : void 0,
-          children: [
-            f.encrypted ? "\u{1F512} " : "   ",
-            f.environment
-          ]
-        }
-      ) }, f.path);
-    })
-  ] }, pkg)) });
-}
-
-// src/tui/KeyTable.tsx
-import { Box as Box2, Text as Text2, useInput as useInput2, useStdin as useStdin2 } from "ink";
+import { useEffect as useEffect2, useMemo, useRef, useState as useState2 } from "react";
 
 // src/tui/useTerminalRows.ts
-import { useEffect, useState } from "react";
 import { useStdout } from "ink";
+import { useEffect, useState } from "react";
 function useTerminalRows() {
   const { stdout } = useStdout();
   const [rows, setRows] = useState(stdout?.rows ?? 24);
@@ -163,7 +56,8 @@ function useTerminalCols() {
   return cols;
 }
 function scrollWindow(length, selectedIndex, maxVisible) {
-  if (length <= maxVisible) return { start: 0, end: length, above: 0, below: 0 };
+  if (length <= maxVisible)
+    return { start: 0, end: length, above: 0, below: 0 };
   const start = Math.min(
     Math.max(0, selectedIndex - Math.floor(maxVisible / 2)),
     length - maxVisible
@@ -172,444 +66,8 @@ function scrollWindow(length, selectedIndex, maxVisible) {
   return { start, end, above: start, below: length - end };
 }
 
-// src/tui/KeyTable.tsx
-import { Fragment, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var SECRET_PATTERN = /secret|password|token|key|private|api_?key/i;
-var MAX_INLINE = 48;
-function truncate(s) {
-  const first = s.split("\n")[0];
-  return first.length > MAX_INLINE ? first.slice(0, MAX_INLINE - 1) + "\u2026" : first;
-}
-function maskValue(k, revealed) {
-  if (revealed.has(k.key)) return truncate(revealed.get(k.key));
-  if (k.encrypted) return "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022";
-  if (SECRET_PATTERN.test(k.key)) return "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022";
-  return truncate(k.value);
-}
-function KeyTable({ file, keys, selectedIndex, focused, interactive, revealed, onSelect, maxRows }) {
-  const { isRawModeSupported } = useStdin2();
-  useInput2((_, key) => {
-    if (!focused) return;
-    if (key.upArrow) onSelect(Math.max(0, selectedIndex - 1));
-    if (key.downArrow) onSelect(Math.min(keys.length - 1, selectedIndex + 1));
-  }, { isActive: isRawModeSupported && interactive });
-  const maxVisible = Math.max(3, maxRows - 3);
-  const { start, end, above, below } = scrollWindow(keys.length, selectedIndex, maxVisible);
-  const visibleKeys = keys.slice(start, end);
-  const keyColWidth = Math.min(48, Math.max(16, ...keys.map((k) => k.key.length))) + 2;
-  const encBadge = file.encrypted ? /* @__PURE__ */ jsx2(Text2, { color: "yellow", children: " encrypted" }) : /* @__PURE__ */ jsx2(Text2, { dimColor: true, children: " plain" });
-  return /* @__PURE__ */ jsxs2(Box2, { flexDirection: "column", flexGrow: 1, children: [
-    /* @__PURE__ */ jsxs2(Box2, { paddingX: 1, children: [
-      /* @__PURE__ */ jsx2(Text2, { bold: true, children: file.relativePath }),
-      encBadge,
-      /* @__PURE__ */ jsxs2(Text2, { dimColor: true, children: [
-        "  ",
-        keys.length,
-        " key",
-        keys.length === 1 ? "" : "s"
-      ] })
-    ] }),
-    keys.length === 0 ? /* @__PURE__ */ jsx2(Box2, { paddingX: 2, marginTop: 1, children: /* @__PURE__ */ jsxs2(Text2, { dimColor: true, children: [
-      "No keys found. Press ",
-      /* @__PURE__ */ jsx2(Text2, { bold: true, children: "a" }),
-      " to add one."
-    ] }) }) : /* @__PURE__ */ jsxs2(Fragment, { children: [
-      above > 0 && /* @__PURE__ */ jsx2(Box2, { paddingX: 1, children: /* @__PURE__ */ jsxs2(Text2, { dimColor: true, children: [
-        "\u2191 ",
-        above,
-        " more"
-      ] }) }),
-      visibleKeys.map((k, i) => {
-        const idx = start + i;
-        const selected = idx === selectedIndex;
-        const value = maskValue(k, revealed);
-        const lockIcon = k.encrypted && !revealed.has(k.key) ? " \u{1F512}" : "";
-        return /* @__PURE__ */ jsx2(Box2, { paddingX: 1, children: /* @__PURE__ */ jsxs2(
-          Text2,
-          {
-            backgroundColor: selected && focused ? "blue" : void 0,
-            color: selected && focused ? "white" : selected ? "cyan" : void 0,
-            children: [
-              k.key.padEnd(keyColWidth),
-              /* @__PURE__ */ jsx2(Text2, { dimColor: !selected, children: value }),
-              lockIcon
-            ]
-          }
-        ) }, k.key);
-      }),
-      below > 0 && /* @__PURE__ */ jsx2(Box2, { paddingX: 1, children: /* @__PURE__ */ jsxs2(Text2, { dimColor: true, children: [
-        "\u2193 ",
-        below,
-        " more"
-      ] }) })
-    ] })
-  ] });
-}
-
-// src/tui/StatusBar.tsx
-import { Box as Box3, Text as Text3 } from "ink";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-var FILE_HINTS = [
-  { key: "\u2191\u2193", action: "navigate" },
-  { key: "tab", action: "switch panel" },
-  { key: "?", action: "help" },
-  { key: "q", action: "quit" }
-];
-var KEY_HINTS = [
-  { key: "\u2191\u2193", action: "navigate" },
-  { key: "tab", action: "switch" },
-  { key: "enter", action: "edit" },
-  { key: "y", action: "copy" },
-  { key: "r", action: "reveal" },
-  { key: "a", action: "add" },
-  { key: "D", action: "delete" },
-  { key: "d", action: "diff" },
-  { key: "?", action: "help" },
-  { key: "q", action: "quit" }
-];
-function Hints({ hints }) {
-  return /* @__PURE__ */ jsx3(Box3, { gap: 2, children: hints.map(({ key, action }) => /* @__PURE__ */ jsxs3(Box3, { gap: 1, children: [
-    /* @__PURE__ */ jsx3(Text3, { bold: true, color: "cyan", children: key }),
-    /* @__PURE__ */ jsx3(Text3, { dimColor: true, children: action })
-  ] }, key)) });
-}
-function StatusBar({ message, focus }) {
-  return /* @__PURE__ */ jsx3(Box3, { borderStyle: "single", borderTop: true, borderBottom: false, borderLeft: false, borderRight: false, paddingX: 1, children: message ? /* @__PURE__ */ jsx3(Text3, { children: message }) : /* @__PURE__ */ jsx3(Hints, { hints: focus === "files" ? FILE_HINTS : KEY_HINTS }) });
-}
-
 // src/tui/DiffView.tsx
-import { useEffect as useEffect2, useMemo, useRef, useState as useState2 } from "react";
-import { Box as Box4, Text as Text4, useInput as useInput3, useStdin as useStdin3 } from "ink";
-
-// src/core/parser/io.ts
-import { readFileSync as readFileSync2, writeFileSync, renameSync } from "fs";
-import { join as join2, dirname as dirname2 } from "path";
-import { randomBytes } from "crypto";
-
-// src/core/parser/values.ts
-function isEncryptedValue(value) {
-  return value.startsWith("encrypted:");
-}
-function parseValue(rawValue, allLines, nextLineIdx) {
-  const trimmed = rawValue.trim();
-  if (trimmed.startsWith('"')) {
-    const inner = trimmed.slice(1);
-    const closeIdx = findClosingQuote(inner);
-    if (closeIdx !== -1) {
-      return { value: unescape(inner.slice(0, closeIdx)), extraLines: [] };
-    }
-    const valueLines = [inner];
-    let idx = nextLineIdx;
-    while (idx < allLines.length) {
-      const continuation = allLines[idx];
-      const close = findClosingQuote(continuation);
-      if (close !== -1) {
-        valueLines.push(continuation.slice(0, close));
-        return {
-          value: valueLines.join("\n"),
-          extraLines: allLines.slice(nextLineIdx, idx + 1)
-        };
-      }
-      valueLines.push(continuation);
-      idx++;
-    }
-    return { value: valueLines.join("\n"), extraLines: allLines.slice(nextLineIdx, idx) };
-  }
-  if (trimmed.startsWith("'")) {
-    const inner = trimmed.slice(1);
-    const closeIdx = inner.indexOf("'");
-    return {
-      value: closeIdx !== -1 ? inner.slice(0, closeIdx) : inner,
-      extraLines: []
-    };
-  }
-  const commentIdx = trimmed.indexOf(" #");
-  const bare = commentIdx !== -1 ? trimmed.slice(0, commentIdx) : trimmed;
-  return { value: bare, extraLines: [] };
-}
-function serializeKeyValue(key, value) {
-  if (value.includes("\n")) {
-    const escaped = value.replace(/\\/g, "\\\\").replace(/"/g, '\\"').replace(/\n/g, "\\n").replace(/\t/g, "\\t").replace(/\r/g, "\\r");
-    return `${key}="${escaped}"`;
-  }
-  if (value === "" || /[\s#"'`]/.test(value)) {
-    return `${key}="${value.replace(/\\/g, "\\\\").replace(/"/g, '\\"')}"`;
-  }
-  return `${key}=${value}`;
-}
-function findClosingQuote(s) {
-  for (let i = 0; i < s.length; i++) {
-    if (s[i] === "\\") {
-      i++;
-      continue;
-    }
-    if (s[i] === '"') return i;
-  }
-  return -1;
-}
-function unescape(s) {
-  return s.replace(/\\n/g, "\n").replace(/\\t/g, "	").replace(/\\r/g, "\r").replace(/\\\\/g, "\\").replace(/\\"/g, '"');
-}
-
-// src/core/parser/io.ts
-function readEnvFile(filePath) {
-  const content = readFileSync2(filePath, "utf8");
-  return parse(content).filter((e) => e.type === "key").map((e) => ({
-    key: e.key,
-    value: e.value,
-    encrypted: isEncryptedValue(e.value),
-    comment: extractLeadingComment(e.lines)
-  }));
-}
-function writeEnvFile(filePath, keys) {
-  const content = readFileSync2(filePath, "utf8");
-  const entries = parse(content);
-  const updates = new Map(keys.map((k) => [k.key, k]));
-  const outLines = [];
-  const written = /* @__PURE__ */ new Set();
-  for (const entry of entries) {
-    if (entry.type === "raw") {
-      outLines.push(entry.text);
-      continue;
-    }
-    const update = updates.get(entry.key);
-    if (!update) continue;
-    written.add(entry.key);
-    const leadingComments = getLeadingCommentLines(entry.lines);
-    outLines.push(...leadingComments);
-    if (update.value === entry.value) {
-      const keyLines = entry.lines.filter((l) => !l.trimStart().startsWith("#"));
-      outLines.push(...keyLines);
-    } else {
-      outLines.push(serializeKeyValue(entry.key, update.value));
-    }
-  }
-  for (const k of keys) {
-    if (!written.has(k.key)) {
-      if (k.comment) outLines.push(`# ${k.comment}`);
-      outLines.push(serializeKeyValue(k.key, k.value));
-    }
-  }
-  const output = outLines.join("\n") + (content.endsWith("\n") ? "\n" : "");
-  atomicWrite(filePath, output);
-}
-function addKey(filePath, key, value) {
-  const keys = readEnvFile(filePath);
-  if (keys.some((k) => k.key === key)) {
-    throw new Error(`Key "${key}" already exists in ${filePath}`);
-  }
-  keys.push({ key, value, encrypted: isEncryptedValue(value) });
-  writeEnvFile(filePath, keys);
-}
-function updateKey(filePath, key, value) {
-  const keys = readEnvFile(filePath);
-  const idx = keys.findIndex((k) => k.key === key);
-  if (idx === -1) throw new Error(`Key "${key}" not found in ${filePath}`);
-  keys[idx] = { ...keys[idx], key, value, encrypted: isEncryptedValue(value) };
-  writeEnvFile(filePath, keys);
-}
-function removeKey(filePath, key) {
-  const keys = readEnvFile(filePath).filter((k) => k.key !== key);
-  writeEnvFile(filePath, keys);
-}
-function parse(content) {
-  const entries = [];
-  const lines = content.split("\n");
-  if (lines[lines.length - 1] === "") lines.pop();
-  let i = 0;
-  let pendingComments = [];
-  while (i < lines.length) {
-    const line = lines[i];
-    if (line.trim() === "") {
-      for (const c of pendingComments) entries.push({ type: "raw", text: c });
-      pendingComments = [];
-      entries.push({ type: "raw", text: line });
-      i++;
-      continue;
-    }
-    if (line.trimStart().startsWith("#")) {
-      pendingComments.push(line);
-      i++;
-      continue;
-    }
-    const eqIdx = line.indexOf("=");
-    if (eqIdx === -1) {
-      for (const c of pendingComments) entries.push({ type: "raw", text: c });
-      pendingComments = [];
-      entries.push({ type: "raw", text: line });
-      i++;
-      continue;
-    }
-    const key = line.slice(0, eqIdx).trim();
-    const rawValue = line.slice(eqIdx + 1);
-    const { value, extraLines } = parseValue(rawValue, lines, i + 1);
-    entries.push({ type: "key", key, value, lines: [...pendingComments, line, ...extraLines] });
-    pendingComments = [];
-    i += 1 + extraLines.length;
-  }
-  for (const c of pendingComments) entries.push({ type: "raw", text: c });
-  return entries;
-}
-function getLeadingCommentLines(lines) {
-  const result = [];
-  for (const l of lines) {
-    if (l.trimStart().startsWith("#")) result.push(l);
-    else break;
-  }
-  return result;
-}
-function extractLeadingComment(lines) {
-  const comments = getLeadingCommentLines(lines).map(
-    (l) => l.trimStart().slice(1).trim()
-  );
-  return comments.length > 0 ? comments.join("\n") : void 0;
-}
-function atomicWrite(filePath, content) {
-  const tmp = join2(
-    dirname2(filePath),
-    `.dotenvx-ui-tmp-${randomBytes(6).toString("hex")}`
-  );
-  try {
-    writeFileSync(tmp, content, { encoding: "utf8", flag: "wx" });
-    renameSync(tmp, filePath);
-  } catch (err) {
-    try {
-      writeFileSync(tmp, "");
-    } catch {
-    }
-    throw new Error(`Failed to write ${filePath}: ${err.message}`);
-  }
-}
-
-// src/core/dotenvx.ts
-import { createRequire } from "module";
-import { existsSync, readFileSync as readFileSync3 } from "fs";
-import { join as join3, dirname as dirname3 } from "path";
-var dotenvx = createRequire(import.meta.url)("@dotenvx/dotenvx");
-function decryptValue(encryptedValue, envFilePath) {
-  if (!isEncryptedValue(encryptedValue)) return encryptedValue;
-  const keyName = findKeyForValue(encryptedValue, envFilePath);
-  if (!keyName) return null;
-  const keysFile = findKeysFile(envFilePath);
-  return silenced(() => {
-    const result = dotenvx.get(keyName, {
-      path: envFilePath,
-      ...keysFile ? { envKeysFile: keysFile } : {},
-      logLevel: "error"
-    });
-    return result ?? null;
-  });
-}
-function decryptAllValues(envFilePath) {
-  let raw;
-  try {
-    raw = readFileSync3(envFilePath, "utf8");
-  } catch {
-    return {};
-  }
-  let privateKey = process.env["DOTENV_PRIVATE_KEY"] ?? null;
-  if (!privateKey) {
-    const keysFile = findKeysFile(envFilePath);
-    if (keysFile) {
-      try {
-        const keypairs = dotenvx.keypair(envFilePath, void 0, keysFile);
-        for (const [name, value] of Object.entries(keypairs)) {
-          if (name.startsWith("DOTENV_PRIVATE_KEY") && value) {
-            privateKey = value;
-            break;
-          }
-        }
-      } catch {
-      }
-    }
-  }
-  return silenced(() => {
-    try {
-      return dotenvx.parse(raw, {
-        ...privateKey ? { privateKey } : {},
-        processEnv: {}
-      });
-    } catch {
-      return {};
-    }
-  });
-}
-var DOTENVX_INTERNAL_KEYS = /* @__PURE__ */ new Set(["DOTENV_PUBLIC_KEY", "DOTENV_PRIVATE_KEY"]);
-function encryptFile(envFilePath) {
-  const keys = readEnvFile(envFilePath);
-  for (const k of keys) {
-    if (!isEncryptedValue(k.value) && !DOTENVX_INTERNAL_KEYS.has(k.key)) {
-      dotenvx.set(k.key, k.value, {
-        path: envFilePath,
-        encrypt: true,
-        logLevel: "error"
-      });
-    }
-  }
-}
-function encryptKey(envFilePath, keyName, plainValue) {
-  dotenvx.set(keyName, plainValue, {
-    path: envFilePath,
-    encrypt: true,
-    logLevel: "error"
-  });
-}
-function decryptFile(envFilePath) {
-  const keys = readEnvFile(envFilePath);
-  const decrypted = decryptAllValues(envFilePath);
-  for (const k of keys) {
-    if (isEncryptedValue(k.value)) {
-      const plain = decrypted[k.key];
-      if (plain !== void 0 && !isEncryptedValue(plain)) updateKey(envFilePath, k.key, plain);
-    }
-  }
-}
-function silenced(fn) {
-  const origWrite = process.stderr.write.bind(process.stderr);
-  const origOut = process.stdout.write.bind(process.stdout);
-  const mute = (chunk) => {
-    const s = String(chunk);
-    if (s.includes("[MISSING_PRIVATE_KEY]") || s.includes("could not decrypt") || s.includes("\u2620")) return true;
-    return false;
-  };
-  process.stderr.write = ((chunk, ...args) => mute(chunk) ? true : origWrite(chunk, ...args));
-  process.stdout.write = ((chunk, ...args) => mute(chunk) ? true : origOut(chunk, ...args));
-  try {
-    return fn();
-  } finally {
-    process.stderr.write = origWrite;
-    process.stdout.write = origOut;
-  }
-}
-function findKeysFile(envFilePath) {
-  let dir = dirname3(envFilePath);
-  while (true) {
-    const candidate = join3(dir, ".env.keys");
-    if (existsSync(candidate)) return candidate;
-    const parent = dirname3(dir);
-    if (parent === dir) break;
-    dir = parent;
-  }
-  return null;
-}
-function findKeyForValue(encryptedValue, envFilePath) {
-  let raw;
-  try {
-    raw = readFileSync3(envFilePath, "utf8");
-  } catch {
-    return null;
-  }
-  for (const line of raw.split("\n")) {
-    const eqIdx = line.indexOf("=");
-    if (eqIdx === -1) continue;
-    const lineValue = line.slice(eqIdx + 1).trim();
-    if (lineValue === encryptedValue) return line.slice(0, eqIdx).trim();
-  }
-  return null;
-}
-
-// src/tui/DiffView.tsx
-import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 var COL_VAL = 26;
 var PICKER_MAX = 5;
 function buildDisplayMap(keys, filePath) {
@@ -618,7 +76,10 @@ function buildDisplayMap(keys, filePath) {
   for (const k of keys) {
     if (k.encrypted) {
       const plain = decrypted[k.key];
-      out.set(k.key, plain !== void 0 && !isEncryptedValue(plain) ? plain : "\u{1F512}");
+      out.set(
+        k.key,
+        plain !== void 0 && !isEncryptedValue(plain) ? plain : "\u{1F512}"
+      );
     } else {
       out.set(k.key, k.value);
     }
@@ -645,7 +106,7 @@ function buildRows(leftMap, rightMap) {
 }
 function trunc(s, max) {
   const first = s.split("\n")[0];
-  return first.length > max ? first.slice(0, max - 1) + "\u2026" : first;
+  return first.length > max ? `${first.slice(0, max - 1)}\u2026` : first;
 }
 function safeRead(file) {
   try {
@@ -655,40 +116,43 @@ function safeRead(file) {
   }
 }
 function DiffView({ left, files, onClose }) {
-  const { isRawModeSupported } = useStdin3();
+  const { isRawModeSupported } = useStdin();
   const termRows = useTerminalRows();
   const others = files.filter((f) => f.path !== left.path);
   const [pickerIndex, setPickerIndex] = useState2(0);
   const [rowScroll, setRowScroll] = useState2(0);
   const rightFile = others[pickerIndex] ?? null;
   const mapsCache = useRef(/* @__PURE__ */ new Map());
-  const [cacheVersion, setCacheVersion] = useState2(0);
+  const [_cacheVersion, setCacheVersion] = useState2(0);
   function getMap(file) {
     return mapsCache.current.get(file.path) ?? null;
   }
   function buildAndCache(file) {
     if (!mapsCache.current.has(file.path)) {
-      mapsCache.current.set(file.path, buildDisplayMap(safeRead(file), file.path));
+      mapsCache.current.set(
+        file.path,
+        buildDisplayMap(safeRead(file), file.path)
+      );
       setCacheVersion((v) => v + 1);
     }
   }
   useEffect2(() => {
     buildAndCache(left);
     if (others[0]) buildAndCache(others[0]);
-  }, []);
+  }, [left, others[0], buildAndCache]);
   useEffect2(() => {
     const next = others[pickerIndex + 1];
     const prev = others[pickerIndex - 1];
     if (next) buildAndCache(next);
     if (prev) buildAndCache(prev);
-  }, [pickerIndex]);
+  }, [pickerIndex, others, buildAndCache]);
   const rows = useMemo(() => {
     if (!rightFile) return [];
     const leftMap = getMap(left);
     const rightMap = getMap(rightFile);
     if (!leftMap || !rightMap) return [];
     return buildRows(leftMap, rightMap);
-  }, [left.path, rightFile?.path, cacheVersion]);
+  }, [left.path, rightFile?.path, getMap, left, rightFile]);
   const pickerVisible = Math.min(others.length, PICKER_MAX);
   const picker = scrollWindow(others.length, pickerIndex, PICKER_MAX);
   const chrome = 9 + pickerVisible + (picker.above > 0 || picker.below > 0 ? 2 : 0);
@@ -698,40 +162,47 @@ function DiffView({ left, files, onClose }) {
   const visibleRows = rows.slice(scroll, scroll + maxRows);
   const rowsAbove = scroll;
   const rowsBelow = rows.length - (scroll + visibleRows.length);
-  useInput3((input, key) => {
-    if (key.escape || input === "q") {
-      onClose();
-      return;
-    }
-    if (key.upArrow) {
-      setPickerIndex((i) => Math.max(0, i - 1));
-      setRowScroll(0);
-      return;
-    }
-    if (key.downArrow) {
-      setPickerIndex((i) => Math.min(others.length - 1, i + 1));
-      setRowScroll(0);
-      return;
-    }
-    if (input === "k") setRowScroll(Math.max(0, scroll - 1));
-    if (input === "j") setRowScroll(Math.min(maxScroll, scroll + 1));
-    if (key.pageUp) setRowScroll(Math.max(0, scroll - maxRows));
-    if (key.pageDown) setRowScroll(Math.min(maxScroll, scroll + maxRows));
-  }, { isActive: isRawModeSupported });
+  useInput(
+    (input, key) => {
+      if (key.escape || input === "q") {
+        onClose();
+        return;
+      }
+      if (key.upArrow) {
+        setPickerIndex((i) => Math.max(0, i - 1));
+        setRowScroll(0);
+        return;
+      }
+      if (key.downArrow) {
+        setPickerIndex((i) => Math.min(others.length - 1, i + 1));
+        setRowScroll(0);
+        return;
+      }
+      if (input === "k") setRowScroll(Math.max(0, scroll - 1));
+      if (input === "j") setRowScroll(Math.min(maxScroll, scroll + 1));
+      if (key.pageUp) setRowScroll(Math.max(0, scroll - maxRows));
+      if (key.pageDown) setRowScroll(Math.min(maxScroll, scroll + maxRows));
+    },
+    { isActive: isRawModeSupported }
+  );
+  const keyColWidth = Math.min(48, Math.max(16, ...rows.map((r) => r.key.length))) + 2;
   const leftName = trunc(left.relativePath, COL_VAL);
   const rightName = rightFile ? trunc(rightFile.relativePath, COL_VAL) : "\u2014";
-  return /* @__PURE__ */ jsxs4(Box4, { flexDirection: "column", children: [
-    /* @__PURE__ */ jsxs4(Box4, { paddingX: 1, children: [
-      /* @__PURE__ */ jsx4(Text4, { bold: true, color: "cyan", children: "dotenvx-ui  " }),
-      /* @__PURE__ */ jsxs4(Text4, { dimColor: true, children: [
-        "diff  ",
+  return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", children: [
+    /* @__PURE__ */ jsxs(Box, { paddingX: 1, children: [
+      /* @__PURE__ */ jsxs(Text, { bold: true, color: "cyan", children: [
+        "dotenvx-ui",
+        " "
+      ] }),
+      /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+        "diff ",
         left.relativePath,
-        "  \u2194  ",
+        " \u2194 ",
         rightFile?.relativePath ?? "\u2014"
       ] })
     ] }),
-    /* @__PURE__ */ jsxs4(
-      Box4,
+    /* @__PURE__ */ jsxs(
+      Box,
       {
         flexDirection: "column",
         paddingX: 1,
@@ -741,16 +212,16 @@ function DiffView({ left, files, onClose }) {
         borderLeft: false,
         borderRight: false,
         children: [
-          /* @__PURE__ */ jsx4(Text4, { bold: true, dimColor: true, children: "compare with" }),
-          picker.above > 0 && /* @__PURE__ */ jsxs4(Text4, { dimColor: true, children: [
-            "  \u2191 ",
+          /* @__PURE__ */ jsx(Text, { bold: true, dimColor: true, children: "compare with" }),
+          picker.above > 0 && /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+            " \u2191 ",
             picker.above,
             " more"
           ] }),
           others.slice(picker.start, picker.end).map((f, i) => {
             const selected = picker.start + i === pickerIndex;
-            return /* @__PURE__ */ jsx4(Box4, { children: /* @__PURE__ */ jsxs4(
-              Text4,
+            return /* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(
+              Text,
               {
                 backgroundColor: selected ? "blue" : void 0,
                 color: selected ? "white" : void 0,
@@ -761,59 +232,136 @@ function DiffView({ left, files, onClose }) {
               }
             ) }, f.path);
           }),
-          picker.below > 0 && /* @__PURE__ */ jsxs4(Text4, { dimColor: true, children: [
-            "  \u2193 ",
+          picker.below > 0 && /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
+            " \u2193 ",
             picker.below,
             " more"
           ] }),
-          others.length === 0 && /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: "  no other files" })
+          others.length === 0 && /* @__PURE__ */ jsx(Text, { dimColor: true, children: " no other files" })
         ]
       }
     ),
-    /* @__PURE__ */ jsxs4(Box4, { flexDirection: "column", flexGrow: 1, paddingX: 1, children: [
-      /* @__PURE__ */ jsxs4(Box4, { borderStyle: "single", borderBottom: true, borderTop: false, borderLeft: false, borderRight: false, children: [
-        /* @__PURE__ */ jsx4(Text4, { bold: true, color: "cyan", children: "KEY".padEnd(22) }),
-        /* @__PURE__ */ jsxs4(Text4, { bold: true, children: [
-          "  ",
-          leftName.padEnd(COL_VAL + 2)
-        ] }),
-        /* @__PURE__ */ jsx4(Text4, { bold: true, children: rightName })
-      ] }),
-      rowsAbove > 0 && /* @__PURE__ */ jsxs4(Text4, { dimColor: true, children: [
+    /* @__PURE__ */ jsxs(Box, { flexDirection: "column", flexGrow: 1, paddingX: 1, children: [
+      /* @__PURE__ */ jsxs(
+        Box,
+        {
+          borderStyle: "single",
+          borderBottom: true,
+          borderTop: false,
+          borderLeft: false,
+          borderRight: false,
+          children: [
+            /* @__PURE__ */ jsx(Text, { bold: true, color: "cyan", children: "KEY".padEnd(keyColWidth) }),
+            /* @__PURE__ */ jsxs(Text, { bold: true, children: [
+              "  ",
+              leftName.padEnd(COL_VAL + 2)
+            ] }),
+            /* @__PURE__ */ jsx(Text, { bold: true, children: rightName })
+          ]
+        }
+      ),
+      rowsAbove > 0 && /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
         "\u2191 ",
         rowsAbove,
         " more"
       ] }),
-      visibleRows.map((row) => /* @__PURE__ */ jsx4(DiffRow, { row }, row.key)),
-      rowsBelow > 0 && /* @__PURE__ */ jsxs4(Text4, { dimColor: true, children: [
+      visibleRows.map((row) => /* @__PURE__ */ jsx(DiffRow, { row, keyColWidth }, row.key)),
+      rowsBelow > 0 && /* @__PURE__ */ jsxs(Text, { dimColor: true, children: [
         "\u2193 ",
         rowsBelow,
         " more"
       ] }),
-      rows.length === 0 && /* @__PURE__ */ jsx4(Box4, { marginTop: 1, children: /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: "Select a file to compare." }) })
+      rows.length === 0 && /* @__PURE__ */ jsx(Box, { marginTop: 1, children: /* @__PURE__ */ jsx(Text, { dimColor: true, children: "Select a file to compare." }) })
     ] }),
-    /* @__PURE__ */ jsxs4(Box4, { borderStyle: "single", borderTop: true, borderBottom: false, borderLeft: false, borderRight: false, paddingX: 1, children: [
-      /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: "\u2191\u2193 pick file  j/k scroll  esc close    " }),
-      /* @__PURE__ */ jsx4(Text4, { color: "green", children: "\u25CF same" })
-    ] })
+    /* @__PURE__ */ jsxs(
+      Box,
+      {
+        borderStyle: "single",
+        borderTop: true,
+        borderBottom: false,
+        borderLeft: false,
+        borderRight: false,
+        paddingX: 1,
+        children: [
+          /* @__PURE__ */ jsx(Text, { dimColor: true, children: "\u2191\u2193 pick file j/k scroll esc close " }),
+          /* @__PURE__ */ jsx(Text, { color: "green", children: "\u25CF same" })
+        ]
+      }
+    )
   ] });
 }
-function DiffRow({ row }) {
+function DiffRow({ row, keyColWidth }) {
   const { key, leftDisplay, rightDisplay, status } = row;
   const color = status === "same" ? "green" : void 0;
-  return /* @__PURE__ */ jsxs4(Box4, { children: [
-    /* @__PURE__ */ jsx4(Text4, { color, children: key.padEnd(22) }),
-    /* @__PURE__ */ jsxs4(Text4, { color, children: [
+  return /* @__PURE__ */ jsxs(Box, { children: [
+    /* @__PURE__ */ jsx(Text, { color, children: key.padEnd(keyColWidth) }),
+    /* @__PURE__ */ jsxs(Text, { color, children: [
       "  ",
       (leftDisplay || "\u2014").padEnd(COL_VAL + 2)
     ] }),
-    /* @__PURE__ */ jsx4(Text4, { color, children: rightDisplay || "\u2014" })
+    /* @__PURE__ */ jsx(Text, { color, children: rightDisplay || "\u2014" })
   ] });
 }
 
+// src/tui/FileList.tsx
+import { Box as Box2, Text as Text2, useInput as useInput2, useStdin as useStdin2 } from "ink";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function FileList({
+  files,
+  selectedIndex,
+  focused,
+  interactive,
+  onSelect
+}) {
+  const { isRawModeSupported } = useStdin2();
+  useInput2(
+    (_, key) => {
+      if (!focused) return;
+      if (key.upArrow) onSelect(Math.max(0, selectedIndex - 1));
+      if (key.downArrow)
+        onSelect(Math.min(files.length - 1, selectedIndex + 1));
+    },
+    { isActive: isRawModeSupported && interactive }
+  );
+  const byPkg = Map.groupBy(files, (f) => f.package);
+  return /* @__PURE__ */ jsx2(
+    Box2,
+    {
+      flexDirection: "column",
+      width: 24,
+      borderStyle: "single",
+      borderRight: true,
+      borderTop: false,
+      borderBottom: false,
+      borderLeft: false,
+      children: Array.from(byPkg.entries()).map(([pkg, pkgFiles]) => /* @__PURE__ */ jsxs2(Box2, { flexDirection: "column", children: [
+        /* @__PURE__ */ jsxs2(Text2, { bold: true, dimColor: true, children: [
+          " ",
+          pkg
+        ] }),
+        pkgFiles.map((f) => {
+          const idx = files.indexOf(f);
+          const selected = idx === selectedIndex;
+          return /* @__PURE__ */ jsx2(Box2, { paddingLeft: 2, children: /* @__PURE__ */ jsxs2(
+            Text2,
+            {
+              backgroundColor: selected && focused ? "blue" : void 0,
+              color: selected && focused ? "white" : selected ? "cyan" : void 0,
+              children: [
+                f.encrypted ? "\u{1F512} " : "   ",
+                f.environment
+              ]
+            }
+          ) }, f.path);
+        })
+      ] }, pkg))
+    }
+  );
+}
+
 // src/tui/HelpOverlay.tsx
-import { Box as Box5, Text as Text5, useInput as useInput4, useStdin as useStdin4 } from "ink";
-import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+import { Box as Box3, Text as Text3, useInput as useInput3, useStdin as useStdin3 } from "ink";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
 var SECTIONS = [
   {
     title: "Navigation",
@@ -851,30 +399,36 @@ var SECTIONS = [
 ];
 var KEY_WIDTH = 10;
 function HelpOverlay({ onClose }) {
-  const { isRawModeSupported } = useStdin4();
-  useInput4((input, key) => {
-    if (input === "?" || input === "q" || key.escape) onClose();
-  }, { isActive: isRawModeSupported });
-  return /* @__PURE__ */ jsxs5(Box5, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
-    /* @__PURE__ */ jsxs5(Box5, { marginBottom: 1, children: [
-      /* @__PURE__ */ jsx5(Text5, { bold: true, color: "cyan", children: "dotenvx-ui  " }),
-      /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: "keyboard shortcuts" })
+  const { isRawModeSupported } = useStdin3();
+  useInput3(
+    (input, key) => {
+      if (input === "?" || input === "q" || key.escape) onClose();
+    },
+    { isActive: isRawModeSupported }
+  );
+  return /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", paddingX: 2, paddingY: 1, children: [
+    /* @__PURE__ */ jsxs3(Box3, { marginBottom: 1, children: [
+      /* @__PURE__ */ jsxs3(Text3, { bold: true, color: "cyan", children: [
+        "dotenvx-ui",
+        " "
+      ] }),
+      /* @__PURE__ */ jsx3(Text3, { dimColor: true, children: "keyboard shortcuts" })
     ] }),
-    SECTIONS.map((section) => /* @__PURE__ */ jsxs5(Box5, { flexDirection: "column", marginBottom: 1, children: [
-      /* @__PURE__ */ jsx5(Text5, { bold: true, children: section.title }),
-      section.rows.map(([key, desc]) => /* @__PURE__ */ jsxs5(Box5, { children: [
-        /* @__PURE__ */ jsx5(Text5, { color: "cyan", children: key.padEnd(KEY_WIDTH) }),
-        /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: desc })
+    SECTIONS.map((section) => /* @__PURE__ */ jsxs3(Box3, { flexDirection: "column", marginBottom: 1, children: [
+      /* @__PURE__ */ jsx3(Text3, { bold: true, children: section.title }),
+      section.rows.map(([key, desc]) => /* @__PURE__ */ jsxs3(Box3, { children: [
+        /* @__PURE__ */ jsx3(Text3, { color: "cyan", children: key.padEnd(KEY_WIDTH) }),
+        /* @__PURE__ */ jsx3(Text3, { dimColor: true, children: desc })
       ] }, key))
     ] }, section.title)),
-    /* @__PURE__ */ jsx5(Box5, { marginTop: 1, children: /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: "? / q / esc  close help" }) })
+    /* @__PURE__ */ jsx3(Box3, { marginTop: 1, children: /* @__PURE__ */ jsx3(Text3, { dimColor: true, children: "? / q / esc close help" }) })
   ] });
 }
 
 // src/tui/InlineForm.tsx
-import { useState as useState3, useRef as useRef2 } from "react";
-import { Box as Box6, Text as Text6, useInput as useInput5, useStdin as useStdin5, useStdout as useStdout2 } from "ink";
-import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+import { Box as Box4, Text as Text4, useInput as useInput4, useStdin as useStdin4, useStdout as useStdout2 } from "ink";
+import { useRef as useRef2, useState as useState3 } from "react";
+import { jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
 function makeInitialState(value) {
   const lines = value.split("\n");
   return {
@@ -884,153 +438,332 @@ function makeInitialState(value) {
   };
 }
 var CHROME = 5;
-function InlineForm({ label, initialValue = "", onSubmit, onCancel }) {
-  const { isRawModeSupported } = useStdin5();
+function InlineForm({
+  label,
+  initialValue = "",
+  onSubmit,
+  onCancel
+}) {
+  const { isRawModeSupported } = useStdin4();
   const { stdout } = useStdout2();
-  const [editor, setEditor] = useState3(() => makeInitialState(initialValue));
+  const [editor, setEditor] = useState3(
+    () => makeInitialState(initialValue)
+  );
   const editorRef = useRef2(editor);
   editorRef.current = editor;
-  useInput5((input, key) => {
-    if (key.escape) {
-      onCancel();
-      return;
-    }
-    const { lines: lines2, row: row2, col: col2 } = editorRef.current;
-    const lineWidth = Math.max(1, (stdout?.columns ?? 80) - CHROME);
-    if (key.return) {
-      onSubmit(lines2.join("\n"));
-      return;
-    }
-    if (key.upArrow) {
-      const line = lines2[row2];
-      const visualRow = Math.floor(col2 / lineWidth);
-      if (visualRow > 0) {
-        const targetVisualRow = visualRow - 1;
-        const colInVisualRow = col2 % lineWidth;
-        const newCol = Math.min(targetVisualRow * lineWidth + colInVisualRow, line.length);
-        setEditor({ lines: lines2, row: row2, col: newCol });
-      } else if (row2 > 0) {
-        const prevLine = lines2[row2 - 1];
-        const prevVisualRows = Math.floor(prevLine.length / lineWidth);
-        const colInVisualRow = col2 % lineWidth;
-        const newCol = Math.min(prevVisualRows * lineWidth + colInVisualRow, prevLine.length);
-        setEditor({ lines: lines2, row: row2 - 1, col: newCol });
+  useInput4(
+    (input, key) => {
+      if (key.escape) {
+        onCancel();
+        return;
       }
-      return;
-    }
-    if (key.downArrow) {
-      const line = lines2[row2];
-      const visualRow = Math.floor(col2 / lineWidth);
-      const lastVisualRow = Math.floor(line.length / lineWidth);
-      if (visualRow < lastVisualRow) {
-        const colInVisualRow = col2 % lineWidth;
-        const newCol = Math.min((visualRow + 1) * lineWidth + colInVisualRow, line.length);
-        setEditor({ lines: lines2, row: row2, col: newCol });
-      } else if (row2 < lines2.length - 1) {
-        const colInVisualRow = col2 % lineWidth;
-        const newCol = Math.min(colInVisualRow, lines2[row2 + 1].length);
-        setEditor({ lines: lines2, row: row2 + 1, col: newCol });
+      const { lines: lines2, row: row2, col: col2 } = editorRef.current;
+      const lineWidth = Math.max(1, (stdout?.columns ?? 80) - CHROME);
+      if (key.return) {
+        onSubmit(lines2.join("\n"));
+        return;
       }
-      return;
-    }
-    if (key.leftArrow) {
-      if (col2 > 0) {
-        setEditor({ lines: lines2, row: row2, col: col2 - 1 });
-      } else if (row2 > 0) {
-        const newRow = row2 - 1;
-        setEditor({ lines: lines2, row: newRow, col: lines2[newRow].length });
+      if (key.upArrow) {
+        const line = lines2[row2];
+        const visualRow = Math.floor(col2 / lineWidth);
+        if (visualRow > 0) {
+          const targetVisualRow = visualRow - 1;
+          const colInVisualRow = col2 % lineWidth;
+          const newCol = Math.min(
+            targetVisualRow * lineWidth + colInVisualRow,
+            line.length
+          );
+          setEditor({ lines: lines2, row: row2, col: newCol });
+        } else if (row2 > 0) {
+          const prevLine = lines2[row2 - 1];
+          const prevVisualRows = Math.floor(prevLine.length / lineWidth);
+          const colInVisualRow = col2 % lineWidth;
+          const newCol = Math.min(
+            prevVisualRows * lineWidth + colInVisualRow,
+            prevLine.length
+          );
+          setEditor({ lines: lines2, row: row2 - 1, col: newCol });
+        }
+        return;
       }
-      return;
-    }
-    if (key.rightArrow) {
-      if (col2 < lines2[row2].length) {
-        setEditor({ lines: lines2, row: row2, col: col2 + 1 });
-      } else if (row2 < lines2.length - 1) {
-        setEditor({ lines: lines2, row: row2 + 1, col: 0 });
+      if (key.downArrow) {
+        const line = lines2[row2];
+        const visualRow = Math.floor(col2 / lineWidth);
+        const lastVisualRow = Math.floor(line.length / lineWidth);
+        if (visualRow < lastVisualRow) {
+          const colInVisualRow = col2 % lineWidth;
+          const newCol = Math.min(
+            (visualRow + 1) * lineWidth + colInVisualRow,
+            line.length
+          );
+          setEditor({ lines: lines2, row: row2, col: newCol });
+        } else if (row2 < lines2.length - 1) {
+          const colInVisualRow = col2 % lineWidth;
+          const newCol = Math.min(colInVisualRow, lines2[row2 + 1].length);
+          setEditor({ lines: lines2, row: row2 + 1, col: newCol });
+        }
+        return;
       }
-      return;
-    }
-    if (key.ctrl && input === "a" || key.home) {
-      setEditor({ lines: lines2, row: row2, col: 0 });
-      return;
-    }
-    if (key.ctrl && input === "e" || key.end) {
-      setEditor({ lines: lines2, row: row2, col: lines2[row2].length });
-      return;
-    }
-    if (key.ctrl && input === "k") {
-      const newLines = lines2.map((l, i) => i === row2 ? l.slice(0, col2) : l);
-      setEditor({ lines: newLines, row: row2, col: col2 });
-      return;
-    }
-    if (key.ctrl && input === "u") {
-      const newLines = lines2.map((l, i) => i === row2 ? l.slice(col2) : l);
-      setEditor({ lines: newLines, row: row2, col: 0 });
-      return;
-    }
-    if (key.backspace) {
-      if (col2 > 0) {
-        const cur = lines2[row2];
-        const newLines = lines2.map((l, i) => i === row2 ? cur.slice(0, col2 - 1) + cur.slice(col2) : l);
-        setEditor({ lines: newLines, row: row2, col: col2 - 1 });
-      } else if (row2 > 0) {
-        const prevLen = lines2[row2 - 1].length;
-        const merged = lines2[row2 - 1] + lines2[row2];
-        const newLines = [...lines2.slice(0, row2 - 1), merged, ...lines2.slice(row2 + 1)];
-        setEditor({ lines: newLines, row: row2 - 1, col: prevLen });
+      if (key.leftArrow) {
+        if (col2 > 0) {
+          setEditor({ lines: lines2, row: row2, col: col2 - 1 });
+        } else if (row2 > 0) {
+          const newRow = row2 - 1;
+          setEditor({ lines: lines2, row: newRow, col: lines2[newRow].length });
+        }
+        return;
       }
-      return;
-    }
-    if (key.delete) {
-      const cur = lines2[row2];
-      if (col2 < cur.length) {
-        const newLines = lines2.map((l, i) => i === row2 ? cur.slice(0, col2) + cur.slice(col2 + 1) : l);
-        setEditor({ lines: newLines, row: row2, col: col2 });
-      } else if (row2 < lines2.length - 1) {
-        const merged = cur + lines2[row2 + 1];
-        const newLines = [...lines2.slice(0, row2), merged, ...lines2.slice(row2 + 2)];
+      if (key.rightArrow) {
+        if (col2 < lines2[row2].length) {
+          setEditor({ lines: lines2, row: row2, col: col2 + 1 });
+        } else if (row2 < lines2.length - 1) {
+          setEditor({ lines: lines2, row: row2 + 1, col: 0 });
+        }
+        return;
+      }
+      if (key.ctrl && input === "a" || key.home) {
+        setEditor({ lines: lines2, row: row2, col: 0 });
+        return;
+      }
+      if (key.ctrl && input === "e" || key.end) {
+        setEditor({ lines: lines2, row: row2, col: lines2[row2].length });
+        return;
+      }
+      if (key.ctrl && input === "k") {
+        const newLines = lines2.map((l, i) => i === row2 ? l.slice(0, col2) : l);
         setEditor({ lines: newLines, row: row2, col: col2 });
+        return;
       }
-      return;
-    }
-    if (input && !key.ctrl && !key.meta) {
-      const cur = lines2[row2];
-      const newLines = lines2.map((l, i) => i === row2 ? cur.slice(0, col2) + input + cur.slice(col2) : l);
-      setEditor({ lines: newLines, row: row2, col: col2 + input.length });
-    }
-  }, { isActive: isRawModeSupported });
+      if (key.ctrl && input === "u") {
+        const newLines = lines2.map((l, i) => i === row2 ? l.slice(col2) : l);
+        setEditor({ lines: newLines, row: row2, col: 0 });
+        return;
+      }
+      if (key.backspace) {
+        if (col2 > 0) {
+          const cur = lines2[row2];
+          const newLines = lines2.map(
+            (l, i) => i === row2 ? cur.slice(0, col2 - 1) + cur.slice(col2) : l
+          );
+          setEditor({ lines: newLines, row: row2, col: col2 - 1 });
+        } else if (row2 > 0) {
+          const prevLen = lines2[row2 - 1].length;
+          const merged = lines2[row2 - 1] + lines2[row2];
+          const newLines = [
+            ...lines2.slice(0, row2 - 1),
+            merged,
+            ...lines2.slice(row2 + 1)
+          ];
+          setEditor({ lines: newLines, row: row2 - 1, col: prevLen });
+        }
+        return;
+      }
+      if (key.delete) {
+        const cur = lines2[row2];
+        if (col2 < cur.length) {
+          const newLines = lines2.map(
+            (l, i) => i === row2 ? cur.slice(0, col2) + cur.slice(col2 + 1) : l
+          );
+          setEditor({ lines: newLines, row: row2, col: col2 });
+        } else if (row2 < lines2.length - 1) {
+          const merged = cur + lines2[row2 + 1];
+          const newLines = [
+            ...lines2.slice(0, row2),
+            merged,
+            ...lines2.slice(row2 + 2)
+          ];
+          setEditor({ lines: newLines, row: row2, col: col2 });
+        }
+        return;
+      }
+      if (input && !key.ctrl && !key.meta) {
+        const cur = lines2[row2];
+        const newLines = lines2.map(
+          (l, i) => i === row2 ? cur.slice(0, col2) + input + cur.slice(col2) : l
+        );
+        setEditor({ lines: newLines, row: row2, col: col2 + input.length });
+      }
+    },
+    { isActive: isRawModeSupported }
+  );
   const { lines, row, col } = editor;
-  return /* @__PURE__ */ jsxs6(Box6, { flexDirection: "column", borderStyle: "single", borderTop: true, borderBottom: false, borderLeft: false, borderRight: false, paddingX: 1, paddingTop: 0, children: [
-    /* @__PURE__ */ jsxs6(Box6, { children: [
-      /* @__PURE__ */ jsxs6(Text6, { bold: true, color: "cyan", children: [
-        label,
-        " "
-      ] }),
-      /* @__PURE__ */ jsx6(Text6, { dimColor: true, children: "\u21B5 confirm  esc cancel" })
+  return /* @__PURE__ */ jsxs4(
+    Box4,
+    {
+      flexDirection: "column",
+      borderStyle: "single",
+      borderTop: true,
+      borderBottom: false,
+      borderLeft: false,
+      borderRight: false,
+      paddingX: 1,
+      paddingTop: 0,
+      children: [
+        /* @__PURE__ */ jsxs4(Box4, { children: [
+          /* @__PURE__ */ jsxs4(Text4, { bold: true, color: "cyan", children: [
+            label,
+            " "
+          ] }),
+          /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: "\u21B5 confirm esc cancel" })
+        ] }),
+        lines.map((line, r) => {
+          const isActive = r === row;
+          if (!isActive) {
+            return /* @__PURE__ */ jsxs4(Box4, { children: [
+              /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: " " }),
+              /* @__PURE__ */ jsx4(Text4, { children: line || " " })
+            ] }, r);
+          }
+          const before = line.slice(0, col);
+          const cursor = line[col] ?? " ";
+          const after = line.slice(col + 1);
+          return /* @__PURE__ */ jsxs4(Box4, { children: [
+            /* @__PURE__ */ jsx4(Text4, { dimColor: true, children: " " }),
+            /* @__PURE__ */ jsxs4(Text4, { children: [
+              before,
+              /* @__PURE__ */ jsx4(Text4, { inverse: true, children: cursor }),
+              after
+            ] })
+          ] }, r);
+        })
+      ]
+    }
+  );
+}
+
+// src/tui/KeyTable.tsx
+import { Box as Box5, Text as Text5, useInput as useInput5, useStdin as useStdin5 } from "ink";
+import { Fragment, jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
+var SECRET_PATTERN = /secret|password|token|key|private|api_?key/i;
+var MAX_INLINE = 48;
+function truncate(s) {
+  const first = s.split("\n")[0];
+  return first.length > MAX_INLINE ? `${first.slice(0, MAX_INLINE - 1)}\u2026` : first;
+}
+function maskValue(k, revealed) {
+  if (revealed.has(k.key)) return truncate(revealed.get(k.key));
+  if (k.encrypted) return "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022";
+  if (SECRET_PATTERN.test(k.key)) return "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022";
+  return truncate(k.value);
+}
+function KeyTable({
+  file,
+  keys,
+  selectedIndex,
+  focused,
+  interactive,
+  revealed,
+  onSelect,
+  maxRows
+}) {
+  const { isRawModeSupported } = useStdin5();
+  useInput5(
+    (_, key) => {
+      if (!focused) return;
+      if (key.upArrow) onSelect(Math.max(0, selectedIndex - 1));
+      if (key.downArrow) onSelect(Math.min(keys.length - 1, selectedIndex + 1));
+    },
+    { isActive: isRawModeSupported && interactive }
+  );
+  const maxVisible = Math.max(3, maxRows - 3);
+  const { start, end, above, below } = scrollWindow(
+    keys.length,
+    selectedIndex,
+    maxVisible
+  );
+  const visibleKeys = keys.slice(start, end);
+  const keyColWidth = Math.min(48, Math.max(16, ...keys.map((k) => k.key.length))) + 2;
+  const encBadge = file.encrypted ? /* @__PURE__ */ jsx5(Text5, { color: "yellow", children: " encrypted" }) : /* @__PURE__ */ jsx5(Text5, { dimColor: true, children: " plain" });
+  return /* @__PURE__ */ jsxs5(Box5, { flexDirection: "column", flexGrow: 1, children: [
+    /* @__PURE__ */ jsxs5(Box5, { paddingX: 1, children: [
+      /* @__PURE__ */ jsx5(Text5, { bold: true, children: file.relativePath }),
+      encBadge,
+      /* @__PURE__ */ jsxs5(Text5, { dimColor: true, children: [
+        " ",
+        keys.length,
+        " key",
+        keys.length === 1 ? "" : "s"
+      ] })
     ] }),
-    lines.map((line, r) => {
-      const isActive = r === row;
-      if (!isActive) {
-        return /* @__PURE__ */ jsxs6(Box6, { children: [
-          /* @__PURE__ */ jsx6(Text6, { dimColor: true, children: " " }),
-          /* @__PURE__ */ jsx6(Text6, { children: line || " " })
-        ] }, r);
-      }
-      const before = line.slice(0, col);
-      const cursor = line[col] ?? " ";
-      const after = line.slice(col + 1);
-      return /* @__PURE__ */ jsxs6(Box6, { children: [
-        /* @__PURE__ */ jsx6(Text6, { dimColor: true, children: " " }),
-        /* @__PURE__ */ jsxs6(Text6, { children: [
-          before,
-          /* @__PURE__ */ jsx6(Text6, { inverse: true, children: cursor }),
-          after
-        ] })
-      ] }, r);
-    })
+    keys.length === 0 ? /* @__PURE__ */ jsx5(Box5, { paddingX: 2, marginTop: 1, children: /* @__PURE__ */ jsxs5(Text5, { dimColor: true, children: [
+      "No keys found. Press ",
+      /* @__PURE__ */ jsx5(Text5, { bold: true, children: "a" }),
+      " to add one."
+    ] }) }) : /* @__PURE__ */ jsxs5(Fragment, { children: [
+      above > 0 && /* @__PURE__ */ jsx5(Box5, { paddingX: 1, children: /* @__PURE__ */ jsxs5(Text5, { dimColor: true, children: [
+        "\u2191 ",
+        above,
+        " more"
+      ] }) }),
+      visibleKeys.map((k, i) => {
+        const idx = start + i;
+        const selected = idx === selectedIndex;
+        const value = maskValue(k, revealed);
+        const lockIcon = k.encrypted && !revealed.has(k.key) ? " \u{1F512}" : "";
+        return /* @__PURE__ */ jsx5(Box5, { paddingX: 1, children: /* @__PURE__ */ jsxs5(
+          Text5,
+          {
+            backgroundColor: selected && focused ? "blue" : void 0,
+            color: selected && focused ? "white" : selected ? "cyan" : void 0,
+            children: [
+              k.key.padEnd(keyColWidth),
+              /* @__PURE__ */ jsx5(Text5, { dimColor: !selected, children: value }),
+              lockIcon
+            ]
+          }
+        ) }, k.key);
+      }),
+      below > 0 && /* @__PURE__ */ jsx5(Box5, { paddingX: 1, children: /* @__PURE__ */ jsxs5(Text5, { dimColor: true, children: [
+        "\u2193 ",
+        below,
+        " more"
+      ] }) })
+    ] })
   ] });
 }
 
+// src/tui/StatusBar.tsx
+import { Box as Box6, Text as Text6 } from "ink";
+import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+var FILE_HINTS = [
+  { key: "\u2191\u2193", action: "navigate" },
+  { key: "tab", action: "switch panel" },
+  { key: "?", action: "help" },
+  { key: "q", action: "quit" }
+];
+var KEY_HINTS = [
+  { key: "\u2191\u2193", action: "navigate" },
+  { key: "tab", action: "switch" },
+  { key: "enter", action: "edit" },
+  { key: "y", action: "copy" },
+  { key: "r", action: "reveal" },
+  { key: "a", action: "add" },
+  { key: "D", action: "delete" },
+  { key: "d", action: "diff" },
+  { key: "?", action: "help" },
+  { key: "q", action: "quit" }
+];
+function Hints({ hints }) {
+  return /* @__PURE__ */ jsx6(Box6, { gap: 2, children: hints.map(({ key, action }) => /* @__PURE__ */ jsxs6(Box6, { gap: 1, children: [
+    /* @__PURE__ */ jsx6(Text6, { bold: true, color: "cyan", children: key }),
+    /* @__PURE__ */ jsx6(Text6, { dimColor: true, children: action })
+  ] }, key)) });
+}
+function StatusBar({ message, focus }) {
+  return /* @__PURE__ */ jsx6(
+    Box6,
+    {
+      borderStyle: "single",
+      borderTop: true,
+      borderBottom: false,
+      borderLeft: false,
+      borderRight: false,
+      paddingX: 1,
+      children: message ? /* @__PURE__ */ jsx6(Text6, { children: message }) : /* @__PURE__ */ jsx6(Hints, { hints: focus === "files" ? FILE_HINTS : KEY_HINTS })
+    }
+  );
+}
+
 // src/tui/App.tsx
 import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 function App({ files }) {
@@ -1064,108 +797,111 @@ function App({ files }) {
     setStatusMsg(msg);
     setTimeout(() => setStatusMsg(void 0), ms);
   }
-  useInput6((input, key) => {
-    if (input === "q" || key.escape) {
-      exit();
-      return;
-    }
-    if (input === "?") {
-      setMode({ type: "help" });
-      return;
-    }
-    if (key.tab) {
-      setFocus((f) => f === "files" ? "keys" : "files");
-      return;
-    }
-    if (focus !== "keys") return;
-    const k = keys[keyIndex];
-    if (input === "r") {
-      if (!k) return;
-      if (revealed.has(k.key)) {
-        setRevealed((prev) => {
-          const next = new Map(prev);
-          next.delete(k.key);
-          return next;
-        });
+  useInput6(
+    (input, key) => {
+      if (input === "q" || key.escape) {
+        exit();
         return;
       }
-      if (k.encrypted) {
-        const plain = decryptValue(k.value, selectedFile.path);
-        if (plain === null) {
-          flash("\u{1F512} Private key not found in environment");
-          return;
-        }
-        setRevealed((prev) => new Map(prev).set(k.key, plain));
-      } else {
-        setRevealed((prev) => new Map(prev).set(k.key, k.value));
+      if (input === "?") {
+        setMode({ type: "help" });
+        return;
       }
-      return;
-    }
-    if (input === "R") {
-      if (revealed.size > 0) {
-        setRevealed(/* @__PURE__ */ new Map());
+      if (key.tab) {
+        setFocus((f) => f === "files" ? "keys" : "files");
         return;
       }
-      const decrypted = keys.some((e) => e.encrypted) ? decryptAllValues(selectedFile.path) : {};
-      const next = /* @__PURE__ */ new Map();
-      for (const entry of keys) {
-        if (entry.encrypted) {
-          const plain = decrypted[entry.key];
-          if (plain === void 0 || isEncryptedValue(plain)) {
-            flash("\u{1F512} Private key not found \u2014 cannot reveal all");
+      if (focus !== "keys") return;
+      const k = keys[keyIndex];
+      if (input === "r") {
+        if (!k) return;
+        if (revealed.has(k.key)) {
+          setRevealed((prev) => {
+            const next = new Map(prev);
+            next.delete(k.key);
+            return next;
+          });
+          return;
+        }
+        if (k.encrypted) {
+          const plain = decryptValue(k.value, selectedFile.path);
+          if (plain === null) {
+            flash("\u{1F512} Private key not found in environment");
             return;
           }
-          next.set(entry.key, plain);
+          setRevealed((prev) => new Map(prev).set(k.key, plain));
         } else {
-          next.set(entry.key, entry.value);
+          setRevealed((prev) => new Map(prev).set(k.key, k.value));
         }
+        return;
       }
-      setRevealed(next);
-      return;
-    }
-    if (input === "y") {
-      if (!k) return;
-      const value = k.encrypted ? decryptValue(k.value, selectedFile.path) : k.value;
-      if (value === null) {
-        flash("\u{1F512} Private key not found \u2014 cannot copy");
+      if (input === "R") {
+        if (revealed.size > 0) {
+          setRevealed(/* @__PURE__ */ new Map());
+          return;
+        }
+        const decrypted = keys.some((e) => e.encrypted) ? decryptAllValues(selectedFile.path) : {};
+        const next = /* @__PURE__ */ new Map();
+        for (const entry of keys) {
+          if (entry.encrypted) {
+            const plain = decrypted[entry.key];
+            if (plain === void 0 || isEncryptedValue(plain)) {
+              flash("\u{1F512} Private key not found \u2014 cannot reveal all");
+              return;
+            }
+            next.set(entry.key, plain);
+          } else {
+            next.set(entry.key, entry.value);
+          }
+        }
+        setRevealed(next);
         return;
       }
-      clipboard.writeSync(value);
-      flash(`Copied ${k.key}`);
-      return;
-    }
-    if (key.return) {
-      if (!k) return;
-      if (k.encrypted) {
-        const plain = decryptValue(k.value, selectedFile.path);
-        if (plain === null) {
-          flash("\u{1F512} Private key not found \u2014 cannot edit");
+      if (input === "y") {
+        if (!k) return;
+        const value = k.encrypted ? decryptValue(k.value, selectedFile.path) : k.value;
+        if (value === null) {
+          flash("\u{1F512} Private key not found \u2014 cannot copy");
           return;
         }
-        setMode({ type: "edit", key: { ...k, value: plain } });
-      } else {
-        setMode({ type: "edit", key: k });
+        clipboard.writeSync(value);
+        flash(`Copied ${k.key}`);
+        return;
       }
-      return;
-    }
-    if (input === "a") {
-      setMode({ type: "add-key" });
-      return;
-    }
-    if (input === "D") {
-      if (!k) return;
-      setMode({ type: "confirm-delete", key: k });
-      return;
-    }
-    if (input === "d") {
-      setMode({ type: "diff" });
-      return;
-    }
-    if (input === "e") {
-      setMode({ type: "confirm-encrypt" });
-      return;
-    }
-  }, { isActive: isRawModeSupported && mode.type === "normal" });
+      if (key.return) {
+        if (!k) return;
+        if (k.encrypted) {
+          const plain = decryptValue(k.value, selectedFile.path);
+          if (plain === null) {
+            flash("\u{1F512} Private key not found \u2014 cannot edit");
+            return;
+          }
+          setMode({ type: "edit", key: { ...k, value: plain } });
+        } else {
+          setMode({ type: "edit", key: k });
+        }
+        return;
+      }
+      if (input === "a") {
+        setMode({ type: "add-key" });
+        return;
+      }
+      if (input === "D") {
+        if (!k) return;
+        setMode({ type: "confirm-delete", key: k });
+        return;
+      }
+      if (input === "d") {
+        setMode({ type: "diff" });
+        return;
+      }
+      if (input === "e") {
+        setMode({ type: "confirm-encrypt" });
+        return;
+      }
+    },
+    { isActive: isRawModeSupported && mode.type === "normal" }
+  );
   if (mode.type === "edit") {
     const editing = mode.key;
     return /* @__PURE__ */ jsx7(
@@ -1303,7 +1039,15 @@ function App({ files }) {
         statusMsg,
         focus2: focus,
         interactive: false,
-        extra: /* @__PURE__ */ jsx7(ConfirmAddEncrypt, { keyName, onEncrypt: () => commit(true), onPlain: () => commit(false), onCancel: () => setMode({ type: "normal" }) })
+        extra: /* @__PURE__ */ jsx7(
+          ConfirmAddEncrypt,
+          {
+            keyName,
+            onEncrypt: () => commit(true),
+            onPlain: () => commit(false),
+            onCancel: () => setMode({ type: "normal" })
+          }
+        )
       }
     );
   }
@@ -1371,7 +1115,9 @@ function App({ files }) {
                   flash(`Encrypted ${selectedFile.relativePath}`);
                 }
               } catch (err) {
-                flash(`Error: ${err instanceof Error ? err.message : String(err)}`);
+                flash(
+                  `Error: ${err instanceof Error ? err.message : String(err)}`
+                );
               }
               refreshKeys();
               setRevealed(/* @__PURE__ */ new Map());
@@ -1435,17 +1181,26 @@ function Layout({
     /* @__PURE__ */ jsxs7(Box7, { paddingX: 1, children: [
       /* @__PURE__ */ jsx7(Text7, { bold: true, color: "cyan", children: "dotenvx-ui" }),
       /* @__PURE__ */ jsxs7(Text7, { dimColor: true, children: [
-        "  ",
+        " ",
         selectedFile.relativePath,
-        "  \xB7  ",
+        " \xB7 ",
         files.length,
-        " files  \xB7  ",
+        " files \xB7 ",
         encCount,
         " enc"
       ] })
     ] }),
     /* @__PURE__ */ jsxs7(Box7, { height: listRows, children: [
-      /* @__PURE__ */ jsx7(FileList, { files, selectedIndex: fileIndex, focused: focus === "files", interactive, onSelect: onSelectFile }),
+      /* @__PURE__ */ jsx7(
+        FileList,
+        {
+          files,
+          selectedIndex: fileIndex,
+          focused: focus === "files",
+          interactive,
+          onSelect: onSelectFile
+        }
+      ),
       /* @__PURE__ */ jsx7(
         KeyTable,
         {
@@ -1461,11 +1216,26 @@ function Layout({
       )
     ] }),
     extra,
-    !extra && /* @__PURE__ */ jsx7(ValuePreview, { keys, keyIndex, focus, revealed, width: termCols }),
+    !extra && /* @__PURE__ */ jsx7(
+      ValuePreview,
+      {
+        keys,
+        keyIndex,
+        focus,
+        revealed,
+        width: termCols
+      }
+    ),
     /* @__PURE__ */ jsx7(StatusBar, { focus, message: statusMsg })
   ] });
 }
-function ValuePreview({ keys, keyIndex, focus, revealed, width }) {
+function ValuePreview({
+  keys,
+  keyIndex,
+  focus,
+  revealed,
+  width
+}) {
   if (focus !== "keys") return null;
   const k = keys[keyIndex];
   if (!k) return null;
@@ -1489,35 +1259,47 @@ function ValuePreview({ keys, keyIndex, focus, revealed, width }) {
       children: [
         /* @__PURE__ */ jsxs7(Text7, { bold: true, color: "cyan", children: [
           k.key,
-          "  "
+          " "
         ] }),
-        /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "\xB7  " }),
-        /* @__PURE__ */ jsx7(Text7, { truncate: true, children: flat })
+        /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "\xB7 " }),
+        /* @__PURE__ */ jsx7(Box7, { overflow: "hidden", children: /* @__PURE__ */ jsx7(Text7, { children: flat }) })
       ]
     }
   );
 }
 function ConfirmDelete({ keyName, onConfirm, onCancel }) {
   const { isRawModeSupported } = useStdin6();
-  useInput6((input) => {
-    if (input === "y" || input === "Y") onConfirm();
-    else onCancel();
-  }, { isActive: isRawModeSupported });
+  useInput6(
+    (input) => {
+      if (input === "y" || input === "Y") onConfirm();
+      else onCancel();
+    },
+    { isActive: isRawModeSupported }
+  );
   return /* @__PURE__ */ jsxs7(Box7, { paddingX: 1, children: [
     /* @__PURE__ */ jsxs7(Text7, { color: "red", children: [
       "Delete ",
       /* @__PURE__ */ jsx7(Text7, { bold: true, children: keyName }),
-      "? "
+      "?",
+      " "
     ] }),
-    /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "y confirm  any other key cancel" })
+    /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "y confirm any other key cancel" })
   ] });
 }
-function ConfirmEncrypt({ decrypt, fileName, onConfirm, onCancel }) {
+function ConfirmEncrypt({
+  decrypt,
+  fileName,
+  onConfirm,
+  onCancel
+}) {
   const { isRawModeSupported } = useStdin6();
-  useInput6((input) => {
-    if (input === "y" || input === "Y") onConfirm();
-    else onCancel();
-  }, { isActive: isRawModeSupported });
+  useInput6(
+    (input) => {
+      if (input === "y" || input === "Y") onConfirm();
+      else onCancel();
+    },
+    { isActive: isRawModeSupported }
+  );
   const action = decrypt ? "Decrypt" : "Encrypt";
   const color = decrypt ? "yellow" : "green";
   return /* @__PURE__ */ jsxs7(Box7, { paddingX: 1, children: [
@@ -1525,42 +1307,52 @@ function ConfirmEncrypt({ decrypt, fileName, onConfirm, onCancel }) {
       action,
       " ",
       /* @__PURE__ */ jsx7(Text7, { bold: true, children: fileName }),
-      "? "
+      "?",
+      " "
     ] }),
-    /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "y confirm  any other key cancel" })
+    /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "y confirm any other key cancel" })
   ] });
 }
-function ConfirmAddEncrypt({ keyName, onEncrypt, onPlain, onCancel }) {
+function ConfirmAddEncrypt({
+  keyName,
+  onEncrypt,
+  onPlain,
+  onCancel
+}) {
   const { isRawModeSupported } = useStdin6();
-  useInput6((input, key) => {
-    if (key.escape) {
-      onCancel();
-      return;
-    }
-    if (input === "y" || input === "Y") {
-      onEncrypt();
-      return;
-    }
-    if (input === "n" || input === "N" || key.return) {
-      onPlain();
-      return;
-    }
-  }, { isActive: isRawModeSupported });
+  useInput6(
+    (input, key) => {
+      if (key.escape) {
+        onCancel();
+        return;
+      }
+      if (input === "y" || input === "Y") {
+        onEncrypt();
+        return;
+      }
+      if (input === "n" || input === "N" || key.return) {
+        onPlain();
+        return;
+      }
+    },
+    { isActive: isRawModeSupported }
+  );
   return /* @__PURE__ */ jsxs7(Box7, { paddingX: 1, children: [
     /* @__PURE__ */ jsxs7(Text7, { children: [
       "Encrypt ",
       /* @__PURE__ */ jsx7(Text7, { bold: true, children: keyName }),
-      "? "
+      "?",
+      " "
     ] }),
-    /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "y encrypt  n plain  esc cancel" })
+    /* @__PURE__ */ jsx7(Text7, { dimColor: true, children: "y encrypt n plain esc cancel" })
   ] });
 }
 
 // src/tui/ErrorBoundary.tsx
-import React4 from "react";
 import { Box as Box8, Text as Text8 } from "ink";
+import React from "react";
 import { jsx as jsx8, jsxs as jsxs8 } from "react/jsx-runtime";
-var ErrorBoundary = class extends React4.Component {
+var ErrorBoundary = class extends React.Component {
   state = { error: null };
   static getDerivedStateFromError(error) {
     return { error };
@@ -1578,9 +1370,8 @@ var ErrorBoundary = class extends React4.Component {
 };
 
 // src/cli.tsx
-import { createRequire as createRequire2 } from "module";
 import { jsx as jsx9 } from "react/jsx-runtime";
-var { version } = createRequire2(import.meta.url)("../package.json");
+var { version } = createRequire(import.meta.url)("../package.json");
 var HELP = `
 dotenvx-ui \u2014 terminal and web UI for dotenvx environment files
 
@@ -1609,12 +1400,14 @@ var commands = {
     console.log(HELP);
     process.exit(0);
   },
-  "ui": runWebUI
+  ui: runWebUI
 };
 var [, , command] = process.argv;
 if (command !== void 0 && !(command in commands)) {
-  console.error(`Unknown command: ${command}
-Run dotenvx-ui --help for usage.`);
+  console.error(
+    `Unknown command: ${command}
+Run dotenvx-ui --help for usage.`
+  );
   process.exit(1);
 }
 commands[command ?? ""]?.() ?? runTUI();
@@ -1624,9 +1417,17 @@ function runTUI() {
     console.error("No .env files found in this directory.");
     process.exit(1);
   }
-  render(/* @__PURE__ */ jsx9(ErrorBoundary, { children: /* @__PURE__ */ jsx9(App, { files }) }), { alternateScreen: true });
+  render(
+    /* @__PURE__ */ jsx9(ErrorBoundary, { children: /* @__PURE__ */ jsx9(App, { files }) }),
+    { alternateScreen: true }
+  );
 }
-function runWebUI() {
-  console.log("Web UI \u2014 coming soon");
-  process.exit(0);
+async function runWebUI() {
+  const { startServer } = await import("./server-DDA3TXEA.js");
+  const files = scan(process.cwd());
+  if (files.length === 0) {
+    console.error("No .env files found in this directory.");
+    process.exit(1);
+  }
+  await startServer(process.cwd());
 }