Open Source React Components

SVAR offers feature-rich UI components to build interactive React apps faster.
Lightweight, blazing-fast, and ready to integrate in minutes.

  • Gantt
  • DataGrid
widget preview

Go to Gantt page

SVAR Gantt is a React component for creating nice-looking, interactive Gantt charts.
  • drag-and-drop UI
  • highly-customizable
  • intuitive task editing
  • task dependencies
widget preview

Go to DataGrid page

SVAR DataGrid is a high-performance data table component, equipped with dynamic loading
  • tree data view
  • built-in context menu
  • in-cell editing
  • fixed columns

More React Components Coming

We're planning to introduce the following React components shortly so you'll be able to use ready made, well-tested UI blocks instead of developing this functionality from scratch.

Editor

This React component simplifies the process of creating custom forms for editing structured content on a web page. Choose between a popup view for focused editing or a smooth sidebar integration for seamless workflow.

File Manager

SVAR File Manager is a UI component designed to help developers and users manage files and folders within a React-based web application. It provides a visual representation of the file system, allowing users to navigate, organize, upload, download, delete files, and perform other file-related operations.

Kanban

SVAR Kanban is a ready-to-use React component that helps you seamlessly integrate project task boards into your web app. With its responsive drag-and-drop interface, users can effectively manage tasks and monitor work progress with ease.

Pivot

SVAR Pivot for React is a UI widget designed for summarizing, analyzing, and presenting large datasets in a structured tabular format. Just like other SVAR components, Pivot offers high customization and swift performance even with extensive datasets.

Event Calendar

If you need scheduling functionality for your web app, SVAR Event Calendar for React is a great choice. The component allows users to arrange events in day, week, month, year and agenda views. It can be used to schedule meetings and appointments and as a booking calendar.

ToDo List

This React UI component adds an editable task list to a web page and allows users to plan and organize their activities and tasks. SVAR ToDo List's functionality includes task addition, editing, removal, as well as setting due dates, related projects, or custom details to each task.

Filter Builder

SVAR React Filter is a flexible query builder component for adding filtering to large datasets in React apps. Create simple filters or build advanced filter bars with nested fields and multiple conditions using AND/OR logic.

Sign up for SVAR React news

  • Get notified when the new SVAR React UI component is released!
  • Be the first to try the product and share valuable feedback.
  • We respect your inbox - no spam, just valuable content.

Why Choose SVAR?

Get started easily

Take a quick start with SVAR UI components: browse our well crafted documentation, API reference and follow step-by-step instructions to start building modern looking, responsive web UIs.

Take control over look and feel

With robust customization capabilities, you have the freedom to tailor the components' appearance and behavior to fully match your development requirements.

Seamlessly integrate with React

SVAR React components can be effortlessly integrated with any React project, as well as various JavaScript libraries, frameworks, and backend technologies.

Use on desktop or touch screens

With full cross-platform and touch screen support, you can be sure that your SVAR-based web app runs smoothly on different devices. The components are aligned adaptively based on the screen size.

Try blazing fast performance

SVAR React UI components empower your web applications to handle large volumes of data effortlessly, guaranteeing fast rendering speeds for any dataset.

Use our professional services

In addition to our free community forum, we can provide timely email support to help you with SVAR React components. Contact us to learn more about our integration and customization services.

Need Plain JS Components?

Frequently Asked Questions

What is SVAR for React?

SVAR for React is a growing React UI component library designed for building modern, data-intensive web applications. We're focusing on providing advanced, open-source React components and widgets like DataGrid, Gantt Chart, and more.

Are SVAR React UI components open-source or commercial?

SVAR React components are available under free, open-source licenses:

  • DataGrid - under MIT license;
  • Gantt chart - under GPLv3 (contact us if you would like to use SVAR React Gantt in a commercial, non-open source project).

Are SVAR components ready for enterprise-grade applications?

Absolutely. SVAR React is built with enterprise needs in mind, offering powerful features, responsive design, and the ability to handle complex, data-intensive workflows. The library is actively maintained and well-documented. We're committed to delivering ongoing updates and new components to support long-term production use.

Will SVAR React components remain free, or are you going to change it to paid?

All current versions of SVAR React components will remain free and open-source under their current licenses (GPLv3 for the Gantt chart, MIT for all others).

What makes SVAR different from other React component libraries?

Unlike general-purpose UI kits like MUI or Ant Design, SVAR focuses on enterprise-level React components for data-heavy and complex interfaces. It offers performance-optimized components such as Gantt Chart and advanced Grids that are rarely found in typical UI libraries.

What version of React is supported?

SVAR React components are compatible with React 18 and follow best practices to ensure forward compatibility. Support for React 19 is coming in the next update.

What about TypeScript support?

We understand the importance of TypeScript support for modern web app development and are working on adding this feature to all SVAR components. You can already use SVAR in TypeScript projects today, though some components may not yet provide full type safety.

How do I install SVAR UI components in my React project?

It's really easy to start with SVAR React components:

  • Visit the official documentation
  • Explore the demos and their source code available on SVAR's GitHub: DataGrid and Gantt demos.
  • Install the packages via npm.
  • Integrate components into your React application as described in the docs.

How can I report a bug or request a feature?

You can report issues or request features by opening an issue on our GitHub page. We also have a community forum where you can post your questions or suggestions and receive replies from fellow developers or our tech team.

Is priority support available for SVAR?

If you would like to receive priority ticket support for SVAR components, please contact us. We will offer you paid support plans based on your requirements.

Do you provide customization services?

Yes, if you would like us to customize the components for your app needs or implement a custom feature, feel free to contact us. We will review your request and send you a proposal.

How will I know when an update or new component is released?

You can subscribe to our newsletter. We only send occasional updates about new features and releases of SVAR React, no spam. You can also follow us on GitHub, X (formerly Twitter), Blsky, or LinkedIn to stay informed.

Recent Releases