Examples with NativeButton com.vaadin.flow.component.html.NativeButton used on opensource projects

Example 1 with NativeButton

use of com.vaadin.flow.component.html.NativeButton in project flow by vaadin.

the class NativeButtonRenderer method createComponent.

@Override
public Component createComponent(SOURCE item) {
    NativeButton button = new NativeButton(getValueProvider().apply(item));
    button.addClickListener(event -> getItemClickListeners().forEach(listener -> listener.onItemClicked(item)));
    return button;
}

Example 2 with NativeButton

use of com.vaadin.flow.component.html.NativeButton in project flow by vaadin.

the class ValidationTestView method initView.

private void initView() {
    HasValidation field = getValidationComponent();
    ((Component) field).setId("field");
    add(((Component) field));
    NativeButton button = new NativeButton("Make the input invalid");
    button.setId("invalidate");
    button.addClickListener(event -> {
        field.setErrorMessage("Invalidated from server");
        field.setInvalid(true);
    });
    add(button);
    button = new NativeButton("Make the input valid");
    button.setId("validate");
    button.addClickListener(event -> {
        field.setErrorMessage(null);
        field.setInvalid(false);
    });
    add(button);
}

Example 3 with NativeButton

use of com.vaadin.flow.component.html.NativeButton in project flow by vaadin.

the class AttachExistingElementView method onShow.

@Override
protected void onShow() {
    setId("root-div");
    NativeButton attachLabel = new NativeButton("Attach label", event -> getElement().getStateProvider().attachExistingElement(getElement().getNode(), "label", null, this::handleLabel));
    attachLabel.setId("attach-label");
    add(attachLabel);
    NativeButton attachHeader = new NativeButton("Attach Header", event -> getElement().getStateProvider().attachExistingElement(getElement().getNode(), "h1", null, this::handleHeader));
    attachHeader.setId("attach-header");
    add(attachHeader);
    Div div = new Div();
    div.setId("element-with-shadow");
    ShadowRoot shadowRoot = div.getElement().attachShadow();
    NativeButton attachLabelInShadow = new NativeButton("Attach label in shadow", event -> shadowRoot.getStateProvider().attachExistingElement(shadowRoot.getNode(), "label", null, this::handleLabelInShadow));
    attachLabelInShadow.setId("attach-label-inshadow");
    add(attachLabelInShadow);
    NativeButton attachNonExistingElement = new NativeButton("Attach non-existing element", event -> getElement().getStateProvider().attachExistingElement(getElement().getNode(), "image", null, new NonExistingElementCallback()));
    attachNonExistingElement.setId("non-existing-element");
    add(attachNonExistingElement);
    add(div);
    getPage().executeJavaScript("$0.appendChild(document.createElement('label'));", shadowRoot);
    getPage().executeJavaScript("$0.appendChild(document.createElement('span')); $0.appendChild(document.createElement('label'));" + "$0.appendChild(document.createElement('h1'));", getElement());
}

Example 4 with NativeButton

use of com.vaadin.flow.component.html.NativeButton in project flow by vaadin.

the class AttachExistingElementView method handleLabel.

private void handleLabel(Element label) {
    attachedLabel = Component.from(label, Label.class);
    attachedLabel.setText("Client side label");
    attachedLabel.setId("label");
    NativeButton attachPopulatedLabel = new NativeButton("Attach the already attached label", event -> getElement().getStateProvider().attachExistingElement(getElement().getNode(), "label", null, this::handleAttachedLabel));
    attachPopulatedLabel.setId("attach-populated-label");
    add(attachPopulatedLabel);
    NativeButton removeSelf = new NativeButton("Remove myself on the server side", event -> event.getSource().getElement().removeFromParent());
    removeSelf.setId("remove-self");
    add(removeSelf);
}

Example 5 with NativeButton

use of com.vaadin.flow.component.html.NativeButton in project flow by vaadin.

the class BasicComponentView method onShow.

@Override
protected void onShow() {
    getElement().getStyle().set("margin", "1em");
    getElement().setAttribute("id", "root");
    Text text = new Text(TEXT);
    Input input = new Input();
    input.setPlaceholder("Synchronized on change event");
    NativeButton button = new NativeButton(BUTTON_TEXT, e -> {
        Div greeting = new Div();
        greeting.addClassName("thankYou");
        String buttonText = e.getSource().getElement().getText();
        greeting.setText("Thank you for clicking \"" + buttonText + "\" at (" + e.getClientX() + "," + e.getClientY() + ")! The field value is " + input.getValue());
        greeting.addClickListener(e2 -> remove(greeting));
        add(greeting);
    });
    Div helloWorld = new Div();
    helloWorld.setText(DIV_TEXT);
    helloWorld.addClassName("hello");
    helloWorld.setId("hello-world");
    helloWorld.addClickListener(e -> {
        helloWorld.setText("Stop touching me!");
        helloWorld.getElement().getClassList().clear();
    });
    Style s = helloWorld.getElement().getStyle();
    s.set("color", "red");
    s.set("fontWeight", "bold");
    add(text, helloWorld, button, input);
}