I just wanted to share a project I’ve been working on: Sveltago, a starter template for creating custom TagoIO widgets using Svelte 5 and SvelteKit. It comes with everything you need—TypeScript, TailwindCSS, and more—to jumpstart your widget development on TagoIO.
Why Svelte? It’s a lightweight, reactive framework that makes building dynamic interfaces simple and fun. The template is already set up to handle TagoIO’s data injection, and you can develop locally with mock data so you don’t have to wait on real devices. It features some debug buttons to log data into console and a simple table that loads the selected data variable.
I hope this helps anyone looking to build more sophisticated—or just plain fun—widgets for their TagoIO dashboards. Feedback, ideas, and pull requests are always welcome!
Thank you for sharing this custom widget. I’ve downloaded and tested it, and I particularly appreciate how the widget automatically saves the target URL, eliminating the need to manually add the initial file URL during the building process. The way you’ve designed this makes it much easier to modify according to specific requirements.
If I were to suggest an improvement, it would be to add the remaining necessary types to the tago.d.ts file. We have an existing tutorial that contains these types in our E-Charts Tutorial GitHub repository, which you’re welcome to use!
As per your feedback, I’ve included the types as seen in the linked tutorial. Additionally, I noticed that the _unit_ property was missing from the _WidgetVariableResultItem_ type. Since it’s commonly used to describe the measurement unit of a value (e.g., °C, kg, m/s), I added it as an optional field (_unit?: string_) in my local type definitions.
Please let me know if this aligns with the intended structure or if there are any additional updates I should make.