@fiete/drift 1.0.0 → 1.0.2

package/README.md

@@ -0,0 +1,29 @@
+# drift
+
+A TUI command vault for your shell. Save, search, and execute commands you use often but can never quite remember.
+
+## Install
+
+```bash
+npm install -g @brechtknecht/drift
+```
+
+## Usage
+
+```bash
+drift          # open the TUI browser
+drift add      # add a new command interactively
+drift add "git log --oneline -20"   # pre-fill the command
+```
+
+## Commands
+
+Each saved command has:
+- **Description** — what it does
+- **Command** — the shell command
+- **Directory** *(optional)* — when set, executing or copying prepends `cd <dir> &&`
+- **Tags** — for organisation and search
+
+## Data
+
+Commands are stored at `~/.config/drift/commands.json`.

package/dist/{AddForm-VA5UMZDC.js → AddForm-BXHHRR2V.js}

@@ -1,8 +1,8 @@
 #!/usr/bin/env node
 import {
   AddForm
-} from "./chunk-VS6YEHBV.js";
-import "./chunk-QT5M6VMT.js";
+} from "./chunk-VCY3CRYL.js";
+import "./chunk-V6RC35DD.js";
 export {
   AddForm
 };

package/dist/{Browser-WWFMCIAC.js → Browser-UPOZVAV4.js}

@@ -2,12 +2,12 @@
 import {
   AddForm,
   useStore
-} from "./chunk-VS6YEHBV.js";
-import "./chunk-QT5M6VMT.js";
+} from "./chunk-VCY3CRYL.js";
+import "./chunk-V6RC35DD.js";
 
 // src/ui/Browser.tsx
-import { useState as useState2, useCallback as useCallback2 } from "react";
-import { Box as Box6, Text as Text6, useInput as useInput3, useApp } from "ink";
+import { useState as useState3, useCallback as useCallback2 } from "react";
+import { Box as Box7, Text as Text7, useInput as useInput4, useApp } from "ink";
 import clipboard from "clipboardy";
 
 // src/hooks/useFuzzySearch.ts
@@ -226,19 +226,158 @@ function EditModal({ command, onSave, onCancel }) {
   );
 }
 
-// src/ui/Browser.tsx
+// src/ui/Onboarding.tsx
+import { useEffect, useRef, useState as useState2 } from "react";
+import { Box as Box6, Text as Text6, useInput as useInput3 } from "ink";
 import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
