Website · Community

Vaadin Add-ons

Badge List Responsive badge list component.	Carousel Vaadin Flow carousel component based on l2t-paper-slider.	Chat Assistant Multiselect component that displays selected values as labels.
Day of Week Selector Component to display the days of the week so they can be selected.	Error Window Error handler that displays a dialog with the catched exception information.	Extended Login Extends the Vaadin Login component adding new features.
Font Awesome Iconset Iconset based in FontAwesome	Google Maps Vaadin Flow Java API for Google Maps base on google-map web-component.	Grid Exporter Add-on that allows to export Vaadin's grid data to formats like Excel, Docx, PDF and CSV.
Grid Helpers A collection of recipes to improve the Vaadin Grid experience.	Image Crop Component for cropping images. Wrapper for React component react-image-crop.	Markdown Editor Component to edit and visualize markdown content. Wrapper for React component react-md-editor.
TwinColGrid TwinCol component based on Vaadin Grid.	Year/Month Calendar Full year/month calendar for Vaadin Flow.

AppLayout Vaadin Flow Java integration of Polymer's AppLayout.	Chip Field Multiselect component that displays selected values as labels.	Enhanced Tabs Enhanced Tabs component for Vaadin Flow.
OrgChart Add-on to render organizational charts based on OrgChart.	Simple Timer Simple Timer for Vaadin Flow based on Simple Timer Web Component.	XTerm Vaadin Flow integration of xterm.js terminal emulator.
Zoomist Wrapper component for Zoomist JavaScript Library that allows to apply zooming to images.

Filterable Layout Add-on that allows you to filter complex forms in realtime.	Flip Card Card component that can flip on hover or on click based on Flip Card Web Component.	GitHub Buttons Add-on that allows creation of three different types of GitHub Buttons to represent a given user/repository.
Granite Alert Vaadin Flow wrapper Granite Alert with themable support.	Image Comparison Slider Vaadin Flow Component for displaying two images side by side with a slider for comparing them.	Lite Renderer A Renderer for Vaadin Flow that uses a component instance as template, to use as an alternative to LitRenderer.
Locale ComboBox Vaadin ComboBox extension that allows to choose between multiple locales.	RSS Items Add-on to display rss item from a rss stream as a clickable thumbnail with a description.	Share Easy Easy social media sharing component.
Syntax Highlighter Wrapper around the React Syntax Highlighter component.	Upload Helper Provides a Flow API for manipulating the vaadin-upload-file element.	Vertical Menu Colorful Vertical Menu component.
WCStories Vaadin Flow integration of wc-stories library.	Whatsapp Button A simple button component to start Whatsapp conversations easily.

Libraries

Backend Core Collection of common interfaces and implementations designed to facilitate the application of clean architectural principles in enterprise software development.

Commons Demo Library that provides UI classes to display code examples and, optionally, their corresponding source code. Used in Flowing Code Add-ons demos.

RPC for Vaadin TestBench Provides support for calling Server-Side methods from Vaadin TestBench integration tests.

Tutorials & Examples

AppLayout + Hilla Example application on how to use our AppLayout Add-on with Hilla Framework.	Reactive Crypto Demo application to display crypto currencies trades price in realtime using Vaadin Flow and Spring Reactive WebSockets API.	Lazy, Filtered and Sorted Vaadin Grid Demo application on how to implement lazy loading, filtering and sorting in Vaadin Grid.
Lazy, Filtered and Sorted Vaadin TreeGrid Demo application on how to implement lazy loading, filtering and sorting in Vaadin TreeGrid.	Vaadin Flow + JavaScript integration Tutorial on how to integrate a JavaScript library with Vaadin Flow to create an Add-on component.	World Cup Stats Demo application that displays statistical data from the Football World Cup 2018 using Vaadin Flow & Spring Framework.

Community

Contributions

Report issues, create pull requests, ask questions, all contributions are welcome!

Code contributions

As first step, please refer to our Development Conventions page to find information about Conventional Commits & Code Style requirements.

Then, follow these steps for creating a contribution:

• Fork the project.
• Create an issue to the project about the contribution (bug or feature) if there is no such issue about it already. Try to keep the scope minimal.
• Develop and test the fix or functionality carefully. Only include minimum amount of code needed to fix the issue.
• For commit message, use Conventional Commits to describe your change.
• Send a pull request for the original project.
• Comment on the original issue that you have implemented a fix for it.