@pumped-fn/lite-devtools-server 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License Copyright (c) 2025 Duke
+
+Permission is hereby granted, free of
+charge, to any person obtaining a copy of this software and associated
+documentation files (the "Software"), to deal in the Software without
+restriction, including without limitation the rights to use, copy, modify, merge,
+publish, distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to the
+following conditions:
+
+The above copyright notice and this permission notice
+(including the next paragraph) shall be included in all copies or substantial
+portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF
+ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO
+EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR
+OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

package/README.md

@@ -0,0 +1,66 @@
+# @pumped-fn/lite-devtools-server
+
+Standalone TUI server for receiving devtools events from `@pumped-fn/lite-devtools` via HTTP.
+
+## Architecture
+
+```mermaid
+graph LR
+    subgraph "Application Process"
+        App[Your App]
+        DT["@pumped-fn/lite-devtools"]
+        HTTP["httpTransport()"]
+    end
+
+    subgraph "Server Process"
+        Server["@pumped-fn/lite-devtools-server"]
+        TUI[Terminal Dashboard]
+    end
+
+    App -->|events| DT
+    DT -->|fire-and-forget| HTTP
+    HTTP -->|POST /events| Server
+    Server -->|renders| TUI
+```
+
+## Usage
+
+### Start the server
+
+```bash
+npx @pumped-fn/lite-devtools-server
+# Or with custom port
+PORT=4000 npx @pumped-fn/lite-devtools-server
+```
+
+### Configure your app
+
+```typescript
+import { createScope } from '@pumped-fn/lite'
+import { createDevtools, httpTransport } from '@pumped-fn/lite-devtools'
+
+const scope = createScope({
+  extensions: [
+    createDevtools({
+      transports: [httpTransport({ url: 'http://localhost:3001/events' })]
+    })
+  ]
+})
+```
+
+## API
+
+### HTTP Endpoints
+
+| Endpoint | Method | Description |
+|----------|--------|-------------|
+| `/events` | POST | Receive events from httpTransport |
+| `/events` | GET | Retrieve buffered events (last 100) |
+| `/health` | GET | Health check |
+
+## How It Works
+
+1. Server starts Hono HTTP server on specified port (default: 3001)
+2. Events POSTed to `/events` are buffered (max 100 events)
+3. TUI dashboard displays last 20 events in real-time
+4. Uses `@pumped-fn/lite` atoms for reactive state management

package/dist/bin.cjs

@@ -0,0 +1,26 @@
+const require_ui = require('./ui-Dj5OAu7J.cjs');
+let __opentui_core = require("@opentui/core");
+let __opentui_react_jsx_runtime = require("@opentui/react/jsx-runtime");
+let __hono_node_server = require("@hono/node-server");
+let __opentui_react = require("@opentui/react");
+
+//#region src/bin.tsx
+const PORT = process.env.PORT ? parseInt(process.env.PORT, 10) : 3001;
+async function main() {
+	await require_ui.scope.ready;
+	await require_ui.scope.resolve(require_ui.eventsAtom);
+	(0, __hono_node_server.serve)({
+		fetch: require_ui.createApp(require_ui.scope.controller(require_ui.eventsAtom)).fetch,
+		port: PORT
+	}, (info) => {
+		console.log(`HTTP server listening on http://localhost:${info.port}`);
+	});
+	try {
+		(0, __opentui_react.createRoot)(await (0, __opentui_core.createCliRenderer)()).render(/* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)(require_ui.App, { port: PORT }));
+	} catch {
+		console.log("TUI unavailable, running headless");
+	}
+}
+main().catch(console.error);
+
+//#endregion

package/dist/bin.d.cts

@@ -0,0 +1 @@
+export { };

package/dist/bin.d.mts

@@ -0,0 +1 @@
+export { };

package/dist/bin.mjs

@@ -0,0 +1,27 @@
+import { i as createApp, n as eventsAtom, r as scope, t as App } from "./ui-CVLj3SJk.mjs";
+import { createCliRenderer } from "@opentui/core";
+import { jsx } from "@opentui/react/jsx-runtime";
+import { serve } from "@hono/node-server";
+import { createRoot } from "@opentui/react";
+
+//#region src/bin.tsx
+const PORT = process.env.PORT ? parseInt(process.env.PORT, 10) : 3001;
+async function main() {
+	await scope.ready;
+	await scope.resolve(eventsAtom);
+	serve({
+		fetch: createApp(scope.controller(eventsAtom)).fetch,
+		port: PORT
+	}, (info) => {
+		console.log(`HTTP server listening on http://localhost:${info.port}`);
+	});
+	try {
+		createRoot(await createCliRenderer()).render(/* @__PURE__ */ jsx(App, { port: PORT }));
+	} catch {
+		console.log("TUI unavailable, running headless");
+	}
+}
+main().catch(console.error);
+
+//#endregion
+export {  };

