Skip to content

Share Easy

A Vaadin Flow add-on that displays a customizable social media sharing menu with multiple display modes.

Overview

Use the Share Easy add-on to add social media sharing to a Vaadin application. It wraps the Sharee JavaScript package and renders a share menu that can be attached to any component. It ships with built-in share drivers — Copy, Twitter/X, Facebook, LinkedIn, WhatsApp, and Telegram — and can be rendered in five different layouts. Locale, language keys, and drivers are all customizable, and share actions can be tracked with a listener.

Features

  • Built-in drivers to share links: Copy, Twitter/X, Facebook, LinkedIn, WhatsApp, Telegram.
  • Five display modes: Fixed, Normal, Hover, Text, and Dropdown.
  • English locale and language keys by default, with support for custom locales and keys.
  • Custom drivers via CustomDriverOptions.
  • Share-action listener exposing the driver name, the Driver enum, and the shared link.
  • Additional customizations: ripple effect, transition duration, position, animation, and layout type/direction.

Supported versions

Add-on version Vaadin version
2.x 24–25

Refer to the Vaadin Directory page for exact version compatibility.

Installation

From the Vaadin Directory

Available in the Vaadin Directory.

Maven dependency

<dependency>
    <groupId>org.vaadin.addons.flowingcode</groupId>
    <artifactId>share-easy-addon</artifactId>
    <version>X.Y.Z</version>
</dependency>

Replace X.Y.Z with the latest released version. Add the Vaadin add-ons repository to your pom.xml:

<repository>
    <id>vaadin-addons</id>
    <url>https://maven.vaadin.com/vaadin-addons</url>
</repository>

For snapshot builds, see maven.flowingcode.com/snapshots.

JavaDoc is published at javadoc.flowingcode.com.

Usage

Each display mode is created through its own fluent builder and attached to a component with forComponent(...):

// Fixed mode, attached to the current view
FixedShareEasy.create().forComponent(this);

// Normal mode, attached to a container
Div div = new Div();
NormalShareEasy.create().withNoTitle(true).forComponent(div);
add(div);

Track share actions with a listener:

Div div = new Div();
NormalShareEasy.create()
    .withShareListener(event -> Notification.show("Shared via " + event.getDriverName()))
    .forComponent(div);
add(div);

Customize the share link, drivers, and locale through the fluent API:

Div div = new Div();
DropdownShareEasy.create()
    .withShareLink("https://flowingcode.com")
    .withDrivers(Driver.COPY, Driver.LINKEDIN, Driver.WHATSAPP)
    .withLocale(Locale.ENGLISH)
    .forComponent(div);
add(div);

Special configuration when using Spring

When running on Spring, allow-list the com.flowingcode package so Vaadin Flow can discover the add-on's components. See Common configuration for details.

API reference

Headline types exposed by the add-on:

  • BaseShareEasy<T> — the abstract fluent base shared by all modes. Key methods: withShareLink(String), withShareText(String), withRipple(boolean), withShowTransitionDuration(String), withLocale(Locale), withDrivers(ShareEasyDriver...), withShareListener(ShareEasyClickListener), withCustomLanguageKeys(...), withCustomDrivers(Map<String, CustomDriverOptions>), and forComponent(Component).
  • FixedShareEasy, NormalShareEasy, HoverShareEasy, TextShareEasy, DropdownShareEasy — the five display modes, each created via static create(). FixedShareEasy adds withPosition(Position); DropdownShareEasy adds withType(Type) and withAnimation(Animation).
  • ShareEasyClickEvent / ShareEasyClickListener — the share-action event (getDriverName(), getDriver(), getLink()) and its functional listener.
  • Driver — enum of built-in drivers (COPY, TELEGRAM, FACEBOOK, WHATSAPP, TWITTER, LINKEDIN), implementing ShareEasyDriver.
  • Supporting enums (Animation, Direction, Locale, Mode, Position, Type) and utilities (CustomDriverOptions, LanguageKeys, Options).

For the full API surface, browse the published JavaDoc.

Demo

A live demo is available at addonsv25.flowingcode.com/share-easy. To run the demo locally:

git clone https://github.com/FlowingCode/ShareEasy.git
cd ShareEasy
mvn clean install jetty:run

Then open http://localhost:8080/.

Source code

ShareEasy on GitHub — distributed under Apache License 2.0.