@abelfubu/dv 0.1.0

package/dist/directory-tree.d.ts

@@ -0,0 +1,72 @@
+/**
+ * File status based on git diff
+ */
+export type FileStatus = "added" | "modified" | "deleted" | "renamed";
+/**
+ * Input file info for tree building
+ */
+export interface TreeFileInfo {
+    path: string;
+    status: FileStatus;
+    additions: number;
+    deletions: number;
+    /** Optional index for scroll-to functionality */
+    fileIndex?: number;
+}
+/**
+ * A single node in the rendered tree output
+ */
+export interface TreeNode {
+    /** Display path (may be collapsed, e.g., "src/components") */
+    displayPath: string;
+    /** Full path from repo root (e.g., "src/components") */
+    fullPath: string;
+    /** Whether this is a file (true) or directory (false) */
+    isFile: boolean;
+    /** File index for scroll-to (only for files) */
+    fileIndex?: number;
+    /** File status (only for files) */
+    status?: FileStatus;
+    /** Number of added lines (only for files) */
+    additions?: number;
+    /** Number of deleted lines (only for files) */
+    deletions?: number;
+    /** Tree connector: spaces for indentation (no ASCII art) */
+    connector: string;
+    /** Prefix string for tree indentation, e.g., "    " */
+    prefix: string;
+}
+/**
+ * A hierarchical tree node with children for sidebar collapse/expand
+ */
+export interface HierarchicalTreeNode {
+    /** Display path (may be collapsed, e.g., "src/components") */
+    displayPath: string;
+    /** Full path from repo root (e.g., "src/components") */
+    fullPath: string;
+    /** Whether this is a file (true) or directory (false) */
+    isFile: boolean;
+    /** File index for scroll-to (only for files) */
+    fileIndex?: number;
+    /** File status (only for files) */
+    status?: FileStatus;
+    /** Number of added lines (only for files) */
+    additions?: number;
+    /** Number of deleted lines (only for files) */
+    deletions?: number;
+    /** Child nodes */
+    children: HierarchicalTreeNode[];
+}
+/**
+ * Build a hierarchical tree from file paths
+ * @param files Array of file info objects
+ * @returns Array of HierarchicalTreeNode objects with children
+ */
+export declare function buildHierarchicalTree(files: TreeFileInfo[]): HierarchicalTreeNode[];
+/**
+ * Build a directory tree from file paths
+ * @param files Array of file info objects
+ * @returns Array of TreeNode objects ready for rendering
+ */
+export declare function buildDirectoryTree(files: TreeFileInfo[]): TreeNode[];
+//# sourceMappingURL=directory-tree.d.ts.map

package/dist/directory-tree.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"directory-tree.d.ts","sourceRoot":"","sources":["../src/directory-tree.ts"],"names":[],"mappings":"AAIA;;GAEG;AACH,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,GAAG,SAAS,CAAA;AAErE;;GAEG;AACH,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,UAAU,CAAA;IAClB,SAAS,EAAE,MAAM,CAAA;IACjB,SAAS,EAAE,MAAM,CAAA;IACjB,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAED;;GAEG;AACH,MAAM,WAAW,QAAQ;IACvB,8DAA8D;IAC9D,WAAW,EAAE,MAAM,CAAA;IACnB,wDAAwD;IACxD,QAAQ,EAAE,MAAM,CAAA;IAChB,yDAAyD;IACzD,MAAM,EAAE,OAAO,CAAA;IACf,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,mCAAmC;IACnC,MAAM,CAAC,EAAE,UAAU,CAAA;IACnB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,4DAA4D;IAC5D,SAAS,EAAE,MAAM,CAAA;IACjB,uDAAuD;IACvD,MAAM,EAAE,MAAM,CAAA;CACf;AAED;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC,8DAA8D;IAC9D,WAAW,EAAE,MAAM,CAAA;IACnB,wDAAwD;IACxD,QAAQ,EAAE,MAAM,CAAA;IAChB,yDAAyD;IACzD,MAAM,EAAE,OAAO,CAAA;IACf,gDAAgD;IAChD,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,mCAAmC;IACnC,MAAM,CAAC,EAAE,UAAU,CAAA;IACnB,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,kBAAkB;IAClB,QAAQ,EAAE,oBAAoB,EAAE,CAAA;CACjC;AAYD;;;;GAIG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,YAAY,EAAE,GAAG,oBAAoB,EAAE,CAQnF;AAoBD;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,YAAY,EAAE,GAAG,QAAQ,EAAE,CAQpE"}

