com.vaadin.flow.component.contextmenu

Class GeneratedVaadinContextMenu<R extends GeneratedVaadinContextMenu<R>>

java.lang.Object

com.vaadin.flow.component.Component

com.vaadin.flow.component.contextmenu.GeneratedVaadinContextMenu<R>

All Implemented Interfaces:

AttachNotifier, ClickNotifier<R>, DetachNotifier, HasElement, HasStyle, Serializable

Direct Known Subclasses:

ContextMenuBase

@Tag(value="vaadin-context-menu")
 @NpmPackage(value="@vaadin/vaadin-context-menu",
            version="4.6.0")
 @JsModule(value="@vaadin/vaadin-context-menu/src/vaadin-context-menu.js")
 @HtmlImport(value="frontend://bower_components/vaadin-context-menu/src/vaadin-context-menu.html")
public abstract class GeneratedVaadinContextMenu<R extends GeneratedVaadinContextMenu<R>>
extends Component
implements HasStyle, ClickNotifier<R>

Description copied from corresponding location in WebComponent:

<vaadin-context-menu> <template> <vaadin-list-box> <vaadin-item>First menu item</vaadin-item> <vaadin-item>Second menu item</vaadin-item> </vaadin-list-box> </template> </vaadin-context-menu>

“vaadin-contextmenu” Gesture Event

vaadin-contextmenu is a gesture event (a custom event fired by Polymer), which is dispatched after either contextmenu and long touch events. This enables support for both mouse and touch environments in a uniform way.

<vaadin-context-menu> opens the menu overlay on the vaadin-contextmenu event by default.

Menu Listener

By default, the <vaadin-context-menu> element listens for the menu opening event on itself. In order to have a context menu on your content, wrap your content with the <vaadin-context-menu> element, and add a template element with a menu. Example:

<vaadin-context-menu> <template> <vaadin-list-box> <vaadin-item>First menu item</vaadin-item> <vaadin-item>Second menu item</vaadin-item> </vaadin-list-box> </template>

<p>This paragraph has the context menu provided in the above template.</p> <p>Another paragraph with the context menu.</p> </vaadin-context-menu>

In case if you do not want to wrap the page content, you can listen for events on an element outside the <vaadin-context-menu> by setting the listenOn property:

<vaadin-context-menu id="customListener"> <template> <vaadin-list-box> ... </vaadin-list-box> </template> </vaadin-context-menu>

<div id="menuListener">The element that listens for the context menu.</div>

&lt;script&gt; const contextMenu = document.querySelector('vaadin-context-menu#customListener'); contextMenu.listenOn = document.querySelector('#menuListener'); &lt;/script&gt;

Filtering Menu Targets

By default, the listener element and all its descendants open the context menu. You can filter the menu targets to a smaller set of elements inside the listener element by setting the selector property.

In the following example, only the elements matching .has-menu will open the context menu:

<vaadin-context-menu selector=".has-menu"> <template> <vaadin-list-box> ... </vaadin-list-box> </template>

<p class="has-menu">This paragraph opens the context menu</p> <p>This paragraph does not open the context menu</p> </vaadin-context-menu>

Menu Context

You can bind to the following properties in the menu template:

• target is the menu opening event target, which is the element that the user has called the context menu for
• detail is the menu opening event detail

In the following example, the menu item text is composed with the contents of the element that opened the menu:

<vaadin-context-menu selector="li"> <template> <vaadin-list-box> <vaadin-item>The menu target: [[target.textContent]]</vaadin-item> </vaadin-list-box> </template>

<ul> <li>Foo</li> <li>Bar</li> <li>Baz</li> </ul> </vaadin-context-menu>

Styling

See ThemableMixin – how to apply styles for shadow parts

See Also:

Serialized Form

Nested Class Summary

Nested Classes

Modifier and Type	Class and Description
static class	GeneratedVaadinContextMenu.OpenedChangeEvent<R extends GeneratedVaadinContextMenu<R>>

Constructor Summary

Constructors

Constructor and Description
GeneratedVaadinContextMenu()

Method Summary

Modifier and Type	Method and Description
protected Registration	addOpenedChangeListener(ComponentEventListener<GeneratedVaadinContextMenu.OpenedChangeEvent<R>> listener) Adds a listener for opened-changed events fired by the webcomponent.
protected void	close() Description copied from corresponding location in WebComponent:
protected String	getCloseOnString() Description copied from corresponding location in WebComponent:
protected elemental.json.JsonObject	getListenOnJsonObject() Description copied from corresponding location in WebComponent:
protected String	getOpenOnString() Description copied from corresponding location in WebComponent:
protected String	getSelectorString() Description copied from corresponding location in WebComponent:
protected boolean	isOpenedBoolean() Description copied from corresponding location in WebComponent:
protected void	open() Description copied from corresponding location in WebComponent:
protected void	setCloseOn(String closeOn) Description copied from corresponding location in WebComponent:
protected void	setListenOn(elemental.json.JsonObject listenOn) Description copied from corresponding location in WebComponent:
protected void	setOpenOn(String openOn) Description copied from corresponding location in WebComponent:
protected void	setSelector(String selector) Description copied from corresponding location in WebComponent:

