@vaadin-component-factory/vcf-context-item

<vcf-context-item>

Live Demo ↗

Installation

Install vcf-context-item:

npm i @vaadin-component-factory/vcf-context-item --save

Usage

Once installed, import the module in your application:

import '@vaadin-component-factory/vcf-context-item';

Add <vcf-context-item> element to the page:

<vcf-context-item>Foobar</vcf-context-item>

Properties

• menuItems: An array of objects used to define the content of the context menu. Each object contains the following properties:
  • icon: The icon name for the menu item (e.g. "vaadin:edit"). Lumo, Vaadin or Iron icon sets may be used. Note: icon set must be imported separately.
  • text: The text for the menu item.
  • callback: The callback function that is executed when this menu item is selected. The only parameter for this function is a reference to the vcf-context-item.

Events

• context-menu-click: Triggered when user clicks the context menu. The events detail property contains 2 custom properties:
  • targetItem: Reference to the vcf-context-item.
  • sourceEvent: Reference to the original click event.

Running demo

1. Fork the vcf-context-item repository and clone it locally.

2. Make sure you have npm installed.

3. When in the vcf-context-item directory, run npm install to install dependencies.

4. Run npm start to open the demo.

Contributing

To contribute to the component, please read the guideline first.

Vaadin Prime

This component is available in the Vaadin Prime subscription. It is still open source, but you need to have a valid CVAL license in order to use it. Read more at: https://vaadin.com/pricing

License

Apache License 2.0