package/dist/directory-tree.js

@@ -0,0 +1,161 @@
+// Directory tree builder for displaying file changes in a tree structure.
+// Builds a collapsible tree from file paths with status colors and change counts.
+// Returns structured nodes that can be rendered by DirectoryTreeView component.
+/**
+ * Build a hierarchical tree from file paths
+ * @param files Array of file info objects
+ * @returns Array of HierarchicalTreeNode objects with children
+ */
+export function buildHierarchicalTree(files) {
+    if (files.length === 0) {
+        return [];
+    }
+    const tree = buildInternalTree(files);
+    sortInternalTree(tree);
+    return toHierarchical(tree);
+}
+function toHierarchical(nodes) {
+    return nodes.map((node) => {
+        const collapsed = collapseNode(node);
+        const isFile = collapsed.originalNode.status !== undefined;
+        return {
+            displayPath: collapsed.path,
+            fullPath: collapsed.originalNode.path,
+            isFile,
+            fileIndex: collapsed.originalNode.fileIndex,
+            status: collapsed.originalNode.status,
+            additions: collapsed.originalNode.additions,
+            deletions: collapsed.originalNode.deletions,
+            children: toHierarchical(collapsed.children),
+        };
+    });
+}
+/**
+ * Build a directory tree from file paths
+ * @param files Array of file info objects
+ * @returns Array of TreeNode objects ready for rendering
+ */
+export function buildDirectoryTree(files) {
+    if (files.length === 0) {
+        return [];
+    }
+    const tree = buildInternalTree(files);
+    sortInternalTree(tree);
+    return flattenTree(tree);
+}
+/**
+ * Build internal tree structure from file paths
+ */
+function buildInternalTree(files) {
+    const root = [];
+    const nodeMap = new Map();
+    for (const file of files) {
+        const parts = file.path.split("/").filter((part) => part !== "");
+        let currentPath = "";
+        let currentLevel = root;
+        for (let i = 0; i < parts.length; i++) {
+            const part = parts[i];
+            currentPath = currentPath ? `${currentPath}/${part}` : part;
+            let node = nodeMap.get(currentPath);
+            if (!node) {
+                node = {
+                    path: currentPath,
+                    children: [],
+                };
+                nodeMap.set(currentPath, node);
+                currentLevel.push(node);
+            }
+            // On the final part, assign file info
+            if (i === parts.length - 1) {
+                node.title = part;
+                node.fileIndex = file.fileIndex;
+                node.status = file.status;
+                node.additions = file.additions;
+                node.deletions = file.deletions;
+            }
+            currentLevel = node.children;
+        }
+    }
+    return root;
+}
+/**
+ * Get the base name from a path
+ */
+function getName(node) {
+    const parts = node.path.split("/");
+    return parts[parts.length - 1] || node.path;
+}
+/**
+ * Sort tree nodes by name at every level so file ordering is deterministic
+ * and independent from incoming git diff section order.
+ */
+function sortInternalTree(nodes) {
+    nodes.sort((a, b) => getName(a).toLowerCase().localeCompare(getName(b).toLowerCase()));
+    for (const node of nodes) {
+        if (node.children.length > 0) {
+            sortInternalTree(node.children);
+        }
+    }
+}
+/**
+ * Collapse directories that only contain a single subdirectory (no files)
+ */
+function collapseNode(node) {
+    let currentNode = node;
+    let collapsedPath = getName(currentNode);
+    // Keep collapsing while:
+    // - Current node has exactly one child
+    // - Current node is not a file (no status/title means it's a directory)
+    // - The single child is also a directory (no status)
+    while (currentNode.children.length === 1 &&
+        currentNode.status === undefined &&
+        currentNode.children[0].status === undefined &&
+        currentNode.children[0].children.length > 0) {
+        currentNode = currentNode.children[0];
+        collapsedPath = collapsedPath + "/" + getName(currentNode);
+    }
+    return {
+        path: collapsedPath,
+        collapsed: collapsedPath !== getName(node),
+        children: currentNode.children,
+        originalNode: currentNode,
+    };
+}
+/**
+ * Flatten the tree into a linear array of TreeNode objects
+ */
+function flattenTree(tree) {
+    const result = [];
+    function processNode(node, prefix, isLast, isRoot) {
+        const collapsed = collapseNode(node);
+        const displayPath = collapsed.path;
+        const connector = "  ";
+        // Determine if this is a file (has status) or directory
+        const isFile = collapsed.originalNode.status !== undefined;
+        result.push({
+            displayPath,
+            fullPath: collapsed.originalNode.path,
+            isFile,
+            fileIndex: collapsed.originalNode.fileIndex,
+            status: collapsed.originalNode.status,
+            additions: collapsed.originalNode.additions,
+            deletions: collapsed.originalNode.deletions,
+            connector,
+            prefix,
+        });
+        // Process children
+        if (collapsed.children.length > 0) {
+            const childPrefix = prefix + "  ";
+            collapsed.children.forEach((child, idx) => {
+                const childIsLast = idx === collapsed.children.length - 1;
+                processNode(child, childPrefix, childIsLast, false);
+            });
+        }
+    }
+    // Process root level nodes
+    tree.forEach((node, idx) => {
+        const isLast = idx === tree.length - 1;
+        processNode(node, "", isLast, true);
+    });
+    return result;
+}

