cdd-cli 2.0.0

package/.babelrc

@@ -0,0 +1,11 @@
+{
+  "presets": [
+    ["@babel/preset-env", { "modules": false }],
+    "@babel/preset-react"
+  ],
+  "plugins": [
+    ["module-resolver", {
+      "extensions": [".js", ".jsx", ".json"]
+    }]
+  ]
+}

package/README.md

@@ -0,0 +1,52 @@
+# CDD - CLI Docker Dashboard
+
+CDD es una herramienta de línea de comandos (CLI) construida con React e Ink para monitorear contenedores Docker de forma interactiva y visual en la terminal.
+
+## Características
+- Visualización en tiempo real de los contenedores Docker activos y detenidos.
+- Actualización automática del estado de los contenedores cada 2 segundos.
+- Interfaz amigable y colorida usando Ink y React.
+- Información mostrada: nombre, imagen, estado, puertos y estado textual de cada contenedor.
+- Mensaje de ayuda para salir fácilmente (`Press Ctrl+C to exit`).
+
+## Instalación
+1. Clona el repositorio y entra en la carpeta del proyecto.
+2. Instala las dependencias:
+   ```bash
+   npm install
+   ```
+3. Transpila el código fuente y corrige los imports:
+   ```bash
+   npm run build
+   ```
+4. Ejecuta el CLI:
+   ```bash
+   node dist/index.js
+   ```
+
+## Estructura del proyecto
+- `src/` - Código fuente en JSX/ESM.
+  - `App.jsx` - Componente principal.
+  - `dockerService.js` - Lógica para obtener los contenedores Docker.
+  - `components/` - Componentes visuales (`Header.jsx`, `ContainerRow.jsx`).
+- `dist/` - Código transpilado listo para Node.js.
+- `.babelrc` - Configuración de Babel para JSX y módulos ES.
+- `fix-imports.cjs` - Script post-build para corregir imports en dist/.
+- `package.json` - Scripts y dependencias.
+- `ERRORS.md` - Documentación de errores y soluciones.
+
+## Scripts útiles
+- `npm run build` - Transpila el código fuente y corrige los imports automáticamente.
+
+## Requisitos
+- Node.js 18+
+- Docker instalado y corriendo (el CLI se conecta al socket local de Docker)
+
+## Notas de desarrollo
+- Puedes escribir imports sin extensión en el código fuente (`import X from './X'`).
+- El flujo de build se encarga de que los imports sean válidos en Node.js.
+- Consulta `ERRORS.md` para ver el historial de problemas y soluciones.
+
+---
+
+CDD es ideal para desarrolladores que desean monitorear sus contenedores Docker de forma rápida y visual desde la terminal, aprovechando la potencia de React en el CLI.

package/dist/App.js

@@ -0,0 +1,66 @@
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
+function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
+function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+import React from "react";
+import { useState, useEffect } from "react";
+import { Box, Text, Spacer } from "ink";
+import { getContainers } from "./dockerService.js";
+import ContainerRow from "./components/ContainerRow.js";
+import Header from "./components/Header.js";
+export default function App() {
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    containers = _useState2[0],
+    setContainers = _useState2[1];
+  useEffect(function () {
+    var fetch = /*#__PURE__*/function () {
+      var _ref = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
+        var _t;
+        return _regenerator().w(function (_context) {
+          while (1) switch (_context.n) {
+            case 0:
+              _t = setContainers;
+              _context.n = 1;
+              return getContainers();
+            case 1:
+              return _context.a(2, _t(_context.v));
+          }
+        }, _callee);
+      }));
+      return function fetch() {
+        return _ref.apply(this, arguments);
+      };
+    }();
+    fetch();
+    var timer = setInterval(fetch, 3000);
+    return function () {
+      return clearInterval(timer);
+    };
+  }, []);
+  return /*#__PURE__*/React.createElement(Box, {
+    flexDirection: "column",
+    borderStyle: "round",
+    borderColor: "cyan",
+    padding: 1
+  }, /*#__PURE__*/React.createElement(Header, {
+    count: containers.length
+  }), /*#__PURE__*/React.createElement(Text, null, " "), containers.length === 0 ? /*#__PURE__*/React.createElement(Text, null, "No containers found") : containers.map(function (container) {
+    return /*#__PURE__*/React.createElement(ContainerRow, {
+      key: container.id,
+      container: container
+    });
+  }), /*#__PURE__*/React.createElement(Spacer, null), /*#__PURE__*/React.createElement(Box, {
+    marginTop: 1
+  }, /*#__PURE__*/React.createElement(Text, {
+    dimColor: true
+  }, "Press Ctrl+C to exit")), /*#__PURE__*/React.createElement(Text, {
+    dimColor: true
+  }, "Crafted by Carlos Cochero \u2022 2025"));
+}

