paper-tags-input component

vaadin-paper-tags-input

View larger

Close

Paper tag component based on paper-tags-input for vaadin 17+

Sample code

FlexLayout div = new FlexLayout();
        div.getStyle().set("flex-direction", "column");
        div.setWidth("40em");
        div.add(new Label("Paper tag input"));
        
        PaperTagInput inputTags = new PaperTagInput();
        inputTags.addClassName("tag");
        inputTags.setWidth("100%");
        inputTags.setText("Tags test");
        inputTags.setPlaceholder("Add tag");

        final Label selectedValueLabel = new Label("tags:");
        div.add(inputTags, selectedValueLabel);
        
        inputTags.addTagsChangedEventListener(e -> {        
            selectedValueLabel.setText("tags: New value "+e.getValue().asString()+" - Old value "+e.getOldValue().asString());            
        });

Links

• View on GitHub

Compatibility