package/dist/directory-tree.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=directory-tree.test.d.ts.map

package/dist/directory-tree.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"directory-tree.test.d.ts","sourceRoot":"","sources":["../src/directory-tree.test.tsx"],"names":[],"mappings":""}

package/dist/directory-tree.test.js

@@ -0,0 +1,383 @@
+import { jsxs as _jsxs, jsx as _jsx } from "@opentuah/react/jsx-runtime";
+// Tests for directory tree building and rendering
+// Uses opentui test renderer with captureCharFrame() for visual testing
+import { testRender } from "@opentuah/react/test-utils";
+import { afterEach, describe, expect, it } from "bun:test";
+import { DirectoryTreeView } from "./components/directory-tree-view.js";
+import { buildDirectoryTree, buildHierarchicalTree } from "./directory-tree.js";
+/**
+ * Simple component to render tree nodes as text for testing
+ */
+function TreeRenderer({ nodes }) {
+    return (_jsx("box", { style: { flexDirection: "column" }, children: nodes.map((node, idx) => {
+            // Build the line: prefix + connector + path + optional stats
+            const statsStr = node.isFile
+                ? ` (+${node.additions},-${node.deletions})`
+                : "";
+            return (_jsxs("text", { children: [node.prefix, node.connector, node.displayPath, statsStr] }, idx));
+        }) }));
+}
+describe("buildDirectoryTree", () => {
+    it("should return empty array for no files", () => {
+        const result = buildDirectoryTree([]);
+        expect(result).toEqual([]);
+    });
+    it("should handle single file at root", () => {
+        const files = [
+            { path: "README.md", status: "modified", additions: 5, deletions: 2 },
+        ];
+        const result = buildDirectoryTree(files);
+        expect(result).toHaveLength(1);
+        expect(result[0].displayPath).toBe("README.md");
+        expect(result[0].isFile).toBe(true);
+        expect(result[0].status).toBe("modified");
+    });
+    it("should collapse single-child directories", () => {
+        const files = [
+            { path: "src/components/Button.tsx", status: "added", additions: 50, deletions: 0 },
+        ];
+        const result = buildDirectoryTree(files);
+        // Should collapse src/components into one directory node
+        expect(result).toHaveLength(2);
+        expect(result[0].displayPath).toBe("src/components");
+        expect(result[0].isFile).toBe(false);
+        expect(result[1].displayPath).toBe("Button.tsx");
+        expect(result[1].isFile).toBe(true);
+    });
+    it("should sort nodes alphabetically regardless of input order", () => {
+        const files = [
+            { path: "website/src/index.ts", status: "modified", additions: 1, deletions: 0 },
+            { path: "db/schema.prisma", status: "modified", additions: 1, deletions: 0 },
+            { path: "discord/src/utils.ts", status: "modified", additions: 1, deletions: 0 },
+            { path: "discord/src/cli.ts", status: "modified", additions: 1, deletions: 0 },
+            { path: "gateway-proxy/src/main.rs", status: "modified", additions: 1, deletions: 0 },
+        ];
+        const result = buildDirectoryTree(files);
+        const rendered = result.map((node) => `${node.prefix}${node.connector}${node.displayPath}`);
+        expect(rendered).toEqual([
+            "  db",
+            "    schema.prisma",
+            "  discord/src",
+            "    cli.ts",
+            "    utils.ts",
+            "  gateway-proxy/src",
+            "    main.rs",
+            "  website/src",
+            "    index.ts",
+        ]);
+    });
+});
+describe("TreeRenderer visual tests", () => {
+    let testSetup;
+    afterEach(() => {
+        if (testSetup) {
+            testSetup.renderer.destroy();
+        }
+    });
+    it("should render single file", async () => {
+        const files = [
+            { path: "package.json", status: "modified", additions: 1, deletions: 1 },
+        ];
+        const nodes = buildDirectoryTree(files);
+        testSetup = await testRender(_jsx(TreeRenderer, { nodes: nodes }), {
+            width: 50,
+            height: 5,
+        });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toMatchSnapshot();
+    });
+    it("should render multiple root files", async () => {
+        const files = [
+            { path: "package.json", status: "modified", additions: 1, deletions: 1 },
+            { path: "README.md", status: "added", additions: 20, deletions: 0 },
+            { path: "tsconfig.json", status: "deleted", additions: 0, deletions: 15 },
+        ];
+        const nodes = buildDirectoryTree(files);
+        testSetup = await testRender(_jsx(TreeRenderer, { nodes: nodes }), {
+            width: 50,
+            height: 7,
+        });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toMatchSnapshot();
+    });
+    it("should render nested directories with indentation", async () => {
+        const files = [
+            { path: "src/index.ts", status: "modified", additions: 5, deletions: 2 },
+            { path: "src/utils.ts", status: "added", additions: 30, deletions: 0 },
+        ];
+        const nodes = buildDirectoryTree(files);
+        testSetup = await testRender(_jsx(TreeRenderer, { nodes: nodes }), {
+            width: 50,
+            height: 7,
+        });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toMatchSnapshot();
+    });
+    it("should collapse single-child directories", async () => {
+        const files = [
+            { path: "src/components/Button.tsx", status: "added", additions: 50, deletions: 0 },
+            { path: "src/components/Input.tsx", status: "added", additions: 40, deletions: 0 },
+        ];
+        const nodes = buildDirectoryTree(files);
+        testSetup = await testRender(_jsx(TreeRenderer, { nodes: nodes }), {
+            width: 50,
+            height: 7,
+        });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toMatchSnapshot();
+    });
+    it("should render complex nested structure", async () => {
+        const files = [
+            { path: "package.json", status: "modified", additions: 2, deletions: 1, fileIndex: 0 },
+            { path: "src/index.ts", status: "modified", additions: 10, deletions: 5, fileIndex: 1 },
+            { path: "src/components/Button.tsx", status: "added", additions: 50, deletions: 0, fileIndex: 2 },
+            { path: "src/components/Input.tsx", status: "modified", additions: 15, deletions: 8, fileIndex: 3 },
+            { path: "src/utils/helpers.ts", status: "deleted", additions: 0, deletions: 30, fileIndex: 4 },
+            { path: "tests/index.test.ts", status: "added", additions: 25, deletions: 0, fileIndex: 5 },
+        ];
+        const nodes = buildDirectoryTree(files);
+        testSetup = await testRender(_jsx(TreeRenderer, { nodes: nodes }), {
+            width: 60,
+            height: 15,
+        });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toMatchSnapshot();
+    });
+    it("should handle deeply nested paths with collapse", async () => {
+        const files = [
+            { path: "packages/core/src/lib/utils/helpers.ts", status: "modified", additions: 5, deletions: 3 },
+            { path: "packages/core/src/lib/utils/format.ts", status: "added", additions: 20, deletions: 0 },
+        ];
+        const nodes = buildDirectoryTree(files);
+        testSetup = await testRender(_jsx(TreeRenderer, { nodes: nodes }), {
+            width: 60,
+            height: 7,
+        });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toMatchSnapshot();
+    });
+    it("should handle sibling directories at different levels", async () => {
+        const files = [
+            { path: "src/api/routes.ts", status: "modified", additions: 10, deletions: 5 },
+            { path: "src/api/handlers.ts", status: "added", additions: 30, deletions: 0 },
+            { path: "src/db/models.ts", status: "modified", additions: 8, deletions: 2 },
+            { path: "lib/utils.ts", status: "added", additions: 15, deletions: 0 },
+        ];
+        const nodes = buildDirectoryTree(files);
+        testSetup = await testRender(_jsx(TreeRenderer, { nodes: nodes }), {
+            width: 60,
+            height: 12,
+        });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toMatchSnapshot();
+    });
+});
+describe("buildHierarchicalTree", () => {
+    it("should return empty array for no files", () => {
+        const result = buildHierarchicalTree([]);
+        expect(result).toEqual([]);
+    });
+    it("should handle single file at root", () => {
+        const files = [
+            { path: "README.md", status: "modified", additions: 5, deletions: 2 },
+        ];
+        const result = buildHierarchicalTree(files);
+        expect(result).toHaveLength(1);
+        expect(result[0].displayPath).toBe("README.md");
+        expect(result[0].isFile).toBe(true);
+        expect(result[0].status).toBe("modified");
+        expect(result[0].children).toEqual([]);
+    });
+    it("should build nested directory hierarchy", () => {
+        const files = [
+            { path: "src/index.ts", status: "modified", additions: 5, deletions: 2 },
+            { path: "src/utils.ts", status: "added", additions: 30, deletions: 0 },
+        ];
+        const result = buildHierarchicalTree(files);
+        expect(result).toHaveLength(1);
+        expect(result[0].displayPath).toBe("src");
+        expect(result[0].isFile).toBe(false);
+        expect(result[0].children).toHaveLength(2);
+        expect(result[0].children[0].displayPath).toBe("index.ts");
+        expect(result[0].children[0].isFile).toBe(true);
+        expect(result[0].children[1].displayPath).toBe("utils.ts");
+        expect(result[0].children[1].isFile).toBe(true);
+    });
+    it("should collapse single-child directories in hierarchy", () => {
+        const files = [
+            { path: "src/components/Button.tsx", status: "added", additions: 50, deletions: 0 },
+        ];
+        const result = buildHierarchicalTree(files);
+        expect(result).toHaveLength(1);
+        expect(result[0].displayPath).toBe("src/components");
+        expect(result[0].isFile).toBe(false);
+        expect(result[0].children).toHaveLength(1);
+        expect(result[0].children[0].displayPath).toBe("Button.tsx");
+        expect(result[0].children[0].isFile).toBe(true);
+    });
+    it("should sort nodes alphabetically at every level", () => {
+        const files = [
+            { path: "b/file.ts", status: "modified", additions: 1, deletions: 0 },
+            { path: "a/file.ts", status: "modified", additions: 1, deletions: 0 },
+        ];
+        const result = buildHierarchicalTree(files);
+        expect(result).toHaveLength(2);
+        expect(result[0].displayPath).toBe("a");
+        expect(result[1].displayPath).toBe("b");
+    });
+});
+describe("DirectoryTreeView component", () => {
+    let testSetup;
+    afterEach(() => {
+        if (testSetup) {
+            testSetup.renderer.destroy();
+        }
+    });
+    it("renders folder icon on directory rows", async () => {
+        const files = [
+            { path: "src/index.ts", status: "modified", additions: 5, deletions: 2, fileIndex: 0 },
+        ];
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: files, themeName: "github" }), { width: 60, height: 5 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toContain("󰝰");
+    });
+    it("renders file-type icon on file rows", async () => {
+        const files = [
+            { path: "README.md", status: "modified", additions: 5, deletions: 2, fileIndex: 0 },
+            { path: "src/index.ts", status: "added", additions: 30, deletions: 0, fileIndex: 1 },
+        ];
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: files, themeName: "github" }), { width: 60, height: 5 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toContain("󰍔");
+        expect(frame).toContain("󰛦");
+    });
+    it("renders generic file icon for unknown extensions", async () => {
+        const files = [
+            { path: "config.yaml", status: "modified", additions: 1, deletions: 0, fileIndex: 0 },
+        ];
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: files, themeName: "github" }), { width: 60, height: 3 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toContain("󰈙");
+    });
+    it("should render tree without border", async () => {
+        const files = [
+            { path: "src/index.ts", status: "modified", additions: 5, deletions: 2, fileIndex: 0 },
+            { path: "src/utils.ts", status: "added", additions: 30, deletions: 0, fileIndex: 1 },
+            { path: "README.md", status: "deleted", additions: 0, deletions: 15, fileIndex: 2 },
+        ];
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: files, themeName: "github" }), { width: 60, height: 12 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toMatchSnapshot();
+    });
+    it("truncates long file paths while preserving the filename", async () => {
+        const files = [
+            {
+                path: "packages/core/src/lib/really-long-file-name.ts",
+                status: "modified",
+                additions: 12,
+                deletions: 3,
+            },
+        ];
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: files, themeName: "github", width: 28 }), { width: 28, height: 4 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toContain("…");
+        expect(frame).toContain("name.ts");
+        expect(frame).toContain("(+12,-3)");
+    });
+    it("should render empty when no files", async () => {
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: [], themeName: "github" }), { width: 40, height: 5 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        // Should render nothing (DirectoryTreeView returns null for empty)
+        expect(frame).toMatchSnapshot();
+    });
+    it("should highlight the active file row", async () => {
+        const files = [
+            { path: "README.md", status: "modified", additions: 5, deletions: 2, fileIndex: 0 },
+            { path: "src/index.ts", status: "added", additions: 30, deletions: 0, fileIndex: 1 },
+            { path: "src/utils.ts", status: "deleted", additions: 0, deletions: 15, fileIndex: 2 },
+        ];
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: files, themeName: "github", activeFileIndex: 1 }), { width: 60, height: 12 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        // Should show the tree with the active file highlighted
+        expect(frame).toContain("README.md");
+        expect(frame).toContain("index.ts");
+        expect(frame).toContain("utils.ts");
+    });
+    it("filters out children of collapsed folders", async () => {
+        const files = [
+            { path: "src/index.ts", status: "modified", additions: 5, deletions: 2, fileIndex: 0 },
+            { path: "src/utils.ts", status: "added", additions: 30, deletions: 0, fileIndex: 1 },
+        ];
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: files, themeName: "github", initialCollapsedPaths: ["src"] }), { width: 60, height: 5 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toContain("src");
+        expect(frame).not.toContain("index.ts");
+        expect(frame).not.toContain("utils.ts");
+    });
+    it("shows closed folder icon for collapsed folders", async () => {
+        const files = [
+            { path: "src/index.ts", status: "modified", additions: 5, deletions: 2, fileIndex: 0 },
+        ];
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: files, themeName: "github", initialCollapsedPaths: ["src"] }), { width: 60, height: 3 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toContain("󰉋");
+        expect(frame).not.toContain("󰝰");
+    });
+    it("collapsing compressed tree path hides entire chain", async () => {
+        const files = [
+            { path: "src/components/Button.tsx", status: "added", additions: 50, deletions: 0, fileIndex: 0 },
+            { path: "src/components/Input.tsx", status: "modified", additions: 10, deletions: 5, fileIndex: 1 },
+        ];
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: files, themeName: "github", initialCollapsedPaths: ["src/components"] }), { width: 60, height: 5 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        expect(frame).toContain("src/components");
+        expect(frame).not.toContain("Button.tsx");
+        expect(frame).not.toContain("Input.tsx");
+    });
+    it("renders with active file inside collapsed folder", async () => {
+        const files = [
+            { path: "src/index.ts", status: "modified", additions: 5, deletions: 2, fileIndex: 0 },
+        ];
+        testSetup = await testRender(_jsx(DirectoryTreeView, { files: files, themeName: "github", initialCollapsedPaths: ["src"], activeFileIndex: 0 }), { width: 60, height: 3 });
+        globalThis.IS_REACT_ACT_ENVIRONMENT = false;
+        await testSetup.renderOnce();
+        const frame = testSetup.captureCharFrame();
+        // Folder is visible, file is hidden
+        expect(frame).toContain("src");
+        expect(frame).not.toContain("index.ts");
+    });
+});