package/dist/components/ContainerRow.js

@@ -0,0 +1,74 @@
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
+function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
+function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+import React, { useState, useEffect } from "react";
+import { Box, Text } from "ink";
+import chalk from "chalk";
+import { getStats } from "../dockerService.js";
+import StatsBar from "./StatsBar.js";
+var colorByState = function colorByState(state) {
+  if (state === "running") return chalk.greenBright("🟢 RUNNING");
+  if (state === "exited") return chalk.redBright("🔴 EXITED");
+  if (state === "paused") return chalk.yellowBright("🟠 PAUSED");
+  return chalk.gray(state.toUpperCase());
+};
+export default function ContainerRow(_ref) {
+  var container = _ref.container;
+  var id = container.id,
+    name = container.name,
+    image = container.image,
+    state = container.state;
+  var _useState = useState({
+      cpuPercent: 0,
+      memPercent: 0,
+      netIO: {
+        rx: 0,
+        tx: 0
+      }
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    stats = _useState2[0],
+    setStats = _useState2[1];
+  useEffect(function () {
+    if (state !== "running") return;
+    var fetchStats = /*#__PURE__*/function () {
+      var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
+        var s;
+        return _regenerator().w(function (_context) {
+          while (1) switch (_context.n) {
+            case 0:
+              _context.n = 1;
+              return getStats(id);
+            case 1:
+              s = _context.v;
+              setStats(s);
+            case 2:
+              return _context.a(2);
+          }
+        }, _callee);
+      }));
+      return function fetchStats() {
+        return _ref2.apply(this, arguments);
+      };
+    }();
+    fetchStats();
+    var timer = setInterval(fetchStats, 1500);
+    return function () {
+      return clearInterval(timer);
+    };
+  }, [id, state]);
+  return /*#__PURE__*/React.createElement(Box, {
+    flexDirection: "column",
+    marginBottom: 1
+  }, /*#__PURE__*/React.createElement(Text, null, chalk.cyan(name.padEnd(20)), " ", chalk.gray(image.padEnd(20)), " ", state === "running" ? chalk.greenBright("🟢 RUNNING") : chalk.redBright("\uD83D\uDD34 ".concat(state.toUpperCase()))), state === "running" && /*#__PURE__*/React.createElement(StatsBar, {
+    cpu: parseFloat(stats.cpuPercent),
+    mem: parseFloat(stats.memPercent)
+  }));
+}

package/dist/components/Header.js

@@ -0,0 +1,15 @@
+import React from "react";
+import { Box, Text } from "ink";
+import chalk from "chalk";
+export default function Header(_ref) {
+  var count = _ref.count;
+  return /*#__PURE__*/React.createElement(Box, {
+    justifyContent: "space-between"
+  }, /*#__PURE__*/React.createElement(Text, {
+    color: "cyanBright"
+  }, "\uD83D\uDC33 ", chalk.bold("CDD"), /*#__PURE__*/React.createElement(Text, {
+    color: "gray"
+  }, " \u2014 CLI Docker Dashboard")), /*#__PURE__*/React.createElement(Text, {
+    color: "gray"
+  }, count, " container", count === 1 ? "" : "s", " found"));
+}

package/dist/components/StatsBar.js

