El repositorio de componentes de Flow: 146 componentes, el catálogo y el tester
totaljs/flowstreamcomponents contiene los componentes de código abierto que ofrece el editor de Flow. En la revisión documentada aquí (e34d283) tiene 146 componentes en components/, 32 más antiguos guardados en archived/, el generador del catálogo (db.js), el propio catálogo (db.json) y un tester.
Qué cubre el catálogo
Los componentes están organizados en grupos. Algunos de los más grandes:
| Grupo | Componentes (ejemplos) |
|---|---|
| Common (40) | delay, print, counter, switch, merge, code, request, throttle, transform, macro, modify, stringoperations |
| Total.js (17) | taction, troute, tschema, tcors, tresponse, tauthtoken, twebsocketroute, tuploadedfiles, tsql, querybuilderpg |
| Total.js API Services (13) | tapiocrapi, tapigeoipapi, tapiweatherapi, tapismsapi, tapichatgptapi, tapiinvoiceparserapi, tapicheckvatapi, tapiprintapi |
| Databases (8) | postgresql, mysql, sqlite3, mongodb-query, mongodb-insert, influxdb, nosql, localstorage |
| Triggers (7) | timer, trigger, crontab, minutely, notify |
| Files (6) | filewriter, filewatcher, fileswatcher, fsrename, fstouch, fsunlink |
| Flow, FlowStream, Stats, Checks, Security... | debug, flowstats, input, output, publish, subscribe, stopwatch, checkurl, checklog, checkfreespace, totp, iplimiter |
| MQTT, AI, Ollama | mqtt-broker, mqtt-publish, mqtt-subscribe, aiagent, aitool, aicontext, chatgpt, ollamaprompt, ollamals, ollamawebsearch |
Además, hay componentes para analizar datos (xmlparser, dataparser, csvdataset, cheerio), fechas y zonas horarias (date, timezone, duration), texto y plantillas (tangular, qrcode), OAuth2 (oauth2), descargas (downloader, urldownload), notificaciones (sms, rssreader, openweather, googlesearch) y el hardware de Linux (nvidiasmi). La carpeta archived/ conserva la generación anterior de la familia (GPIO e I2C de Raspberry Pi, RabbitMQ, métricas del sistema) como referencia.
Cómo los encuentra Flow: db.json
Flow no descarga el HTML de cada componente. Descarga un catálogo, un archivo JSON (por defecto https://cdn.totaljs.com/flowstream/webcomponents/db.json, definido en los ajustes) con una entrada por componente:
{
"id": "taction",
"group": "Total.js",
"name": "Action",
"url": "https://cdn.totaljs.com/flowstream/webcomponents/taction.html",
"author": "Peter Širka | Total.js",
"icon": "ti ti-totaljs",
"color": "",
"version": "2",
"kind": "",
"readme": "This component creates similar functionality as Total.js Actions. ..."
}El editor muestra la lista con el readme y descarga la url del componente cuando lo añades. Para ofrecer tus propios componentes junto a los oficiales, publica tus archivos HTML y un db.json propio y escribe su dirección en el ajuste components2.
db.js genera el catálogo: lee cada archivo de components/, toma group, name, author, icon, color, version y kind de sus exports, toma el texto de <readme>, construye la url en la CDN y escribe db.json ordenado por nombre. Ejecútalo con Node.js después de añadir o cambiar un componente.
El tester
tester.js ejecuta un componente sin el editor y tests/ tiene ejemplos (counter.js, example.js, example-multiple.js, influxdb.js, sqlite3.js, trigger.js) y un readme.md con todas las opciones. Un test tiene este aspecto:
require('../tester')(async function(describe, done) {
await describe(function(test, next) {
let messages = 0;
let status = 0;
test.status = function(data) {
status = data;
};
test.input('Hello World!');
messages++;
setTimeout(function() {
test.ok(status === messages, 'Counting');
next();
}, 2000);
});
done();
});describe carga el componente, test.input(data) le envía un mensaje, test.output y test.message reciben lo que envía, test.configure({...}) cambia su configuración, test.trigger() llama a su trigger y test.ok() y test.fail() marcan el resultado. Para ejecutar todos los tests: cd flowstreamcomponents, npm install total4 una vez y node tester.js. El tester de esta revisión está escrito para Total.js 4 (require('total4')), como dice su readme.
Contribuir
El repositorio pide seguir las normas y guías de código de Total.js y su readme las enlaza; el contacto es info@totaljs.com. Para escribir un componente, consulta escribir un componente.