package/dist/dropdown.d.ts

@@ -0,0 +1,26 @@
+import React, { type ReactNode } from "react";
+import { type ResolvedTheme } from "./themes";
+export interface DropdownOption {
+    title: string;
+    value: string;
+    icon?: ReactNode;
+    keywords?: string[];
+    label?: string;
+}
+export interface DropdownProps {
+    id?: string;
+    tooltip?: string;
+    placeholder?: string;
+    selectedValues?: string[];
+    itemsPerPage?: number;
+    options: DropdownOption[];
+    onChange?: (newValue: string) => void;
+    onFocus?: (value: string) => void;
+    onEscape?: () => void;
+    theme: ResolvedTheme;
+}
+export declare function filterDropdownOptions(options: DropdownOption[], searchText: string): DropdownOption[];
+declare const Dropdown: (props: DropdownProps) => React.ReactNode;
+export default Dropdown;
+export { Dropdown };
+//# sourceMappingURL=dropdown.d.ts.map

package/dist/dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../src/dropdown.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAA4C,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAGxF,OAAO,EAAE,KAAK,aAAa,EAAa,MAAM,UAAU,CAAC;AAEzD,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,aAAa;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,OAAO,EAAE,cAAc,EAAE,CAAC;IAC1B,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,KAAK,EAAE,aAAa,CAAC;CACtB;AAED,wBAAgB,qBAAqB,CAAC,OAAO,EAAE,cAAc,EAAE,EAAE,UAAU,EAAE,MAAM,GAAG,cAAc,EAAE,CAerG;AAED,QAAA,MAAM,QAAQ,GAAI,OAAO,aAAa,KAAG,KAAK,CAAC,SA+M9C,CAAC;AAqFF,eAAe,QAAQ,CAAC;AACxB,OAAO,EAAE,QAAQ,EAAE,CAAC"}