+var W = 64;
+var H = 20;
+var PATHS = [
+  // 1 — bottom-center → sweep hard left → exit top-right (original)
+  [{ x: 0.45, y: 1.12 }, { x: 0.45, y: 0.55 }, { x: 0.1, y: 0.12 }, { x: 1.12, y: 0.1 }],
+  // 2 — bottom-right → wide left arc → exit left-middle
+  [{ x: 0.8, y: 1.12 }, { x: 0.8, y: 0.45 }, { x: 0.15, y: 0.18 }, { x: -0.12, y: 0.45 }],
+  // 3 — bottom-left → arc right → exit top-right (mirror of 1)
+  [{ x: 0.22, y: 1.12 }, { x: 0.22, y: 0.55 }, { x: 0.88, y: 0.12 }, { x: 1.12, y: 0.1 }],
+  // 4 — left-middle → sweep right across → exit top-right
+  [{ x: -0.12, y: 0.7 }, { x: 0.22, y: 0.7 }, { x: 0.78, y: 0.12 }, { x: 1.12, y: 0.12 }],
+  // 5 — right-middle → sweep left across → exit top-left
+  [{ x: 1.12, y: 0.7 }, { x: 0.78, y: 0.7 }, { x: 0.22, y: 0.12 }, { x: -0.12, y: 0.12 }]
+];
+function bezier(bp, t) {
+  const m = 1 - t;
+  return {
+    x: m * m * m * bp[0].x + 3 * m * m * t * bp[1].x + 3 * m * t * t * bp[2].x + t * t * t * bp[3].x,
+    y: m * m * m * bp[0].y + 3 * m * m * t * bp[1].y + 3 * m * t * t * bp[2].y + t * t * t * bp[3].y
+  };
+}
+function bezierAngleDeg(bp, t) {
+  const d = 1e-3;
+  const a = bezier(bp, Math.max(0, t - d));
+  const b = bezier(bp, Math.min(1, t + d));
+  return Math.atan2(b.y - a.y, b.x - a.x) * 180 / Math.PI;
+}
+var SKID_CH = ["\u2500", "\u2572", "\u2502", "\u2571", "\u2500", "\u2572", "\u2502", "\u2571"];
+var SMOKE_CH = ["\u2217", "\xB0", "\xB7", "`", "'", "~", "\u2218", "*"];
+var DURATION = 4200;
+var PAUSE = 900;
+var TRAIL_DT = 0.016;
+var DRIFT_DEG = 24;
+function spawnTrail(marks, smokes, carX, carY, bodyDeg) {
+  const bRad = bodyDeg * Math.PI / 180;
+  const rearX = carX - Math.cos(bRad) * 3.5;
+  const rearY = carY - Math.sin(bRad) * 3.5;
+  const pRad = bRad + Math.PI / 2;
+  const ws = 1.8;
+  const di = Math.round((bodyDeg % 360 + 360) % 360 / 45) % 8;
+  const sk = SKID_CH[di];
+  marks.push({ x: rearX + Math.cos(pRad) * ws, y: rearY + Math.sin(pRad) * ws, ch: sk, age: 0, maxAge: 90 });
+  marks.push({ x: rearX - Math.cos(pRad) * ws, y: rearY - Math.sin(pRad) * ws, ch: sk, age: 0, maxAge: 90 });
+  const count = Math.random() < 0.5 ? 1 : 2;
+  for (let i = 0; i < count; i++) {
+    smokes.push({
+      x: rearX + (Math.random() - 0.5) * 5,
+      y: rearY + (Math.random() - 0.5) * 2.5,
+      ch: SMOKE_CH[Math.floor(Math.random() * SMOKE_CH.length)],
+      age: 0,
+      maxAge: 28
+    });
+  }
+}
+function renderFrame(marks, smokes) {
+  const buf = Array.from({ length: H }, () => new Array(W).fill(" "));
+  function blit(x, y, ch) {
+    const xi = Math.round(x), yi = Math.round(y);
+    if (xi >= 0 && xi < W && yi >= 0 && yi < H) buf[yi][xi] = ch;
+  }
+  for (const m of marks) {
+    const fade = m.age / m.maxAge;
+    if (fade < 0.5) blit(m.x, m.y, m.ch);
+    else if (fade < 0.75) blit(m.x, m.y, "\xB7");
+    else blit(m.x, m.y, ".");
+  }
+  for (const s of smokes) {
+    if (s.age / s.maxAge < 0.65) blit(s.x, s.y, s.ch);
+  }
+  return buf.map((row) => row.join("")).join("\n");
+}
+function Onboarding({ onDismiss }) {
+  const [canvas, setCanvas] = useState2(() => Array(H).fill(" ".repeat(W)).join("\n"));
+  const anim = useRef({
+    marks: [],
+    smokes: [],
+    lastTrail: -1,
+    startTime: Date.now(),
+    pathIndex: 0,
+    cycleCount: 0
+  });
+  useInput3(() => {
+    onDismiss();
+  });
+  useEffect(() => {
+    const id = setInterval(() => {
+      const s = anim.current;
+      const elapsed = Date.now() - s.startTime;
+      const cycle = elapsed % (DURATION + PAUSE);
+      if (cycle < 40) {
+        s.cycleCount++;
+        s.pathIndex = s.cycleCount % PATHS.length;
+        s.lastTrail = -1;
+      }
+      const bp = PATHS[s.pathIndex];
+      const T = cycle < DURATION ? cycle / DURATION : 1;
+      const pos = bezier(bp, T);
+      const velDeg = bezierAngleDeg(bp, T);
+      const bodyDeg = velDeg + DRIFT_DEG;
+      if (T < 0.99 && T - s.lastTrail >= TRAIL_DT) {
+        s.lastTrail = T;
+        spawnTrail(s.marks, s.smokes, pos.x * W, pos.y * H, bodyDeg);
+      }
+      for (const m of s.marks) m.age++;
+      for (const sm of s.smokes) sm.age++;
+      s.marks = s.marks.filter((m) => m.age < m.maxAge);
+      s.smokes = s.smokes.filter((sm) => sm.age < sm.maxAge);
+      setCanvas(renderFrame(s.marks, s.smokes));
+    }, 40);
+    return () => clearInterval(id);
+  }, []);
+  const termH = process.stdout.rows ?? 24;
+  return /* @__PURE__ */ jsx6(Box6, { height: termH, alignItems: "center", justifyContent: "center", children: /* @__PURE__ */ jsxs6(
+    Box6,
+    {
+      borderStyle: "round",
+      borderColor: "white",
+      flexDirection: "column",
+      paddingX: 2,
+      paddingY: 1,
+      width: W + 8,
+      children: [
+        /* @__PURE__ */ jsxs6(Box6, { flexDirection: "column", alignItems: "center", marginBottom: 1, children: [
+          /* @__PURE__ */ jsx6(Text6, { bold: true, children: " drift " }),
+          /* @__PURE__ */ jsx6(Text6, { dimColor: true, children: "your commands. always within reach." })
+        ] }),
+        /* @__PURE__ */ jsx6(Box6, { width: W, children: /* @__PURE__ */ jsx6(Text6, { children: canvas }) }),
+        /* @__PURE__ */ jsx6(Box6, { justifyContent: "center", marginTop: 1, children: /* @__PURE__ */ jsx6(Text6, { dimColor: true, children: "press any key to continue" }) })
+      ]
+    }
+  ) });
+}
+
+// src/ui/Browser.tsx
+import { jsx as jsx7, jsxs as jsxs7 } from "react/jsx-runtime";
 var HEADER_ROWS = 4;
 var FOOTER_ROWS = 3;