package/dist/index.cjs

@@ -0,0 +1,6 @@
+const require_ui = require('./ui-Dj5OAu7J.cjs');
+
+exports.App = require_ui.App;
+exports.createApp = require_ui.createApp;
+exports.eventsAtom = require_ui.eventsAtom;
+exports.scope = require_ui.scope;

package/dist/index.d.cts

@@ -0,0 +1,22 @@
+import * as hono_types0 from "hono/types";
+import { Hono } from "hono";
+import { Devtools } from "@pumped-fn/lite-devtools";
+import * as _pumped_fn_lite0 from "@pumped-fn/lite";
+import { Lite } from "@pumped-fn/lite";
+import { ReactNode } from "react";
+
+//#region src/server.d.ts
+declare function createApp(ctrl: Lite.Controller<Devtools.Event[]>): Hono<hono_types0.BlankEnv, hono_types0.BlankSchema, "/">;
+//#endregion
+//#region src/state.d.ts
+declare const eventsAtom: _pumped_fn_lite0.Lite.Atom<Devtools.Event[]>;
+declare const scope: _pumped_fn_lite0.Lite.Scope;
+//#endregion
+//#region src/ui.d.ts
+declare function App({
+  port
+}: {
+  port: number;
+}): ReactNode;
+//#endregion
+export { App, createApp, eventsAtom, scope };

package/dist/index.d.mts

@@ -0,0 +1,22 @@
+import { Hono } from "hono";
+import * as _pumped_fn_lite0 from "@pumped-fn/lite";
+import { Lite } from "@pumped-fn/lite";
+import * as hono_types0 from "hono/types";
+import { Devtools } from "@pumped-fn/lite-devtools";
+import { ReactNode } from "react";
+
+//#region src/server.d.ts
+declare function createApp(ctrl: Lite.Controller<Devtools.Event[]>): Hono<hono_types0.BlankEnv, hono_types0.BlankSchema, "/">;
+//#endregion
+//#region src/state.d.ts
+declare const eventsAtom: _pumped_fn_lite0.Lite.Atom<Devtools.Event[]>;
+declare const scope: _pumped_fn_lite0.Lite.Scope;
+//#endregion
+//#region src/ui.d.ts
+declare function App({
+  port
+}: {
+  port: number;
+}): ReactNode;
+//#endregion
+export { App, createApp, eventsAtom, scope };

package/dist/index.mjs

@@ -0,0 +1,3 @@
+import { i as createApp, n as eventsAtom, r as scope, t as App } from "./ui-CVLj3SJk.mjs";
+
+export { App, createApp, eventsAtom, scope };

package/dist/ui-CVLj3SJk.mjs