@@ -0,0 +1,22 @@
+import React from "react";
+import { Text } from "ink";
+import chalk from "chalk";
+export default function StatsBar(_ref) {
+  var cpu = _ref.cpu,
+    mem = _ref.mem;
+  var cpuBar = makeBar(cpu);
+  var memBar = makeBar(mem);
+  return /*#__PURE__*/React.createElement(Text, null, "CPU: ", cpuBar, " ", colorize(cpu), "%   MEM: ", memBar, " ", colorize(mem), "%");
+}
+function makeBar(value) {
+  var filled = Math.round(value / 10);
+  var empty = 10 - filled;
+  var bar = "▓".repeat(filled) + "░".repeat(empty);
+  return colorize(value, bar);
+}
+function colorize(value) {
+  var text = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : value.toString();
+  if (value < 50) return chalk.greenBright(text);
+  if (value < 80) return chalk.yellowBright(text);
+  return chalk.redBright(text);
+}

package/dist/dockerService.js

@@ -0,0 +1,85 @@
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i["return"]) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
+function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
+function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
+import Docker from 'dockerode';
+var docker = new Docker({
+  socketPath: '/var/run/docker.sock'
+});
+export function getContainers() {
+  return _getContainers.apply(this, arguments);
+}
+function _getContainers() {
+  _getContainers = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
+    var containers;
+    return _regenerator().w(function (_context) {
+      while (1) switch (_context.n) {
+        case 0:
+          _context.n = 1;
+          return docker.listContainers({
+            all: true
+          });
+        case 1:
+          containers = _context.v;
+          return _context.a(2, containers.map(function (container) {
+            return {
+              id: container.Id,
+              name: container.Names[0].replace('/', ''),
+              image: container.Image,
+              state: container.State,
+              status: container.Status,
+              ports: container.Ports.map(function (port) {
+                return "".concat(port.PublicPort || '', ":").concat(port.PrivatePort);
+              }).join(', ') || '-'
+            };
+          }));
+      }
+    }, _callee);
+  }));
+  return _getContainers.apply(this, arguments);
+}
+export function getStats(_x) {
+  return _getStats.apply(this, arguments);
+}
+function _getStats() {
+  _getStats = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2(containerId) {
+    var container, stream, cpuDelta, systemDelta, cpuPercent, memUsage, memLimit, memPercent, rx, tx;
+    return _regenerator().w(function (_context2) {
+      while (1) switch (_context2.n) {
+        case 0:
+          container = docker.getContainer(containerId);
+          _context2.n = 1;
+          return container.stats({
+            stream: false
+          });
+        case 1:
+          stream = _context2.v;
+          cpuDelta = stream.cpu_stats.cpu_usage.total_usage - stream.precpu_stats.cpu_usage.total_usage;
+          systemDelta = stream.cpu_stats.system_cpu_usage - stream.precpu_stats.system_cpu_usage;
+          cpuPercent = systemDelta > 0 ? cpuDelta / systemDelta * 100 : 0;
+          memUsage = stream.memory_stats.usage || 0;
+          memLimit = stream.memory_stats.limit || 1;
+          memPercent = memUsage / memLimit * 100;
+          rx = stream.networks ? Object.values(stream.networks).map(function (n) {
+            return n.rx_bytes;
+          }).reduce(function (a, b) {
+            return a + b;
+          }, 0) : 0;
+          tx = stream.networks ? Object.values(stream.networks).map(function (n) {
+            return n.tx_bytes;
+          }).reduce(function (a, b) {
+            return a + b;
+          }, 0) : 0;
+          return _context2.a(2, {
+            cpuPercent: cpuPercent.toFixed(1),
+            memPercent: memPercent.toFixed(1),
+            netIO: {
+              rx: rx,
+              tx: tx
+            }
+          });
+      }
+    }, _callee2);
+  }));
+  return _getStats.apply(this, arguments);
+}

package/dist/index.js

@@ -0,0 +1,5 @@
+#!/usr/bin/env node
+import React from "react";
+import { render } from "ink";
+import App from "./App.js";
+render(/*#__PURE__*/React.createElement(App, null));

package/fix-imports.cjs