-function Browser({ onExecute }) {
+function Browser({ onExecute, forceOnboarding = false }) {
   const { exit } = useApp();
   const { commands, updateCommand, moveCommand, removeCommand } = useStore();
-  const [query, setQuery] = useState2("");
-  const [isSearching, setIsSearching] = useState2(false);
-  const [selectedIndex, setSelectedIndex] = useState2(0);
-  const [viewportStart, setViewportStart] = useState2(0);
-  const [screen, setScreen] = useState2("browser");
-  const [statusMessage, setStatusMessage] = useState2("");
+  const [query, setQuery] = useState3("");
+  const [isSearching, setIsSearching] = useState3(false);
+  const [selectedIndex, setSelectedIndex] = useState3(0);
+  const [viewportStart, setViewportStart] = useState3(0);
+  const [screen, setScreen] = useState3(
+    () => forceOnboarding || commands.length === 0 ? "onboarding" : "browser"
+  );
+  const [statusMessage, setStatusMessage] = useState3("");
   const filtered = useFuzzySearch(commands, query);
   const clampedIndex = Math.min(selectedIndex, Math.max(0, filtered.length - 1));
   const selected = filtered[clampedIndex] ?? null;
@@ -262,7 +401,7 @@ function Browser({ onExecute }) {
     },
     [filtered.length, visibleRows]
   );
-  useInput3(
+  useInput4(
     (input, key) => {
       if (screen === "confirm-delete") return;
       if (isSearching) {
@@ -357,8 +496,11 @@ function Browser({ onExecute }) {
     },
     { isActive: screen === "browser" }
   );
+  if (screen === "onboarding") {
+    return /* @__PURE__ */ jsx7(Onboarding, { onDismiss: () => setScreen("browser") });
+  }
   if (screen === "add") {
-    return /* @__PURE__ */ jsx6(
+    return /* @__PURE__ */ jsx7(
       AddForm,
       {
         onSave: () => {
@@ -370,9 +512,9 @@ function Browser({ onExecute }) {
     );
   }
   const isOverlay = screen === "confirm-delete" || screen === "edit";
-  return /* @__PURE__ */ jsxs6(Box6, { flexDirection: "column", height: process.stdout.rows ?? 24, children: [
-    /* @__PURE__ */ jsx6(SearchBar, { query, isSearching, total: commands.length, filtered: filtered.length }),
-    /* @__PURE__ */ jsx6(Box6, { flexDirection: "column", flexGrow: 1, children: filtered.length === 0 ? /* @__PURE__ */ jsx6(Box6, { paddingX: 2, paddingY: 1, children: /* @__PURE__ */ jsx6(Text6, { color: "gray", dimColor: true, children: commands.length === 0 ? "No commands saved yet. Press `a` to add your first command." : "No matches. Keep typing or clear the search." }) }) : visibleCommands.map((cmd, i) => /* @__PURE__ */ jsx6(
+  return /* @__PURE__ */ jsxs7(Box7, { flexDirection: "column", height: process.stdout.rows ?? 24, children: [
+    /* @__PURE__ */ jsx7(SearchBar, { query, isSearching, total: commands.length, filtered: filtered.length }),
+    /* @__PURE__ */ jsx7(Box7, { flexDirection: "column", flexGrow: 1, children: filtered.length === 0 ? /* @__PURE__ */ jsx7(Box7, { paddingX: 2, paddingY: 1, children: /* @__PURE__ */ jsx7(Text7, { color: "gray", dimColor: true, children: commands.length === 0 ? "No commands saved yet. Press `a` to add your first command." : "No matches. Keep typing or clear the search." }) }) : visibleCommands.map((cmd, i) => /* @__PURE__ */ jsx7(
       CommandItem,
       {
         command: cmd,
@@ -381,7 +523,7 @@ function Browser({ onExecute }) {
       },
       cmd.id
     )) }),
-    screen === "edit" && selected && /* @__PURE__ */ jsx6(
+    screen === "edit" && selected && /* @__PURE__ */ jsx7(
       EditModal,
       {
         command: selected,
@@ -393,7 +535,7 @@ function Browser({ onExecute }) {
         onCancel: () => setScreen("browser")
       }
     ),
-    screen === "confirm-delete" && selected && /* @__PURE__ */ jsx6(
+    screen === "confirm-delete" && selected && /* @__PURE__ */ jsx7(
       ConfirmDelete,
       {
         command: selected,
@@ -406,7 +548,7 @@ function Browser({ onExecute }) {
         onCancel: () => setScreen("browser")
       }
     ),
-    /* @__PURE__ */ jsx6(StatusBar, { message: statusMessage })
+    /* @__PURE__ */ jsx7(StatusBar, { message: statusMessage })
   ] });
 }
 export {

package/dist/{FileStore-W4YQ3VAM.js → FileStore-VX4RYNIH.js}

@@ -1,7 +1,7 @@
 #!/usr/bin/env node
 import {
   FileStore
-} from "./chunk-QT5M6VMT.js";
+} from "./chunk-V6RC35DD.js";
 export {
   FileStore
 };

package/dist/{chunk-QT5M6VMT.js → chunk-V6RC35DD.js}

@@ -5,7 +5,7 @@ import path from "path";
 import os from "os";
 import fs from "fs";
 import { nanoid } from "nanoid";
-var STORE_DIR = path.join(os.homedir(), ".config", "cmdvault");
+var STORE_DIR = path.join(os.homedir(), ".config", "drift");
 var STORE_FILE = path.join(STORE_DIR, "commands.json");
 var CURRENT_VERSION = 1;
 var FileStore = class {

package/dist/{chunk-VS6YEHBV.js → chunk-VCY3CRYL.js}

@@ -1,7 +1,7 @@
 #!/usr/bin/env node
 import {
   FileStore
-} from "./chunk-QT5M6VMT.js";
+} from "./chunk-V6RC35DD.js";
 
 // src/ui/AddForm.tsx
 import { useState as useState2, useCallback as useCallback2 } from "react";

package/dist/index.js

@@ -6,13 +6,16 @@ import { render } from "ink";
 import React from "react";
 import { execa } from "execa";
 program.name("drift").description("cmdvault \u2014 A TUI command vault for your shell").version("1.0.0");
-program.command("list", { isDefault: true }).description("Browse saved commands (default)").action(async () => {
-  const { Browser } = await import("./Browser-WWFMCIAC.js");
+program.command("list", { isDefault: true }).description("Browse saved commands (default)").option("--onboarding", "Force the onboarding screen (debug)").action(async (opts) => {
+  const { Browser } = await import("./Browser-UPOZVAV4.js");
   let commandToRun;
   const { waitUntilExit } = render(
-    React.createElement(Browser, { onExecute: (cmd) => {
-      commandToRun = cmd;
-    } })
+    React.createElement(Browser, {
+      onExecute: (cmd) => {
+        commandToRun = cmd;
+      },
+      forceOnboarding: opts.onboarding ?? false
+    })
   );
   await waitUntilExit();
   process.stdout.write("\x1Bc");
@@ -24,7 +27,7 @@ program.command("list", { isDefault: true }).description("Browse saved commands
 });
 program.command("add [command]").description("Add a command. Pass it as a quoted argument, or open the interactive form.").option("-d, --desc <description>", "Description for the command").option("-t, --tags <tags>", "Comma-separated tags").addHelpText("after", '\nExamples:\n  drift add "git log --oneline -20"\n  drift add "cd /project && npm run dev" --desc "Start dev server" --tags "node,dev"\n  drift add   (opens interactive form)').action(async (command, opts) => {
   if (command && opts.desc !== void 0 && opts.tags !== void 0) {
-    const { FileStore } = await import("./FileStore-W4YQ3VAM.js");
+    const { FileStore } = await import("./FileStore-VX4RYNIH.js");
     const store = new FileStore();
     store.addCommand({
       command: command.trim(),
@@ -34,7 +37,7 @@ program.command("add [command]").description("Add a command. Pass it as a quoted
     console.log("Saved!");
     process.exit(0);
   }
-  const { AddForm } = await import("./AddForm-VA5UMZDC.js");
+  const { AddForm } = await import("./AddForm-BXHHRR2V.js");
   const initialValues = {
     command: command ?? "",
     description: opts.desc ?? "",
@@ -47,7 +50,7 @@ program.command("add [command]").description("Add a command. Pass it as a quoted
   process.exit(0);
 });
 program.command("remove <id>").description("Remove a command by ID").action(async (id) => {
-  const { FileStore } = await import("./FileStore-W4YQ3VAM.js");
+  const { FileStore } = await import("./FileStore-VX4RYNIH.js");
   const store = new FileStore();
   const removed = store.removeCommand(id);
   if (removed) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fiete/drift",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "A TUI command vault for your shell",
   "type": "module",
   "bin": {