From 72f755b1e0cc57ebb1220b9c5d29ff8f61f9e70f Mon Sep 17 00:00:00 2001 From: Javier Godoy <11554739+javier-godoy@users.noreply.github.com> Date: Mon, 31 Aug 2026 14:03:56 -0300 Subject: [PATCH 1/2] build: set version to 2.8.0-SNAPSHOT --- pom.xml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pom.xml b/pom.xml index 65267f1..6a20eff 100644 --- a/pom.xml +++ b/pom.xml @@ -4,7 +4,7 @@ com.flowingcode.vaadin.addons.chipfield chipfield-addon - 2.7.2-SNAPSHOT + 2.8.0-SNAPSHOT ChipField Addon Integration of paper-chip for Vaadin 14 as a field From e2cceaecbaba40cf5be774d640379d8bff33d545 Mon Sep 17 00:00:00 2001 From: Javier Godoy <11554739+javier-godoy@users.noreply.github.com> Date: Mon, 31 Aug 2026 14:04:03 -0300 Subject: [PATCH 2/2] feat: allow hiding the floating label Close #89 --- .../vaadin/addons/chipfield/ChipField.java | 22 ++++++- .../frontend/paper-chip-input-autocomplete.js | 10 ++++ .../addons/chipfield/ChipfieldDemoView.java | 3 +- .../addons/chipfield/NoLabelFloatDemo.java | 59 +++++++++++++++++++ 4 files changed, 92 insertions(+), 2 deletions(-) create mode 100644 src/test/java/com/flowingcode/vaadin/addons/chipfield/NoLabelFloatDemo.java diff --git a/src/main/java/com/flowingcode/vaadin/addons/chipfield/ChipField.java b/src/main/java/com/flowingcode/vaadin/addons/chipfield/ChipField.java index 6edfbc1..3914cc2 100644 --- a/src/main/java/com/flowingcode/vaadin/addons/chipfield/ChipField.java +++ b/src/main/java/com/flowingcode/vaadin/addons/chipfield/ChipField.java @@ -2,7 +2,7 @@ * #%L * ChipField Addon * %% - * Copyright (C) 2018 - 2022 Flowing Code + * Copyright (C) 2018 - 2026 Flowing Code * %% * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -275,6 +275,26 @@ public void setLabel(String label) { getElement().setProperty("label", label); } + /** + * Sets whether the label is displayed as a static placeholder that is hidden when the input has a + * value, instead of floating above the input. When the label does not float, no space is reserved + * for it above the input. + * + * @param noLabelFloat {@code true} to prevent the label from floating, {@code false} otherwise. + */ + public void setNoLabelFloat(boolean noLabelFloat) { + getElement().setProperty("noLabelFloat", noLabelFloat); + } + + /** + * Returns whether the label is prevented from floating above the input. + * + * @return {@code true} if the label does not float, {@code false} otherwise. + */ + public boolean isNoLabelFloat() { + return getElement().getProperty("noLabelFloat", false); + } + public String[] getChipsAsStrings() { return super.getValue().stream().map(itemLabelGenerator).toArray(String[]::new); } diff --git a/src/main/resources/META-INF/frontend/paper-chip-input-autocomplete.js b/src/main/resources/META-INF/frontend/paper-chip-input-autocomplete.js index 8d2e2d8..ffb10fb 100644 --- a/src/main/resources/META-INF/frontend/paper-chip-input-autocomplete.js +++ b/src/main/resources/META-INF/frontend/paper-chip-input-autocomplete.js @@ -84,6 +84,15 @@ class PaperChipInputAutocomplete extends ThemableMixin(PolymerElement) { value: '' }, + /** + * If true, the label is displayed as a static placeholder that is hidden + * when the input has a value, instead of floating above the input. + */ + noLabelFloat: { + type: Boolean, + value: false + }, + /** * If true, the paper-chip-input-autocomplete is focused. */ @@ -274,6 +283,7 @@ class PaperChipInputAutocomplete extends ThemableMixin(PolymerElement) { disabled$="[[disabled]]" readonly$="[[readonly]]" label="[[label]]" + no-label-float$="[[noLabelFloat]]" on-keyup="_findItems" value="{{_inputValue}}" autofocus="{{autofocus}}" diff --git a/src/test/java/com/flowingcode/vaadin/addons/chipfield/ChipfieldDemoView.java b/src/test/java/com/flowingcode/vaadin/addons/chipfield/ChipfieldDemoView.java index afa576c..dd90b8a 100644 --- a/src/test/java/com/flowingcode/vaadin/addons/chipfield/ChipfieldDemoView.java +++ b/src/test/java/com/flowingcode/vaadin/addons/chipfield/ChipfieldDemoView.java @@ -2,7 +2,7 @@ * #%L * ChipField Addon * %% - * Copyright (C) 2018 - 2022 Flowing Code + * Copyright (C) 2018 - 2026 Flowing Code * %% * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. @@ -40,5 +40,6 @@ public ChipfieldDemoView() { addDemo(BinderDemo.class); addDemo(ReadonlyDemo.class); addDemo(StyledDemo.class); + addDemo(NoLabelFloatDemo.class); } } diff --git a/src/test/java/com/flowingcode/vaadin/addons/chipfield/NoLabelFloatDemo.java b/src/test/java/com/flowingcode/vaadin/addons/chipfield/NoLabelFloatDemo.java new file mode 100644 index 0000000..0e9ce0c --- /dev/null +++ b/src/test/java/com/flowingcode/vaadin/addons/chipfield/NoLabelFloatDemo.java @@ -0,0 +1,59 @@ +/*- + * #%L + * ChipField Addon + * %% + * Copyright (C) 2018 - 2026 Flowing Code + * %% + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + * #L% + */ +package com.flowingcode.vaadin.addons.chipfield; + +import com.flowingcode.vaadin.addons.demo.DemoSource; +import com.vaadin.flow.component.formlayout.FormLayout; +import com.vaadin.flow.component.orderedlayout.VerticalLayout; +import com.vaadin.flow.router.PageTitle; +import com.vaadin.flow.router.Route; + +@Route(value = "chipfield/no-label-float", layout = ChipfieldDemoView.class) +@PageTitle("No Label Float") +@DemoSource +@SuppressWarnings("serial") +public class NoLabelFloatDemo extends VerticalLayout { + + public NoLabelFloatDemo() { + // by default, space is reserved above the input for the floating label, + // which misaligns the field from the label of the enclosing form item + ChipField floating = newChipField(); + + // when the label does not float, no space is reserved for it above the input + ChipField notFloating = newChipField(); + notFloating.setNoLabelFloat(true); + + FormLayout formLayout = new FormLayout(); + formLayout.setResponsiveSteps(new FormLayout.ResponsiveStep("0", 1)); + formLayout.setWidth("500px"); + formLayout.addFormItem(floating, "Floating label"); + formLayout.addFormItem(notFloating, "No label float"); + + add(formLayout); + } + + private static ChipField newChipField() { + ChipField chf = new ChipField<>("", "Mercury", "Venus", "Earth", "Mars", "Jupiter"); + chf.addSelectedItem("Earth"); + chf.setClosable(true); + chf.setWidthFull(); + return chf; + } +}