@mak-98/dirvi-cli 0.1.0

package/dist/ui/App.js

@@ -0,0 +1,90 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { join } from 'node:path';
+import { Box, Text, useApp, useInput } from 'ink';
+import { useEffect, useReducer, useRef, useState } from 'react';
+import { getDirLazyEntries } from 'dirvi-lib';
+import { reducer } from '../application/reducer.js';
+import { inputToInputResult } from '../infrastructure/input.js';
+import DirEntries from './components/DirEntries.js';
+import { createDisplayRows } from '../application/display-rows.js';
+import { entryAtPath } from '../application/dir-buffer-helpers.js';
+export function App({ cwdAddress, initialView, print, onError }) {
+    const [view, dispatch] = useReducer(reducer, initialView);
+    const { buffer, folds, cursor } = view;
+    const [exitStatus, setExitStatus] = useState();
+    const pendingInput = useRef(undefined);
+    // Print view on changes
+    useEffect(() => {
+        print?.({ type: 'view', view: view });
+    }, [view, print]);
+    // --- Input ---
+    useInput((input, key) => {
+        const result = inputToInputResult(input, key, view, pendingInput.current);
+        if (result === undefined) {
+            return;
+        }
+        if (result === 'z') {
+            pendingInput.current = result;
+            return;
+        }
+        pendingInput.current = undefined;
+        const action = result;
+        // May need to load entries:
+        if (action.kind === 'toggleDir') {
+            const currentEntry = entryAtPath(view.buffer, action.path);
+            // If the entry at the path is directory with no entries loaded:
+            if (currentEntry?.kind === 'directory' &&
+                currentEntry.entries === undefined) {
+                const address = join(cwdAddress, ...action.path);
+                void getDirLazyEntries(address)
+                    .then((entries) => {
+                    dispatch({
+                        kind: 'directoryLoaded',
+                        path: action.path,
+                        entries,
+                    });
+                })
+                    .catch((error) => {
+                    const appError = error instanceof Error ? error : new Error(String(error));
+                    onError?.(appError);
+                    setExitStatus(`Unable to open directory: ${appError.message}`);
+                });
+            }
+            else if (currentEntry?.kind === 'directory') {
+                dispatch({
+                    kind: 'toggleDir',
+                    path: action.path,
+                });
+            }
+            return;
+        }
+        if (action.kind === 'printFile') {
+            print?.({
+                type: 'file',
+                path: action.path,
+            });
+            return;
+        }
+        if (action.kind === 'exit') {
+            setExitStatus(action.exitMessage);
+        }
+        dispatch(action);
+    });
+    // --- Exit Logic ---
+    const { exit } = useApp();
+    useEffect(() => {
+        if (exitStatus === undefined) {
+            return;
+        }
+        if (exitStatus !== '') {
+            onError?.(new Error(exitStatus));
+        }
+        exit();
+    }, [exitStatus, exit, onError]);
+    if (exitStatus !== undefined) {
+        return null;
+    }
+    // --- JSX ---
+    const displayRows = createDisplayRows(buffer, folds);
+    return (_jsx(Box, { flexDirection: "column", children: (buffer.entries.length === 0 || cursor === undefined) ? (_jsx(Text, { dimColor: true, children: "Directory is empty." })) : (_jsx(DirEntries, { rows: displayRows, cursor: cursor })) }));
+}

package/dist/ui/AppShell.d.ts

@@ -0,0 +1,13 @@
+import { UnixAbsolutePath, View } from 'dirvi-lib';
+import { PrintMessage } from '../domain/print-message.js';
+export type EmptyView = {
+    cursor: undefined;
+};
+export type ShellAppProps = {
+    cwdAddress: UnixAbsolutePath;
+    initialView: View | EmptyView;
+    print?: (message: PrintMessage) => void;
+    onError?: (error: Error) => void;
+};
+export declare function AppShell({ cwdAddress, initialView, print, onError }: ShellAppProps): import("react").JSX.Element;
+//# sourceMappingURL=AppShell.d.ts.map

package/dist/ui/AppShell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/ui/AppShell.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,IAAI,EAAE,MAAM,WAAW,CAAC;AAGnD,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAG1D,MAAM,MAAM,SAAS,GAAG;IACtB,MAAM,EAAE,SAAS,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAC1B,UAAU,EAAE,gBAAgB,CAAC;IAC7B,WAAW,EAAE,IAAI,GAAG,SAAS,CAAC;IAC9B,KAAK,CAAC,EAAE,CAAC,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IACxC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CAClC,CAAC;AAEF,wBAAgB,QAAQ,CAAC,EAAE,UAAU,EAAE,WAAW,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,aAAa,+BAalF"}

package/dist/ui/AppShell.js

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Text } from 'ink';
+import { App } from './App.js';
+export function AppShell({ cwdAddress, initialView, print, onError }) {
+    if (initialView.cursor === undefined) {
+        return _jsx(Text, { dimColor: true, children: "Directory is empty." });
+    }
+    return (_jsx(App, { cwdAddress: cwdAddress, initialView: initialView, print: print, onError: onError }));
+}

package/dist/ui/components/DirEntries.d.ts