@@ -0,0 +1,108 @@
+import { Hono } from "hono";
+import { cors } from "hono/cors";
+import { atom, createScope } from "@pumped-fn/lite";
+import { ScopeProvider, useAtom } from "@pumped-fn/lite-react";
+import { TextAttributes } from "@opentui/core";
+import { jsx, jsxs } from "@opentui/react/jsx-runtime";
+
+//#region src/server.ts
+const MAX_EVENTS = 100;
+function createApp(ctrl) {
+	const app = new Hono();
+	app.use("*", cors());
+	app.post("/events", async (c) => {
+		try {
+			const newEvents = await c.req.json();
+			ctrl.update((prev) => {
+				const next = prev.concat(newEvents);
+				return next.length > MAX_EVENTS ? next.slice(-MAX_EVENTS) : next;
+			});
+			return c.json({ ok: true });
+		} catch {
+			return c.json({ ok: false }, 400);
+		}
+	});
+	app.get("/health", (c) => c.json({ status: "ok" }));
+	app.get("/events", (c) => c.json(ctrl.get()));
+	return app;
+}
+
+//#endregion
+//#region src/state.ts
+const eventsAtom = atom({ factory: () => [] });
+const scope = createScope();
+
+//#endregion
+//#region src/ui.tsx
+function ReactTypeBridge({ children }) {
+	return /* @__PURE__ */ jsx(ScopeProvider, {
+		scope,
+		children
+	});
+}
+const ICONS = {
+	"atom:resolve": "⚡",
+	"atom:resolved": "✓",
+	"flow:exec": "▶",
+	"flow:complete": "✓",
+	error: "✗"
+};
+function formatEvent(event) {
+	const time = new Date(event.timestamp).toISOString().slice(11, 23);
+	const duration = event.duration ? ` (${event.duration.toFixed(1)}ms)` : "";
+	return `[${time}] ${ICONS[event.type]} ${event.type.padEnd(14)} ${event.name}${duration}`;
+}
+function EventList() {
+	const events = useAtom(eventsAtom);
+	if (events.length === 0) return /* @__PURE__ */ jsx("text", {
+		fg: "gray",
+		children: "Waiting for events..."
+	});
+	return /* @__PURE__ */ jsx("box", {
+		flexDirection: "column",
+		children: events.slice(-20).map((e) => /* @__PURE__ */ jsx("text", {
+			fg: e.type === "error" ? "red" : "white",
+			children: formatEvent(e)
+		}, e.id))
+	});
+}
+function StatusBar({ port }) {
+	return /* @__PURE__ */ jsxs("text", {
+		fg: "cyan",
+		children: [
+			"Port: ",
+			port,
+			" | Events: ",
+			useAtom(eventsAtom).length
+		]
+	});
+}
+function Content({ port }) {
+	return /* @__PURE__ */ jsxs("box", {
+		flexDirection: "column",
+		padding: 1,
+		children: [
+			/* @__PURE__ */ jsx("text", {
+				attributes: TextAttributes.BOLD,
+				fg: "green",
+				children: "Lite Devtools Server"
+			}),
+			/* @__PURE__ */ jsx("box", {
+				marginTop: 1,
+				flexDirection: "column",
+				flexGrow: 1,
+				children: /* @__PURE__ */ jsx(EventList, {})
+			}),
+			/* @__PURE__ */ jsx("box", {
+				marginTop: 1,
+				children: /* @__PURE__ */ jsx(StatusBar, { port })
+			})
+		]
+	});
+}
+function App({ port }) {
+	return /* @__PURE__ */ jsx(ReactTypeBridge, { children: /* @__PURE__ */ jsx(Content, { port }) });
+}
+
+//#endregion
+export { createApp as i, eventsAtom as n, scope as r, App as t };

package/dist/ui-Dj5OAu7J.cjs