Methods inherited from class com.vaadin.flow.component.Component

addListener, fireEvent, from, get, getChildren, getElement, getEventBus, getId, getLocale, getParent, getTranslation, getTranslation, getTranslation, getTranslation, getUI, hasListener, isAttached, isTemplateMapped, isVisible, onAttach, onDetach, onEnabledStateChanged, set, setElement, setId, setVisible

Methods inherited from class java.lang.Object

clone, equals, finalize, getClass, hashCode, notify, notifyAll, toString, wait, wait, wait

Methods inherited from interface com.vaadin.flow.component.HasStyle

addClassName, addClassNames, getClassName, getClassNames, getStyle, hasClassName, removeClassName, removeClassNames, setClassName, setClassName

Methods inherited from interface com.vaadin.flow.component.HasElement

getElement

Methods inherited from interface com.vaadin.flow.component.ClickNotifier

addClickListener, addClickShortcut

Methods inherited from interface com.vaadin.flow.component.AttachNotifier

addAttachListener

Methods inherited from interface com.vaadin.flow.component.DetachNotifier

addDetachListener

Constructor Detail

GeneratedVaadinContextMenu

public GeneratedVaadinContextMenu()

Method Detail

getSelectorString

protected String getSelectorString()

Description copied from corresponding location in WebComponent:

CSS selector that can be used to target any child element of the context menu to listen for openOn events.

This property is not synchronized automatically from the client side, so the returned value may not be the same as in client side.

Returns:

the selector property from the webcomponent

setSelector

protected void setSelector(String selector)

Description copied from corresponding location in WebComponent:

CSS selector that can be used to target any child element of the context menu to listen for openOn events.

Parameters:

selector - the String value to set

isOpenedBoolean

@Synchronize(property="opened",
             value="opened-changed")
protected boolean isOpenedBoolean()

Description copied from corresponding location in WebComponent:

True if the overlay is currently displayed.

This property is synchronized automatically from client side when a 'opened-changed' event happens.

Returns:

the opened property from the webcomponent

getOpenOnString

protected String getOpenOnString()

Description copied from corresponding location in WebComponent:

Event name to listen for opening the context menu.

This property is not synchronized automatically from the client side, so the returned value may not be the same as in client side.

Returns:

the openOn property from the webcomponent

setOpenOn

protected void setOpenOn(String openOn)

Description copied from corresponding location in WebComponent:

Event name to listen for opening the context menu.

Parameters:

openOn - the String value to set

getListenOnJsonObject

protected elemental.json.JsonObject getListenOnJsonObject()

Description copied from corresponding location in WebComponent:

The target element that's listened to for context menu opening events. By default the vaadin-context-menu listens to the target's vaadin-contextmenu events.

This property is not synchronized automatically from the client side, so the returned value may not be the same as in client side.

Returns:

the listenOn property from the webcomponent

setListenOn

protected void setListenOn(elemental.json.JsonObject listenOn)

Description copied from corresponding location in WebComponent:

The target element that's listened to for context menu opening events. By default the vaadin-context-menu listens to the target's vaadin-contextmenu events.

Parameters:

listenOn - the JsonObject value to set

getCloseOnString

protected String getCloseOnString()

Description copied from corresponding location in WebComponent:

Event name to listen for closing the context menu.

This property is not synchronized automatically from the client side, so the returned value may not be the same as in client side.

Returns:

the closeOn property from the webcomponent

setCloseOn

protected void setCloseOn(String closeOn)

Description copied from corresponding location in WebComponent:

Event name to listen for closing the context menu.

Parameters:

closeOn - the String value to set

close

protected void close()

Description copied from corresponding location in WebComponent:

Closes the overlay.

open

protected void open()

Description copied from corresponding location in WebComponent:

Opens the overlay.

addOpenedChangeListener

protected Registration addOpenedChangeListener(ComponentEventListener<GeneratedVaadinContextMenu.OpenedChangeEvent<R>> listener)

Adds a listener for opened-changed events fired by the webcomponent.

Parameters:

listener - the listener

Returns:

a Registration for removing the event listener