@@ -0,0 +1,7 @@
+import type { Cursor, DisplayRow } from 'dirvi-lib';
+declare function DirEntries({ rows, cursor }: {
+    rows: DisplayRow[];
+    cursor: Cursor;
+}): import("react").JSX.Element;
+export default DirEntries;
+//# sourceMappingURL=DirEntries.d.ts.map

package/dist/ui/components/DirEntries.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DirEntries.d.ts","sourceRoot":"","sources":["../../../src/ui/components/DirEntries.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,WAAW,CAAC;AAQpD,iBAAS,UAAU,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE;IAAE,IAAI,EAAE,UAAU,EAAE,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,+BA8D3E;AAED,eAAe,UAAU,CAAC"}

package/dist/ui/components/DirEntries.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { Box, Text, useWindowSize } from 'ink';
+import { rowsEqual } from 'dirvi-lib';
+import { UnixEntry as UnixEntryComponent } from './UnixEntry.js';
+import { useRef } from 'react';
+// Display column of entries in directory, indented, and optional
+// cursor in position.
+function DirEntries({ rows, cursor }) {
+    const scrollMargin = 3;
+    const { rows: terminalRows } = useWindowSize();
+    const viewportStartRef = useRef(0);
+    const cursorIndex = rows.findIndex((row) => rowsEqual(cursor, row));
+    const viewportHeight = Math.max(1, terminalRows);
+    const maximumViewportStart = Math.max(0, rows.length - viewportHeight);
+    let viewportStart = viewportStartRef.current;
+    if (cursorIndex >= 0) {
+        const firstVisibleCursorIndex = viewportStart + scrollMargin;
+        const lastVisibleCursorIndex = viewportStart + viewportHeight - 1 - scrollMargin;
+        if (cursorIndex < firstVisibleCursorIndex) {
+            // Cursor moved above the visible area.
+            viewportStart = cursorIndex - scrollMargin;
+        }
+        else if (cursorIndex > lastVisibleCursorIndex) {
+            // Cursor moved below the visible area.
+            viewportStart = cursorIndex - viewportHeight + 1 + scrollMargin;
+        }
+    }
+    viewportStart = Math.max(0, Math.min(viewportStart, maximumViewportStart));
+    viewportStartRef.current = viewportStart;
+    const visibleRows = rows.slice(viewportStart, viewportStart + viewportHeight);
+    return (_jsx(_Fragment, { children: visibleRows.map((row) => {
+            const selected = rowsEqual(cursor, row);
+            const indent = row.parentPath.length;
+            if (row.kind === 'fold') {
+                return (_jsx(Box, { paddingLeft: indent * 2, children: _jsx(Text, { inverse: selected, dimColor: !selected, children: "..." }) }, `fold-${row.parentPath.join('/')}-${row.entryNames[0]}`));
+            }
+            return (_jsx(Box, { paddingLeft: indent * 2, children: _jsx(UnixEntryComponent, { entry: row.entry, selected: selected }) }, [...row.parentPath, row.entry.name].join('/')));
+        }) }));
+}
+export default DirEntries;

package/dist/ui/components/UnixEntry.d.ts

@@ -0,0 +1,6 @@
+import { UnixEntry } from 'dirvi-lib';
+export declare function UnixEntry({ entry, selected }: {
+    entry: UnixEntry;
+    selected: boolean;
+}): import("react").JSX.Element;
+//# sourceMappingURL=UnixEntry.d.ts.map

package/dist/ui/components/UnixEntry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UnixEntry.d.ts","sourceRoot":"","sources":["../../../src/ui/components/UnixEntry.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAEtC,wBAAgB,SAAS,CAAC,EACxB,KAAK,EACL,QAAQ,EACT,EAAE;IACD,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAA;CAClB,+BAuBA"}

package/dist/ui/components/UnixEntry.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Text } from 'ink';
+export function UnixEntry({ entry, selected }) {
+    switch (entry.kind) {
+        case 'file':
+            return (_jsx(Text, { inverse: selected, children: entry.name }));
+        case 'symlink':
+            return (_jsxs(Text, { inverse: selected, children: [entry.name, " -> ", entry.target] }));
+        case 'directory':
+            return (_jsxs(Text, { inverse: selected, color: "blue", children: [entry.name, "/"] }));
+    }
+}

package/package.json

@@ -0,0 +1,32 @@
+{
+  "name": "@mak-98/dirvi-cli",
+  "version": "0.1.0",
+  "description": "A Vim-inspired TUI for browsing directories.",
+  "type": "module",
+  "license": "GPL-3.0-or-later",
+  "bin": {
+    "dirvi": "./dist/index.js"
+  },
+  "main": "./dist/index.js",
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "commander": "^13.0.0",
+    "dirvi-lib": "0.1.0",
+    "ink": "^7.1.1",
+    "react": "^19.0.0"
+  },
+  "devDependencies": {
+    "@types/node": "^22.0.0",
+    "@types/react": "^19.0.0",
+    "tsx": "^4.0.0",
+    "typescript": "^5.0.0"
+  },
+  "scripts": {
+    "build": "tsc",
+    "dev": "FORCE_COLOR=3 tsx src/index.tsx",
+    "start": "node dist/index.js",
+    "typecheck": "tsc --noEmit"
+  }
+}