@aaqu/fromcubes-portal-react 0.1.0-alpha.3 → 0.1.0-alpha.30

package/package.json

@@ -1,18 +1,20 @@
 {
   "name": "@aaqu/fromcubes-portal-react",
-  "version": "0.1.0-alpha.3",
-  "description": "Fromcubes Portal - React for Node-RED",
+  "version": "0.1.0-alpha.30",
+  "description": "Fromcubes Portal - React for Node-RED with Tailwind CSS and auto complete",
+  "type": "commonjs",
   "keywords": [
     "node-red",
-    "react",
     "dashboard",
     "portal",
     "jsx",
+    "react",
     "tailwind",
     "websocket",
     "fromcubes"
   ],
   "node-red": {
+    "version": ">=4.0.0",
     "nodes": {
       "portal-react": "nodes/portal-react.js"
     }
@@ -20,27 +22,55 @@
   "files": [
     "nodes/",
     "examples/",
-    "scripts/",
     "README.md",
+    "AI-GUIDE.md",
     "LICENSE"
   ],
   "engines": {
-    "node": ">=18"
+    "node": ">=18.5"
   },
   "dependencies": {
-    "esbuild": "0.25.0",
+    "esbuild": "^0.28.1",
     "monaco-editor": "^0.55.1",
-    "tailwindcss": "^4.0.0"
+    "react": "^19.2.5",
+    "react-dom": "^19.2.5",
+    "tailwindcss": "^4.2.4"
+  },
+  "peerDependencies": {
+    "ws": "^8.21.0"
+  },
+  "peerDependenciesMeta": {
+    "ws": {
+      "optional": false
+    }
   },
   "devDependencies": {
-    "prettier": "^3.8.1",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0"
+    "jsdoc": "^4.0.5",
+    "jsdoc-plugin-typescript": "^3.2.1",
+    "node-red": "5.0.0",
+    "node-red-node-test-helper": "^0.3.4",
+    "prettier": "^3.8.3",
+    "supertest": "^7.2.2",
+    "vitest": "^4.1.6",
+    "ws": "^8.21.0"
+  },
+  "overrides": {
+    "dompurify": "3.4.11"
   },
   "scripts": {
-    "build": "node scripts/bundle-react.js",
-    "start": "node-red"
+    "start": "node-red",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "docs": "jsdoc -c jsdoc.json"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Aaqu/fromcubes-portal-react.git"
+  },
+  "bugs": {
+    "url": "https://github.com/Aaqu/fromcubes-portal-react/issues"
   },
+  "homepage": "https://github.com/Aaqu/fromcubes-portal-react#readme",
   "license": "Apache-2.0",
   "author": "aaqu",
   "publishConfig": {

package/examples/sensor-portal-flow.json

@@ -1,71 +0,0 @@
-[
-  {
-    "id": "fc-demo-flow",
-    "type": "tab",
-    "label": "Portal React Demo",
-    "disabled": false
-  },
-  {
-    "id": "fc-inject",
-    "type": "inject",
-    "z": "fc-demo-flow",
-    "name": "Sensor tick",
-    "props": [{ "p": "payload" }],
-    "repeat": "2",
-    "payload": "{}",
-    "payloadType": "json",
-    "x": 160,
-    "y": 160,
-    "wires": [["fc-rand"]]
-  },
-  {
-    "id": "fc-rand",
-    "type": "function",
-    "z": "fc-demo-flow",
-    "name": "Random sensors",
-    "func": "msg.payload = {\n  temp: +(18 + Math.random() * 12).toFixed(1),\n  humidity: Math.round(35 + Math.random() * 40),\n  pressure: Math.round(995 + Math.random() * 35),\n  ts: Date.now()\n};\nreturn msg;",
-    "outputs": 1,
-    "x": 360,
-    "y": 160,
-    "wires": [["fc-portal"]]
-  },
-  {
-    "id": "fc-gauge-comp",
-    "type": "fc-portal-component",
-    "z": "fc-demo-flow",
-    "name": "Gauge",
-    "compName": "Gauge",
-    "compCode": "function Gauge({ value = 0, min = 0, max = 100, label = '', unit = '' }) {\n  const pct = Math.min(100, Math.max(0, ((value - min) / (max - min)) * 100));\n  const color = pct > 80 ? 'text-red-400' : pct > 50 ? 'text-amber-400' : 'text-green-400';\n  const bg = pct > 80 ? 'from-red-500' : pct > 50 ? 'from-amber-500' : 'from-green-500';\n  return (\n    <div className=\"flex flex-col items-center p-4\">\n      <div className=\"text-xs text-zinc-500 uppercase tracking-wider mb-2\">{label}</div>\n      <div className=\"relative w-28 h-28 rounded-full bg-zinc-900 flex items-center justify-center\">\n        <svg className=\"absolute inset-0 w-full h-full -rotate-90\" viewBox=\"0 0 100 100\">\n          <circle cx=\"50\" cy=\"50\" r=\"42\" fill=\"none\" strokeWidth=\"6\" className=\"stroke-zinc-800\" />\n          <circle cx=\"50\" cy=\"50\" r=\"42\" fill=\"none\" strokeWidth=\"6\"\n            className={`stroke-current ${color}`}\n            strokeDasharray={`${pct * 2.64} 264`}\n            strokeLinecap=\"round\" />\n        </svg>\n        <div className={`text-2xl font-bold ${color}`}>\n          {Math.round(value)}<span className=\"text-sm ml-0.5\">{unit}</span>\n        </div>\n      </div>\n    </div>\n  );\n}",
-    "compInputs": "value,min,max,label,unit",
-    "compOutputs": "",
-    "x": 160,
-    "y": 280,
-    "wires": []
-  },
-  {
-    "id": "fc-portal",
-    "type": "portal-react",
-    "z": "fc-demo-flow",
-    "name": "Sensor Portal",
-    "endpoint": "/sensors",
-    "pageTitle": "Sensors",
-    "customHead": "",
-    "inputSchema": "[{\"name\":\"temp\",\"type\":\"number\"},{\"name\":\"humidity\",\"type\":\"number\"},{\"name\":\"pressure\",\"type\":\"number\"},{\"name\":\"ts\",\"type\":\"number\"}]",
-    "outputSchema": "[{\"name\":\"action\",\"type\":\"string\"}]",
-    "componentCode": "function App() {\n  const { data, send } = useNodeRed();\n  const s = data || { temp: 0, humidity: 0, pressure: 0 };\n\n  return (\n    <div className=\"min-h-screen bg-zinc-950 p-8 max-w-3xl mx-auto\">\n      <h1 className=\"text-2xl font-light text-cyan-400 mb-6\">Sensor Portal</h1>\n      <div className=\"flex gap-6 flex-wrap\">\n        <Gauge value={s.temp} min={-10} max={50} label=\"Temperature\" unit=\"°C\" />\n        <Gauge value={s.humidity} min={0} max={100} label=\"Humidity\" unit=\"%\" />\n        <Gauge value={s.pressure} min={950} max={1050} label=\"Pressure\" unit=\"hPa\" />\n      </div>\n      <div className=\"mt-6 flex gap-3 items-center\">\n        <button\n          className=\"px-4 py-2 rounded-lg bg-blue-600 text-white hover:bg-blue-500 transition-colors\"\n          onClick={() => send({ action: 'refresh' })}\n        >Refresh</button>\n        {s.ts && <span className=\"text-zinc-600 text-xs\">Last: {new Date(s.ts).toLocaleTimeString()}</span>}\n      </div>\n    </div>\n  );\n}",
-    "x": 560,
-    "y": 160,
-    "wires": [["fc-debug"]]
-  },
-  {
-    "id": "fc-debug",
-    "type": "debug",
-    "z": "fc-demo-flow",
-    "name": "Portal output",
-    "active": true,
-    "tosidebar": true,
-    "x": 750,
-    "y": 160,
-    "wires": []
-  }
-]