@@ -0,0 +1,131 @@
+let hono = require("hono");
+let hono_cors = require("hono/cors");
+let __pumped_fn_lite = require("@pumped-fn/lite");
+let __pumped_fn_lite_react = require("@pumped-fn/lite-react");
+let __opentui_core = require("@opentui/core");
+let __opentui_react_jsx_runtime = require("@opentui/react/jsx-runtime");
+
+//#region src/server.ts
+const MAX_EVENTS = 100;
+function createApp(ctrl) {
+	const app = new hono.Hono();
+	app.use("*", (0, hono_cors.cors)());
+	app.post("/events", async (c) => {
+		try {
+			const newEvents = await c.req.json();
+			ctrl.update((prev) => {
+				const next = prev.concat(newEvents);
+				return next.length > MAX_EVENTS ? next.slice(-MAX_EVENTS) : next;
+			});
+			return c.json({ ok: true });
+		} catch {
+			return c.json({ ok: false }, 400);
+		}
+	});
+	app.get("/health", (c) => c.json({ status: "ok" }));
+	app.get("/events", (c) => c.json(ctrl.get()));
+	return app;
+}
+
+//#endregion
+//#region src/state.ts
+const eventsAtom = (0, __pumped_fn_lite.atom)({ factory: () => [] });
+const scope = (0, __pumped_fn_lite.createScope)();
+
+//#endregion
+//#region src/ui.tsx
+function ReactTypeBridge({ children }) {
+	return /* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)(__pumped_fn_lite_react.ScopeProvider, {
+		scope,
+		children
+	});
+}
+const ICONS = {
+	"atom:resolve": "⚡",
+	"atom:resolved": "✓",
+	"flow:exec": "▶",
+	"flow:complete": "✓",
+	error: "✗"
+};
+function formatEvent(event) {
+	const time = new Date(event.timestamp).toISOString().slice(11, 23);
+	const duration = event.duration ? ` (${event.duration.toFixed(1)}ms)` : "";
+	return `[${time}] ${ICONS[event.type]} ${event.type.padEnd(14)} ${event.name}${duration}`;
+}
+function EventList() {
+	const events = (0, __pumped_fn_lite_react.useAtom)(eventsAtom);
+	if (events.length === 0) return /* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)("text", {
+		fg: "gray",
+		children: "Waiting for events..."
+	});
+	return /* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)("box", {
+		flexDirection: "column",
+		children: events.slice(-20).map((e) => /* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)("text", {
+			fg: e.type === "error" ? "red" : "white",
+			children: formatEvent(e)
+		}, e.id))
+	});
+}
+function StatusBar({ port }) {
+	return /* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsxs)("text", {
+		fg: "cyan",
+		children: [
+			"Port: ",
+			port,
+			" | Events: ",
+			(0, __pumped_fn_lite_react.useAtom)(eventsAtom).length
+		]
+	});
+}
+function Content({ port }) {
+	return /* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsxs)("box", {
+		flexDirection: "column",
+		padding: 1,
+		children: [
+			/* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)("text", {
+				attributes: __opentui_core.TextAttributes.BOLD,
+				fg: "green",
+				children: "Lite Devtools Server"
+			}),
+			/* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)("box", {
+				marginTop: 1,
+				flexDirection: "column",
+				flexGrow: 1,
+				children: /* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)(EventList, {})
+			}),
+			/* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)("box", {
+				marginTop: 1,
+				children: /* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)(StatusBar, { port })
+			})
+		]
+	});
+}
+function App({ port }) {
+	return /* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)(ReactTypeBridge, { children: /* @__PURE__ */ (0, __opentui_react_jsx_runtime.jsx)(Content, { port }) });
+}
+
+//#endregion
+Object.defineProperty(exports, 'App', {
+  enumerable: true,
+  get: function () {
+    return App;
+  }
+});
+Object.defineProperty(exports, 'createApp', {
+  enumerable: true,
+  get: function () {
+    return createApp;
+  }
+});
+Object.defineProperty(exports, 'eventsAtom', {
+  enumerable: true,
+  get: function () {
+    return eventsAtom;
+  }
+});
+Object.defineProperty(exports, 'scope', {
+  enumerable: true,
+  get: function () {
+    return scope;
+  }
+});

package/package.json

@@ -0,0 +1,53 @@
+{
+  "name": "@pumped-fn/lite-devtools-server",
+  "version": "0.1.0",
+  "description": "Standalone TUI devtools server for @pumped-fn/lite",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.cts",
+  "bin": {
+    "lite-devtools-server": "./dist/bin.mjs"
+  },
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "@hono/node-server": "^1.13.8",
+    "@opentui/core": "^0.1.59",
+    "@opentui/react": "^0.1.59",
+    "hono": "^4.7.0",
+    "react": "^19.0.0",
+    "@pumped-fn/lite": "1.7.0",
+    "@pumped-fn/lite-react": "1.0.0"
+  },
+  "devDependencies": {
+    "@types/node": "^20.19.22",
+    "@types/react": "^19.0.0",
+    "tsdown": "^0.17.2",
+    "tsx": "^4.19.4",
+    "typescript": "^5.9.3",
+    "vitest": "^4.0.15",
+    "@pumped-fn/lite-devtools": "1.1.0"
+  },
+  "license": "MIT",
+  "scripts": {
+    "build": "tsdown",
+    "typecheck": "tsc --noEmit",
+    "test": "vitest run",
+    "dev": "tsx src/bin.tsx",
+    "demo": "tsx examples/demo.ts"
+  }
+}