Sign in

SVAR UI

@svarwidgets.bsky.social
54 followers 13 following 116 posts

A collection of open-source, advanced UI components for Svelte, React, and Vue. Learn more, see demos and get started at svar.dev

PostsRepliesMedia
SVAR UI @svarwidgets.bsky.social · 24/09/2026
🌴 Building a project timeline on #React and #NextJS and already using TanStack Query from @tanstack.com ? SVAR React Gantt plugs into it with one subclass of the data provider – every write becomes an ordered, retried, and observable mutation. Read 👉 svar.dev/blog/using-s... #webdev #opensource
svar.dev
Using SVAR React Gantt with TanStack Query in Next.js
Connect SVAR React Gantt to TanStack Query in Next.js: retries, ordered writes, offline handling, and sync status with a RestDataProvider subclass.
010
SVAR UI @svarwidgets.bsky.social · 17/09/2026
🚀 SVAR Calendar v2.7 is here! The update is now available for #ReactJS, #Svelte, and #VueJS. What's new: • Mobile support • Excel import • Drag-in from outside • Dynamic loading • Editable recurring events • Timezone support • Undo/redo, and more! Explore the details 👉 svar.dev/blog/svar-ca...
000
SVAR UI @svarwidgets.bsky.social · 15/09/2026
🤯 Not every #ProjectManagement app needs a full-blown Gantt chart. Sometimes a Timeline, Calendar, or Kanban board does the job better. New on the SVAR blog: compare the top Gantt alternatives and find out when a #Gantt chart is actually worth the complexity. Read 👉 svar.dev/blog/gantt-c...
000
SVAR UI @svarwidgets.bsky.social · 04/09/2026
Vue developers don’t need wrappers. SVAR Vue is a set of complex UI components built for #Vuejs itself: ✅ Vue 3 native ✅ #TypeScript ready ✅ Open source core From simple form controls to a Gantt chart, data grid, event calendar, and more See: svar.dev/vue/
010
SVAR UI @svarwidgets.bsky.social · 03/09/2026
Love seeing how you use SVAR components! 🙌 Our user Fernando Humanes built a demo with SVAR #Svelte Calendar + #Tailwind + #daisyUI. We translated his tutorial to show that SVAR Svelte components play nice with other libraries. Read the post 👉 svar.dev/blog/svar-sv...
010
SVAR UI @svarwidgets.bsky.social · 28/08/2026
🗓️ Building a scheduling UI for your #React or #NextJS app? See our new tutorial that explains how to integrate the opensource SVAR React Calendar with Next.js – from setup to REST API for loading and saving events. Read step-by-step guide 👇 svar.dev/blog/how-to-... #webdev #opensource #frontend
svar.dev
How to Build an Event Calendar with Next.js and SVAR React Calendar
Build a Next.js event calendar with open-source SVAR React Calendar: drag-and-drop events, built-in editor, and REST backend.
020
SVAR UI @svarwidgets.bsky.social · 26/08/2026
Need task & project planning in your #React app? SVAR Gantt gives you a solid foundation with: • tasks & dependencies • customizable timelines • drag-n-drop scheduling • task editor • sorting & filtering • context menu & toolbar • #opensource MIT license 🔗 svar.dev/react/gantt/ #frontend #gantt
010
SVAR UI @svarwidgets.bsky.social · 21/08/2026
We're offering #AI tools that help your coding assistant work with SVAR UI components without generating outdated code or hallucinating APIs. Let your AI buddy learn SVAR with: ✅ MCP server ✅ Agent skills ✅ Context packs Learn more: docs.svar.dev/ai/
000
SVAR UI @svarwidgets.bsky.social · 20/08/2026
Looking for a Svelte UI library? SVAR Svelte Core helps you build dashboards, admin panels, internal tools and data-driven apps with prebuilt form controls, popups, menus, calendars & more. Check it out and give it a star ⭐️ github.com/svar-widgets... #svelte5 #uilibrary #webdev #opensource
github.com
GitHub - svar-widgets/core: SVAR Core library is a collection of essential UI components written with Svelte.
SVAR Core library is a collection of essential UI components written with Svelte. - svar-widgets/core
030
SVAR UI @svarwidgets.bsky.social · 18/08/2026
Building a Gantt chart in React? 📊 Our new tutorial walks through creating an interactive project timeline with #opensource SVAR React Gantt, including detailed explanations of how the API works. Get a working chart in minutes 👇 svar.dev/blog/how-to-... #react #reactjs #webdev #frontend #gantt
svar.dev
How to Build a Gantt Chart with React and SVAR Gantt
Learn to build a full-featured React Gantt chart with SVAR Gantt — dependencies, milestones, custom columns, and a task editor. Step-by-step tutorial with a live demo.
040
Reposted by SVAR UI
MadeWithVueJS @madewithvuejs.com · 17/08/2026
The @svarwidgets.bsky.social Vue Gantt chart component helps you build interactive drag & drop UIs to visualize and manage project timelines ✨ - madewithvuejs.com/svar-vue-gantt
021
SVAR UI @svarwidgets.bsky.social · 14/08/2026
🔧 Ever wondered how to build the same UI component for React, Vue, and Svelte? We built a blazing fast data grid for all 3 and here's what we've learned about frameworks and performance👇 svar.dev/blog/buildin... #reactjs #svelte #vuejs #webdev #javascript
svar.dev
Building a High-Performance Data Grid in React, Vue, and Svelte
We built the same data grid for React, Svelte, and Vue. Here's what we learned about performance, framework differences, and why the framework is the last thing you should blame when your app is slow.
020
Reposted by SVAR UI
MadeWithVueJS @madewithvuejs.com · 09/08/2026
This calendar by @svarwidgets.bsky.social is a customizable, interactive component for managing events & schedules in a drag & drop UI 📆 - madewithvuejs.com/svar-vue-cal...
021
SVAR UI @svarwidgets.bsky.social · 07/08/2026
🤔 Is React still the king in 2026? We compared React, Vue, and Svelte across adoption, DX, performance, AI tooling, governance, and more. Data-driven breakdown + practical recommendations 👇 svar.dev/blog/react-v... #reactjs #vuejs #svelte #webdev #frontend #javascript
040
SVAR UI @svarwidgets.bsky.social · 06/08/2026
⚡️Need a lightweight and high-performance data grid for your app? SVAR Svelte DataGrid uses row + column virtualization to keep large datasets responsive. See how fast 200k rows and columns perform: docs.svar.dev/svelte/grid/... #svelte5 #webdev #bigdata #javascript #opensource
040
SVAR UI @svarwidgets.bsky.social · 05/08/2026
Building a Gantt chart in Vue.js? Check out our new tutorial that helps you get started with #opensource SVAR Vue Gantt and build interactive project timelines without starting from scratch 👇 svar.dev/blog/build-v... #vue3 #vuejs #webdev #frontend #gantt
svar.dev
How to Build a Vue Gantt Chart for Project Timelines
Build a production-style Vue 3 Gantt: drag-and-drop tasks, dependencies, milestones, custom columns, and a sidebar editor — with SVAR Vue Gantt.
020
SVAR UI @svarwidgets.bsky.social · 31/07/2026
Need a modern React Calendar with Day, Week, and Month views? SVAR React Calendar is framework-native and TypeScript-ready 🗓️ PRO adds Year, Agenda, Timeline, and Resource views. See demo 👉 svar.dev/demos/react/... #reactjs #webdev #frontend #calendar #opensource
050
SVAR UI @svarwidgets.bsky.social · 30/07/2026
👥 With SVAR Vue Gantt, you can assign resources, balance workloads, visualize utilization, and manage individual work calendars – all inside the Gantt chart. Build resource planning tools with Vue 3. See 👉 svar.dev/vue/gantt/ #vuejs #gantt #projectmanagement #webdev #vue3
010
SVAR UI @svarwidgets.bsky.social · 28/07/2026
⭐️ We’re starting to build our presence on G2 and would love your feedback if you’ve used SVAR components in your projects. Good or critical – it all helps us improve and helps other developers decide if SVAR is a good fit. Share your experience: www.g2.com/products/sva... #svarui #opensource
010
SVAR UI @svarwidgets.bsky.social · 24/07/2026
Confused about which React state management library to pick? 🎯 We just published a review of all 4 paradigms: - Centralized stores: Redux, Zustand - Reactive proxies: MobX, Valtio - Atomic state: Jotai - State machines: XState Pros, cons, and when to choose each👇 #reactjs #webdev
svar.dev
React State Management: From Redux to Modern State Management Approaches
"From Redux to Zustand, MobX, Jotai, and XState — explore four major paradigms of React state management, their philosophies, trade-offs, and when to choose each approach."
010
SVAR UI @svarwidgets.bsky.social · 23/07/2026
SVAR Vue is not just another Vue component library. It is a set of enterprise-grade UI blocks for complex apps. DataGrid, Gantt, Calendar, Kanban, and more – built natively in Vue 3, open-source and MIT-licensed. Learn more 👉 svar.dev/vue/ #vuejs #opensource #frontend #vue3
020
SVAR UI @svarwidgets.bsky.social · 22/07/2026
Want to build a Gantt chart in Svelte? Our new tutorial shows how to create one with open-source SVAR Gantt, including: • Tasks & dependency links • Resource allocation • Inline editor & toolbar • Task tooltips Full tutorial 👉 svar.dev/blog/how-to-... #webdev #svelte5 #opensource #gantt
040
SVAR UI @svarwidgets.bsky.social · 17/07/2026
Managing Gantt chart state in React doesn't have to be messy. Our new post shows how SVAR React Gantt uses the "stateful island" pattern to stay fast internally while integrating cleanly with Redux. Read the post 👉 svar.dev/blog/svar-re... #reactjs #redux #webdev #gantt #opensource
svar.dev
Managing Gantt Chart State in React: How SVAR React Gantt Works with Redux
Learn how to integrate SVAR React Gantt with Redux. A practical guide covering the 'stateful island' model, minimal integration pattern, and event-driven synchronization.
030
SVAR UI @svarwidgets.bsky.social · 14/07/2026
Need a calendar component for your web app? We compared SVAR Calendar vs FullCalendar so you can see the difference. SVAR stands out with: • Native React, Svelte & Vue • Built-in event editor • Calendar grouping & filtering Read more 👉 svar.dev/blog/svar-ca... #reactjs #vuejs #svelte5 #opensource
svar.dev
SVAR Calendar vs FullCalendar: Which Calendar Fits Modern Apps?
Compare SVAR Calendar and FullCalendar across integration, customization, editing workflows, and business scheduling features for modern web apps.
030
SVAR UI @svarwidgets.bsky.social · 24/06/2026
New to SVAR component library - SVAR Kanban! Create drag-and-drop task boards for project workflows with built-in editing and easy backend integration. Available for Svelte, React, and Vue 🥳 Free core, PRO features for larger teams and enterprise apps. #svelte5 #reactjs #vuejs #opensource #kanban
svar.dev
SVAR Kanban: Interactive Task Board Component for Svelte, React, and Vue
Introducing SVAR Kanban: a framework-native task board component for Svelte, React, and Vue. Open-source core, with PRO features for large, complex boards.
040
SVAR UI @svarwidgets.bsky.social · 05/06/2026
🚀 SVAR Gantt PRO 2.7 is out for React, Svelte & Vue with resource planning and more! • Resource assignment & workload view • Individual calendars for tasks & resources • Task grouping • WBS codes • Export from CVS Read more 👇 svar.dev/blog/svar-ga... #gantt #svelte5 #reactjs #vuejs #webdev
020
SVAR UI @svarwidgets.bsky.social · 05/06/2026
🛠️ SVAR Core 2.6 & DataGrid 2.7 released for React, Svelte & Vue! • New Tooltip component • Unified CSS prop for all controls • Multiselect column filter • Pixel-based scroll control for datagrid Read more 👇 svar.dev/blog/svar-gr... #reactjs #svelte5 #vuejs #opensource #frontend #webdev
020
SVAR UI @svarwidgets.bsky.social · 29/05/2026
We're expanding our SVAR Vue library with a file manager component. It brings a familiar file explorer UI to Vue 3 apps – all file operations, split view, keyboard shortcuts, context menu, and more. MIT-licensed. More details 👉 svar.dev/blog/svar-vu... #vuejs #vue3 #opensource #frontend #webdev
030
SVAR UI @svarwidgets.bsky.social · 20/05/2026
🎉🗓️ SVAR Calendar is now available for React, Svelte & Vue! Perfect for booking systems, event calendars and scheduling apps. • Day, Week, Month views • Drag-n-drop UI • Multiple calendars • MIT core + PRO Release post + demos👇 svar.dev/blog/svar-ca... #reactjs #vuejs #svelte5 #opensource #ui
svar.dev
Event Calendar Component for React, Svelte & Vue is Here!
Native calendar components for React, Svelte, and Vue. Build Google Calendar‑style schedulers with drag‑and‑drop, multiple views, TypeScript support, and a PRO edition for advanced scheduling.
050
SVAR UI @svarwidgets.bsky.social · 11/05/2026
We shipped SVAR UI Skills: structured API knowledge for AI tools so they stop guessing and start generating correct code for SVAR UI components. Works with Claude Code, Cursor, Codex CLI. 👉 svar.dev/blog/svar-ui... #aicoding #webdev #javascript #CursorAI #ClaudeAI #Codex
svar.dev
Your AI Agent Doesn't Know SVAR UI. Fix That.
Stop AI agents from hallucinating SVAR UI component APIs. Use skills and context packs to generate accurate component code for SVAR React, Svelte, and Vue.
120
SVAR UI @svarwidgets.bsky.social · 07/05/2026
We're preparing to release a new SVAR component, a full-featured event calendar in Svelte, React, and Vue versions. The #opensource edition will include Day, Week, Month views and event editing via drag&drop or built-in form. Release is planned for next week! 🛠️ #svelte5 #reactjs #vuejs #webdev
050
SVAR UI @svarwidgets.bsky.social · 28/04/2026
We just released SVAR Vue Gantt, a fast Gantt chart component for #vuejs 🎉 • MIT-licensed core • Task & dependency management • Handles 10k+ tasks • Critical path, baselines, auto-scheduling (PRO) GitHub github.com/svar-widgets... Read more svar.dev/blog/svar-vu... #javascript #opensource #gantt
040
SVAR UI @svarwidgets.bsky.social · 17/04/2026
🚀 SVAR Vue DataGrid is out! Fast, feature-rich data grid for @vuejs.org apps with: • virtual scrolling • tree data • in-cell editing • sorting & filtering • accessibility Free on GitHub: github.com/svar-widgets... Read more: svar.dev/blog/svar-vu... #vue #vuejs #vue3 #opensource #datagrid
000
SVAR UI @svarwidgets.bsky.social · 13/04/2026
🎉 First SVAR Vue components are available! • Core - 30+ basic UI elements • Editor - configurable edit form • Filter - adds filtering capabilities, from simple filter bar to query builder & natural language search See the details 👇 svar.dev/blog/svar-vu... #vuejs #vue3 #opensource #webdev #svarui
svar.dev
SVAR Vue is Here with Core, Editor & Filter Components!
After building production-ready component libraries for Svelte and React, we're excited to announce the release of SVAR components for Vue 3.
030
SVAR UI @svarwidgets.bsky.social · 03/04/2026
🐰🌼 Hey, developers! The SVAR team wishes you a warm and restful Easter weekend. Enjoy the time with your loved ones, while we’re working on some exciting updates for this spring 😉 Happy Easter to those who celebrate! #svarui #webdev #easter2026
000
SVAR UI @svarwidgets.bsky.social · 27/03/2026
💫 SVAR #React Gantt v2.6 released with new powerful features: • Task filtering API • Query syntax + natural language filtering • Improved scroll & zoom behavior • Rollups (PRO) • Slack visualization (PRO) Learn more 👉 svar.dev/blog/svar-re... #reactjs #webdev #gantt #ganttchart #projectmanagement
SVAR React Gantt - Slack feature preview
020
SVAR UI @svarwidgets.bsky.social · 26/03/2026
✨New version of SVAR React components is here! • YouTrack-like filter input for structured queries • AI-powered natural language filtering • Custom cell editors & multiselect for DataGrid • Avatar component • Virtualized dropdowns Learn more👇 svar.dev/blog/svar-re... #reactjs #webdev #opensource
svar.dev
SVAR React Components Updates: Core & Filter v2.5, DataGrid v2.6
Latest SVAR React components update: AI-powered FilterQuery for natural language search, custom DataGrid editors, Avatar component, and virtualized dropdowns for better performance.
030
SVAR UI @svarwidgets.bsky.social · 23/03/2026
📣 Meet the new version 2.6 of SVAR #Svelte Gantt Chart component! What's new: • Tasks filtering • Query syntax + natural language filtering • Rollups (PRO) • Slack (float) visualization (PRO) Learn more in our blog 👉 svar.dev/blog/svar-sv... #svelte5 #gantt #webdev #ganttchart #svarui
svar.dev
SVAR Svelte Gantt v2.6: Smart Filtering, Rollups, Slack Visualization
SVAR Svelte Gantt v2.6: AI-powered task filtering, rollups for complex projects, slack visualization for schedule analysis, and improved scroll behavior.
010
SVAR UI @svarwidgets.bsky.social · 19/03/2026
🎉The new update for SVAR Svelte library is available! • New avatar component • Dynamic rendering for dropdowns • AI-powered natural language filtering • Custom cell editors & multiselect for data grid See the details 👉 svar.dev/blog/svar-sv... #svelte5 #webdev #opensource #uilibrary #svarui
svar.dev
SVAR Svelte Library Updates: Core & Filter v2.5, DataGrid v2.6
Discover the latest update for SVAR Svelte components: dynamic dropdowns, avatar component, AI-powered filtering with FilterQuery, and custom in-cell editors for DataGrid.
010
SVAR UI @svarwidgets.bsky.social · 17/03/2026
We benchmarked 6 popular React Gantt libraries across: • loading speed • scrolling • CRUD operations • live updates • memory usage 🏆 SVAR React Gantt wins at loading, CRUD ops & live updates! See the full breakdown 👇 svar.dev/blog/react-g... #react #webdev #benchmark #gantt #frontend
svar.dev
We Benchmarked Top React Gantt Chart Libraries So You Don't Have To
Comprehensive benchmark of 6 popular React Gantt chart libraries. Compare loading speed, CRUD operations, live updates, scrolling, and memory usage. Find out which library performs best.
010
SVAR UI @svarwidgets.bsky.social · 13/03/2026
Didn’t manage to finish your tasks today? Push it to Monday 😎 Even SVAR Gantt doesn’t count weekends in task durations, thanks to its non-linear calendar in the PRO Edition. See the demos: React 👉 svar.dev/demos/react/... Svelte 👉 svar.dev/demos/gantt/ #svelte #react #gantt #ganttchart #funfriday
010
SVAR UI @svarwidgets.bsky.social · 03/03/2026
Editing data in a table? Don’t worry about mistakes! SVAR DataGrid component for Svelte and React includes undo/redo feature so your users can update records fearlessly 😉 Learn more & see demos 👇 svar.dev/react/datagr... #react #svelte5 #opensource #datagrid #webdev
040
SVAR UI @svarwidgets.bsky.social · 19/02/2026
👀 Following our Next.js Gantt chart tutorial? Part 2 adds a backend with @nextjs.org API routes + SQLite: • REST CRUD endpoints • Persistent task storage • UI → server synchronization • Row/tasks reordering with DB updates Read it here 👉 svar.dev/blog/nextjs-... #nextjs #react #sqlite #gantt
svar.dev
Building a Gantt Chart in Next.js with SVAR React Gantt: Backend
Add backend persistence to your Next.js Gantt chart. Build REST API routes, connect SQLite database, and sync task changes automatically using SVAR React Gantt.
010
SVAR UI @svarwidgets.bsky.social · 18/02/2026
Developing with Svelte and tired of Tailwind everywhere? Try SVAR Svelte Core, a library of 30+ customizable UI components with pure CSS styling. Both dark & light themes available 🌓 Learn more & see demo👇 svar.dev/svelte/core/ #sveltejs #svelte #uilibrary #javascript #css
020
SVAR UI @svarwidgets.bsky.social · 16/02/2026
Working with @nextjs.org? Just published a tutorial on building a Gantt chart in Next.js apps with SVAR React Gantt. Covers SSR hydration issues, theme configuration, task editing, and making layouts work properly. Full demo on GitHub: github.com/svar-widgets... #NextJS #React #gantt #ganttchart
svar.dev
Building a Gantt Chart in Next.js with SVAR React Gantt
Learn how to add a high-performance Gantt chart to a Next.js (App Router) project using SVAR React Gantt. Step-by-step setup with styles, theming, layout fixes, and editing.
010
SVAR UI @svarwidgets.bsky.social · 12/02/2026
Build feature-rich React data tables in minutes with free, open-source SVAR React DataGrid. Follow this tutorial to build a table with: ☑️ sorting, filtering ☑️ in-cell editors ☑️ collapsible columns ☑️ checkbox selection 👉 svar.dev/blog/create-... #react #datatable #datagrid #opensource #howto
010
SVAR UI @svarwidgets.bsky.social · 09/02/2026
📖 SVAR React Gantt now has integration guides for popular state management libraries: • Redux • MobX • Zustand • XState • Jotai • Valtio Find the integration instructions in the docs ⬇️ docs.svar.dev/react/gantt/... #react #gantt #statemanagement #redux #mobx #zustand #webdev
000
SVAR UI @svarwidgets.bsky.social · 03/02/2026
📤 Version 2.5 brings export features to SVAR React Gantt PRO. Now you can export your Gantt chart to the following formats: - PDF - PNG - Excel - MS Project XML (export/import) Learn more about this update 👇 svar.dev/blog/react-g... #reactjs #gantt #msproject #pdf #png
000
Reposted by SVAR UI
MadeWithReactJS @madewithreactjs.com · 02/02/2026
Manage your tasks and their dependencies with this drag & drop Gantt chart component by @svarwidgets.bsky.social – it seamlessly integrates with your React apps 🧑‍💻⚡️ - madewithreactjs.com/svar-gantt-f...
001
SVAR UI @svarwidgets.bsky.social · 07/01/2026
🤖 AI assistants kept hallucinating our #React Gantt API, suggesting methods that don't exist. We fixed it with an MCP server + RAG pipeline. Here's how we built it with @llamaindex.bsky.social + @fastmc.bsky.social 👇 svar.dev/blog/mcp-ser... #MCP #RAG #AICoding
000