@@ -0,0 +1,24 @@
+// Script para agregar automáticamente la extensión .js a los imports relativos en dist/
+const fs = require('fs');
+const path = require('path');
+
+function addJsExtensionToImports(filePath) {
+  let code = fs.readFileSync(filePath, 'utf8');
+  // Reemplaza imports relativos sin extensión por .js
+  code = code.replace(/(import\s+[^'";]+['"])(\.\/[^'".]+)(['"])/g, '$1$2.js$3');
+  code = code.replace(/(from\s+['"])(\.\/[^'".]+)(['"])/g, '$1$2.js$3');
+  fs.writeFileSync(filePath, code, 'utf8');
+}
+
+function processDir(dir) {
+  fs.readdirSync(dir).forEach(file => {
+    const fullPath = path.join(dir, file);
+    if (fs.statSync(fullPath).isDirectory()) {
+      processDir(fullPath);
+    } else if (file.endsWith('.js')) {
+      addJsExtensionToImports(fullPath);
+    }
+  });
+}
+
+processDir(path.join(__dirname, 'dist'));

package/package.json

@@ -0,0 +1,30 @@
+{
+  "name": "cdd-cli",
+  "version": "2.0.0",
+  "description": "CLI Docker Dashboard",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+  "build": "babel src --out-dir dist --extensions .js,.jsx && node fix-imports.cjs"
+  },
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "type": "module",
+  "dependencies": {
+    "chalk": "^5.6.2",
+    "dockerode": "^4.0.9",
+    "ink": "^6.3.1",
+    "react": "^19.2.0"
+  },
+  "bin": {
+    "cdd": "./dist/index.js"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.28.3",
+    "@babel/core": "^7.28.4",
+    "@babel/preset-env": "^7.28.3",
+    "@babel/preset-react": "^7.27.1",
+    "babel-plugin-module-resolver": "^5.0.2"
+  }
+}

package/src/App.jsx

@@ -0,0 +1,41 @@
+import React from "react";
+import { useState, useEffect } from "react";
+import { Box, Text, Spacer } from "ink";
+import { getContainers } from "./dockerService";
+import ContainerRow from "./components/ContainerRow";
+import Header from "./components/Header";
+
+export default function App() {
+  const [containers, setContainers] = useState([]);
+
+  useEffect(() => {
+    const fetch = async () => setContainers(await getContainers());
+    fetch();
+    const timer = setInterval(fetch, 3000);
+    return () => clearInterval(timer);
+  }, []);
+
+  return (
+    <Box
+      flexDirection="column"
+      borderStyle="round"
+      borderColor="cyan"
+      padding={1}
+    >
+      <Header count={containers.length} />
+      <Text> </Text>
+      {containers.length === 0 ? (
+        <Text>No containers found</Text>
+      ) : (
+        containers.map((container) => (
+          <ContainerRow key={container.id} container={container} />
+        ))
+      )}
+      <Spacer />
+      <Box marginTop={1}>
+        <Text dimColor>Press Ctrl+C to exit</Text>
+      </Box>
+      <Text dimColor>Crafted by Carlos Cochero • 2025</Text>
+    </Box>
+  );
+}

package/src/components/ContainerRow.jsx

@@ -0,0 +1,49 @@
+import React, { useState, useEffect } from "react";
+import { Box, Text } from "ink";
+import chalk from "chalk";
+import { getStats } from "../dockerService.js";
+import StatsBar from "./StatsBar";
+
+const colorByState = (state) => {
+  if (state === "running") return chalk.greenBright("🟢 RUNNING");
+  if (state === "exited") return chalk.redBright("🔴 EXITED");
+  if (state === "paused") return chalk.yellowBright("🟠 PAUSED");
+  return chalk.gray(state.toUpperCase());
+};
+
+export default function ContainerRow({ container }) {
+  const { id, name, image, state } = container;
+  const [stats, setStats] = useState({
+    cpuPercent: 0,
+    memPercent: 0,
+    netIO: { rx: 0, tx: 0 },
+  });
+
+  useEffect(() => {
+    if (state !== "running") return;
+    const fetchStats = async () => {
+      const s = await getStats(id);
+      setStats(s);
+    };
+    fetchStats();
+    const timer = setInterval(fetchStats, 1500);
+    return () => clearInterval(timer);
+  }, [id, state]);
+
+  return (
+    <Box flexDirection="column" marginBottom={1}>
+      <Text>
+        {chalk.cyan(name.padEnd(20))} {chalk.gray(image.padEnd(20))}{" "}
+        {state === "running"
+          ? chalk.greenBright("🟢 RUNNING")
+          : chalk.redBright(`🔴 ${state.toUpperCase()}`)}
+      </Text>
+      {state === "running" && (
+        <StatsBar
+          cpu={parseFloat(stats.cpuPercent)}
+          mem={parseFloat(stats.memPercent)}
+        />
+      )}
+    </Box>
+  );
+}

package/src/components/Header.jsx

@@ -0,0 +1,17 @@
+import React from "react";
+import { Box, Text } from "ink";
+import chalk from "chalk";
+
+export default function Header({ count }) {
+  return (
+    <Box justifyContent="space-between">
+      <Text color="cyanBright">
+        🐳 {chalk.bold("CDD")}
+        <Text color="gray"> — CLI Docker Dashboard</Text>
+      </Text>
+      <Text color="gray">
+        {count} container{count === 1 ? "" : "s"} found
+      </Text>
+    </Box>
+  );
+}

package/src/components/StatsBar.jsx

@@ -0,0 +1,27 @@
+import React from "react";
+import { Text } from "ink";
+import chalk from "chalk";
+
+export default function StatsBar({ cpu, mem }) {
+  const cpuBar = makeBar(cpu);
+  const memBar = makeBar(mem);
+
+  return (
+    <Text>
+      CPU: {cpuBar} {colorize(cpu)}%   MEM: {memBar} {colorize(mem)}%
+    </Text>
+  );
+}
+
+function makeBar(value) {
+  const filled = Math.round(value / 10);
+  const empty = 10 - filled;
+  const bar = "▓".repeat(filled) + "░".repeat(empty);
+  return colorize(value, bar);
+}
+
+function colorize(value, text = value.toString()) {
+  if (value < 50) return chalk.greenBright(text);
+  if (value < 80) return chalk.yellowBright(text);
+  return chalk.redBright(text);
+}

package/src/dockerService.js

@@ -0,0 +1,49 @@
+import Docker from 'dockerode';
+const docker = new Docker({ socketPath: '/var/run/docker.sock'});
+
+export async function getContainers() {
+    const containers = await
+docker.listContainers({ all: true });
+    return containers.map(container => ({
+        id: container.Id,
+        name: container.Names[0].replace('/', ''),
+        image: container.Image,
+        state: container.State,
+        status: container.Status,
+        ports: container.Ports.map(port => `${port.PublicPort
+            || '' }:${port.PrivatePort}`).join(', ') || '-'
+    }))
+}
+
+export async function getStats(containerId) {
+  const container = docker.getContainer(containerId);
+  const stream = await container.stats({ stream: false });
+  
+  const cpuDelta =
+    stream.cpu_stats.cpu_usage.total_usage -
+    stream.precpu_stats.cpu_usage.total_usage;
+  const systemDelta =
+    stream.cpu_stats.system_cpu_usage - stream.precpu_stats.system_cpu_usage;
+  const cpuPercent = systemDelta > 0 ? (cpuDelta / systemDelta) * 100 : 0;
+
+  const memUsage = stream.memory_stats.usage || 0;
+  const memLimit = stream.memory_stats.limit || 1;
+  const memPercent = (memUsage / memLimit) * 100;
+
+  const rx = stream.networks
+    ? Object.values(stream.networks)
+        .map(n => n.rx_bytes)
+        .reduce((a, b) => a + b, 0)
+    : 0;
+  const tx = stream.networks
+    ? Object.values(stream.networks)
+        .map(n => n.tx_bytes)
+        .reduce((a, b) => a + b, 0)
+    : 0;
+
+  return {
+    cpuPercent: cpuPercent.toFixed(1),
+    memPercent: memPercent.toFixed(1),
+    netIO: { rx, tx },
+  };
+}

package/src/index.js

@@ -0,0 +1,6 @@
+#!/usr/bin/env node
+import React from "react";
+import { render } from "ink";
+import App from './App';
+
+render(<App />);