Add class-names/extract CSS

Author: AB-xdev

vaadin-grid-filter/src/main/java/software/xdev/vaadin/gridfilter/AddFilterComponentsButtons.java

@@ -20,14 +20,21 @@
 
 import com.vaadin.flow.component.button.Button;
 import com.vaadin.flow.component.button.ButtonVariant;
+import com.vaadin.flow.component.dependency.CssImport;
 import com.vaadin.flow.component.icon.VaadinIcon;
 import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
 
 import software.xdev.vaadin.gridfilter.filtercomponents.FilterComponentSupplier;
 
 
+@CssImport(GridFilterStyles.LOCATION)
 public class AddFilterComponentsButtons extends HorizontalLayout
 {
+	public AddFilterComponentsButtons()
+	{
+		this.addClassNames(GridFilterStyles.ADD_FILTER_COMPONENTS_BUTTONS);
+	}
+	
 	public void update(
 		final Collection<FilterComponentSupplier> filterComponentSuppliers,
 		final Consumer<FilterComponentSupplier> onAddButtonClicked,
@@ -41,6 +48,7 @@ public void update(
 				final Button btn =
 					new Button(s.display(), VaadinIcon.PLUS.create(), ev -> onAddButtonClicked.accept(s));
 				btn.addThemeVariants(ButtonVariant.LUMO_SMALL);
+				btn.addClassNames(GridFilterStyles.ADD_FILTER_COMPONENTS_BUTTONS_BUTTON);
 				return btn;
 			})
 			.forEach(this::add);

vaadin-grid-filter/src/main/java/software/xdev/vaadin/gridfilter/FilterComponentWrapper.java

@@ -19,12 +19,14 @@
 
 import com.vaadin.flow.component.button.Button;
 import com.vaadin.flow.component.button.ButtonVariant;
+import com.vaadin.flow.component.dependency.CssImport;
 import com.vaadin.flow.component.icon.VaadinIcon;
 import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
 
 import software.xdev.vaadin.gridfilter.filtercomponents.FilterComponent;
 
 
+@CssImport(GridFilterStyles.LOCATION)
 public class FilterComponentWrapper<T> extends HorizontalLayout
 {
 	public FilterComponentWrapper(
@@ -34,12 +36,13 @@ public FilterComponentWrapper(
 	{
 		final Button btnDelete = new Button(VaadinIcon.TRASH.create(), ev -> onRemove.accept(this, component));
 		btnDelete.addThemeVariants(ButtonVariant.LUMO_ERROR);
-		btnDelete.getStyle().set("margin-left", "var(--lumo-space-s)");
+		btnDelete.addClassNames(GridFilterStyles.FILTER_COMPONENT_WRAPPER_BTN_DELETE);
 
 		this.add(component, btnDelete);
 
 		this.setAlignItems(Alignment.CENTER);
 		this.setSpacing(false);
+		this.addClassNames(GridFilterStyles.FILTER_COMPONENT_WRAPPER);
 
 		if(fullWidth)
 		{

vaadin-grid-filter/src/main/java/software/xdev/vaadin/gridfilter/FilterContainerComponent.java

@@ -18,11 +18,14 @@
 import java.util.ArrayList;
 import java.util.List;
 
+import com.vaadin.flow.component.dependency.CssImport;
 import com.vaadin.flow.component.orderedlayout.VerticalLayout;
 
 import software.xdev.vaadin.gridfilter.filtercomponents.FilterComponent;
 
 
+@SuppressWarnings("java:S1948")
+@CssImport(GridFilterStyles.LOCATION)
 public class FilterContainerComponent<T> extends VerticalLayout
 {
 	protected final Runnable onValueUpdated;
@@ -39,6 +42,7 @@ public FilterContainerComponent(final Runnable onValueUpdated, final boolean sho
 		this.setSpacing(false);
 
 		this.updateFilterConditionsContainerVisibility();
+		this.addClassNames(GridFilterStyles.FILTER_CONTAINER);
 	}
 
 	public void addFilterComponent(final FilterComponent<T, ?> newFilterConditionComponent)

vaadin-grid-filter/src/main/java/software/xdev/vaadin/gridfilter/GridFilter.java

@@ -38,6 +38,7 @@
 import com.vaadin.flow.component.checkbox.Checkbox;
 import com.vaadin.flow.component.datepicker.DatePicker;
 import com.vaadin.flow.component.datetimepicker.DateTimePicker;
+import com.vaadin.flow.component.dependency.CssImport;
 import com.vaadin.flow.component.grid.Grid;
 import com.vaadin.flow.component.orderedlayout.VerticalLayout;
 import com.vaadin.flow.component.textfield.BigDecimalField;
@@ -72,10 +73,13 @@
 
 
 @SuppressWarnings("java:S1948")
+@CssImport(GridFilterStyles.LOCATION)
 public class GridFilter<T>
 	extends VerticalLayout
 	implements FilterComponentSerialization
 {
+	protected static final int START_DEPTH = 1;
+	
 	protected final List<Operation<?>> availableOperations = new ArrayList<>();
 	protected final List<TypeValueComponentProvider<?>> availableTypeValueComponentProviders = new ArrayList<>();
 	protected final Map<Class<? extends ValueContainer>, Set<ValueReUseAdapter<?>>> valueReUseAdapters =
@@ -104,6 +108,8 @@ public GridFilter(final Grid<T> grid)
 
 		this.setPadding(false);
 		this.setSpacing(false);
+		
+		this.addClassNames(GridFilterStyles.GRID_FILTER);
 	}
 
 	@SuppressWarnings("java:S1452")
@@ -115,7 +121,7 @@ public GridFilter(final Grid<T> grid)
 			this.valueReUseAdapters,
 			this.filterComponentSuppliers,
 			this::onFilterUpdate,
-			1,
+			START_DEPTH,
 			this.maxNestedDepth);
 		this.filterContainerComponent.addFilterComponent(filterComponent);
 		return filterComponent;
@@ -149,7 +155,7 @@ protected void onAttach(final AttachEvent attachEvent)
 		this.addFilterComponentButtons.update(
 			this.filterComponentSuppliers,
 			this::addFilterComponent,
-			1,
+			START_DEPTH,
 			this.maxNestedDepth);
 	}
 
@@ -313,7 +319,7 @@ public <S> GridFilter<T> withFilterableField(
 
 	public GridFilter<T> withMaxNestedDepth(final int maxNestedDepth)
 	{
-		if(maxNestedDepth < 1)
+		if(maxNestedDepth < START_DEPTH)
 		{
 			throw new IllegalArgumentException("Invalid depth");
 		}

vaadin-grid-filter/src/main/java/software/xdev/vaadin/gridfilter/GridFilterStyles.java

@@ -0,0 +1,18 @@
+package software.xdev.vaadin.gridfilter;
+
+public final class GridFilterStyles
+{
+	public static final String LOCATION = "./styles/grid-filter.css";
+	
+	public static final String GRID_FILTER = "grid-filter";
+	
+	public static final String FILTER_CONTAINER = GRID_FILTER + "-filter-container";
+	public static final String FILTER_COMPONENT_WRAPPER = GRID_FILTER + "-filter-comp-wrapper";
+	public static final String FILTER_COMPONENT_WRAPPER_BTN_DELETE = FILTER_COMPONENT_WRAPPER + "-btn-delete";
+	public static final String ADD_FILTER_COMPONENTS_BUTTONS = GRID_FILTER + "-add-filter-comps-btns";
+	public static final String ADD_FILTER_COMPONENTS_BUTTONS_BUTTON = ADD_FILTER_COMPONENTS_BUTTONS + "-btn";
+	
+	private GridFilterStyles()
+	{
+	}
+}

vaadin-grid-filter/src/main/java/software/xdev/vaadin/gridfilter/filtercomponents/FilterComponent.java

@@ -19,8 +19,12 @@
 
 import com.vaadin.flow.component.Component;
 import com.vaadin.flow.component.Composite;
+import com.vaadin.flow.component.dependency.CssImport;
 
+import software.xdev.vaadin.gridfilter.GridFilterStyles;
 
+
+@CssImport(GridFilterStyles.LOCATION)
 public abstract class FilterComponent<T, C extends Component>
 	extends Composite<C>
 	implements Predicate<T>, FilterComponentSerialization

vaadin-grid-filter/src/main/java/software/xdev/vaadin/gridfilter/filtercomponents/FilterComponentStyles.java

@@ -0,0 +1,13 @@
+package software.xdev.vaadin.gridfilter.filtercomponents;
+
+import software.xdev.vaadin.gridfilter.GridFilterStyles;
+
+
+public final class FilterComponentStyles
+{
+	public static final String FILTER_COMPONENT = GridFilterStyles.GRID_FILTER + "-filter-comp";
+	
+	private FilterComponentStyles()
+	{
+	}
+}

vaadin-grid-filter/src/main/java/software/xdev/vaadin/gridfilter/filtercomponents/block/FilterBlockComponent.java

@@ -40,6 +40,7 @@
 import software.xdev.vaadin.gridfilter.filtercomponents.FilterBlockComponentSerialization;
 import software.xdev.vaadin.gridfilter.filtercomponents.FilterComponent;
 import software.xdev.vaadin.gridfilter.filtercomponents.FilterComponentSerialization;
+import software.xdev.vaadin.gridfilter.filtercomponents.FilterComponentStyles;
 import software.xdev.vaadin.gridfilter.filtercomponents.FilterComponentSupplier;
 
 
@@ -86,8 +87,7 @@ public FilterBlockComponent(
 		this.maxNestedDepth = maxNestedDepth;
 
 		final Span spBlockIdentifier = new Span(identifierName);
-		spBlockIdentifier.setMinWidth("2.5em");
-		spBlockIdentifier.getStyle().set("overflow-wrap", "break-word");
+		spBlockIdentifier.addClassNames(FilterBlockComponentStyles.BLOCK_IDENTIFIER);
 
 		this.filterContainerComponent = new FilterContainerComponent<>(onValueUpdated, true);
 
@@ -101,9 +101,9 @@ public FilterBlockComponent(
 
 		this.getContent().setPadding(false);
 		this.getContent().setSpacing(false);
-		this.getStyle().set("background-color", "var(--lumo-contrast-5pct)");
-		this.getStyle().set("padding-left", "var(--lumo-space-xs)");
-		this.getStyle().set("padding-right", "var(--lumo-space-xs)");
+		this.getContent().addClassNames(
+			FilterComponentStyles.FILTER_COMPONENT,
+			FilterBlockComponentStyles.FILTER_BLOCK_COMPONENT);
 	}
 
 	@SuppressWarnings("java:S1452")

vaadin-grid-filter/src/main/java/software/xdev/vaadin/gridfilter/filtercomponents/block/FilterBlockComponentStyles.java

@@ -0,0 +1,14 @@
+package software.xdev.vaadin.gridfilter.filtercomponents.block;
+
+import software.xdev.vaadin.gridfilter.GridFilterStyles;
+
+
+public final class FilterBlockComponentStyles
+{
+	public static final String FILTER_BLOCK_COMPONENT = GridFilterStyles.GRID_FILTER + "-filter-block-comp";
+	public static final String BLOCK_IDENTIFIER = FILTER_BLOCK_COMPONENT + "-identifier";
+	
+	private FilterBlockComponentStyles()
+	{
+	}
+}

vaadin-grid-filter/src/main/java/software/xdev/vaadin/gridfilter/filtercomponents/condition/FieldFilterConditionComponent.java

@@ -40,6 +40,7 @@
 import software.xdev.vaadin.gridfilter.business.value.ValueContainer;
 import software.xdev.vaadin.gridfilter.business.value.reuse.ValueReUseAdapter;
 import software.xdev.vaadin.gridfilter.filtercomponents.FilterComponent;
+import software.xdev.vaadin.gridfilter.filtercomponents.FilterComponentStyles;
 
 
 @SuppressWarnings("java:S1948")
@@ -74,12 +75,19 @@ public FieldFilterConditionComponent(
 		this.cbField.setItemLabelGenerator(FilterableField::name);
 		this.cbField.setItems(filterableFields);
 		this.cbField.addValueChangeListener(ev -> this.onFieldChanged(ev.getValue(), ev.isFromClient()));
+		this.cbField.addClassNames(FilterFieldConditionComponentStyles.CB_FIELD);
 
 		this.cbOperation.setItemLabelGenerator(Operation::identifier);
 		this.cbOperation.addValueChangeListener(ev -> this.onOperationChanged(ev.getValue(), ev.isFromClient()));
+		this.cbOperation.addClassNames(FilterFieldConditionComponentStyles.CB_OPERATION);
+		
+		this.operationDetailsContainer.addClassNames(FilterFieldConditionComponentStyles.DETAILS);
 
 		this.getContent().add(this.cbField, this.cbOperation, this.operationDetailsContainer);
 		this.getContent().setAlignItems(FlexComponent.Alignment.BASELINE);
+		this.getContent().addClassNames(
+			FilterComponentStyles.FILTER_COMPONENT,
+			FilterFieldConditionComponentStyles.FILTER_FIELD_CONDITION_COMPONENT);
 	}
 
 	protected void onFieldChanged(final FilterableField<T, ?> value, final boolean isFromClient)