Add custom ColorPickerField

custom-definitions/src/main/java/com/merkle/oss/magnolia/definition/custom/colorpicker/ColorPickerField.java

@@ -0,0 +1,56 @@
+package com.merkle.oss.magnolia.definition.custom.colorpicker;
+
+import com.vaadin.shared.ui.colorpicker.Color;
+import com.vaadin.ui.ColorPicker;
+import com.vaadin.ui.Component;
+import com.vaadin.ui.CustomField;
+import com.vaadin.ui.UI;
+import com.vaadin.ui.components.colorpicker.ColorPickerPopup;
+
+public class ColorPickerField extends CustomField<Integer> {
+	private final ColorPicker colorPicker;
+
+	public ColorPickerField(final ColorPickerFieldDefinition definition) {
+		colorPicker = new ColorPicker();
+		colorPicker.setModal(true);
+		colorPicker.setHSVVisibility(definition.isHsvv());
+		colorPicker.setTextfieldVisibility(definition.isTextField());
+		colorPicker.setRGBVisibility(definition.isRgb());
+		colorPicker.setSwatchesVisibility(definition.isSwatches());
+		colorPicker.setHistoryVisibility(definition.isHistory());
+	}
+
+	@Override
+	protected void doSetValue(final Integer color) {
+		if(color != null) {
+			colorPicker.setValue(new Color(color));
+		}
+	}
+
+	@Override
+	protected Component initContent() {
+		colorPicker.addValueChangeListener(event -> setValue(event.getValue().getRGB()));
+		getUI().addWindowOrderUpdateListener(this::addPopupStyles);
+		return colorPicker;
+	}
+
+	@Override
+	public Integer getValue() {
+		return this.colorPicker.getValue().getRGB();
+	}
+
+	private void addPopupStyles(final UI.WindowOrderUpdateEvent event) {
+		// Adds missing styles to popup dialog window
+		event.getWindows()
+				.stream()
+				.filter(window -> window instanceof ColorPickerPopup)
+				.findFirst()
+				.ifPresent(window -> {
+					window.addStyleName("dialog");
+					window.addStyleName("v-window-dialog");
+					window.addStyleName("framed");
+					window.addStyleName("v-window-framed");
+					window.addStyleName("small");
+				});
+	}
+}

custom-definitions/src/main/java/com/merkle/oss/magnolia/definition/custom/colorpicker/ColorPickerFieldDefinition.java

@@ -0,0 +1,58 @@
+package com.merkle.oss.magnolia.definition.custom.colorpicker;
+
+import info.magnolia.ui.field.ConfiguredFieldDefinition;
+import info.magnolia.ui.field.FieldType;
+
+@FieldType("colorPickerField")
+public class ColorPickerFieldDefinition extends ConfiguredFieldDefinition<Integer> {
+	private boolean rgb = false;
+	private boolean hsvv = false;
+	private boolean swatches = true;
+	private boolean history = false;
+	private boolean textField = true;
+
+	public ColorPickerFieldDefinition() {
+		setType(Integer.class);
+		setFactoryClass(ColorPickerFieldFactory.class);
+	}
+
+	public boolean isRgb() {
+		return rgb;
+	}
+
+	public void setRgb(final boolean rgb) {
+		this.rgb = rgb;
+	}
+
+	public boolean isHsvv() {
+		return hsvv;
+	}
+
+	public void setHsvv(final boolean hsvv) {
+		this.hsvv = hsvv;
+	}
+
+	public boolean isSwatches() {
+		return swatches;
+	}
+
+	public void setSwatches(final boolean swatches) {
+		this.swatches = swatches;
+	}
+
+	public boolean isHistory() {
+		return history;
+	}
+
+	public void setHistory(final boolean history) {
+		this.history = history;
+	}
+
+	public boolean isTextField() {
+		return textField;
+	}
+
+	public void setTextField(final boolean textField) {
+		this.textField = textField;
+	}
+}

custom-definitions/src/main/java/com/merkle/oss/magnolia/definition/custom/colorpicker/ColorPickerFieldDefinitionBuilder.java

@@ -0,0 +1,90 @@
+package com.merkle.oss.magnolia.definition.custom.colorpicker;
+
+import com.merkle.oss.magnolia.definition.builder.simple.AbstractConfiguredFieldDefinitionBuilder;
+
+import javax.annotation.Nullable;
+import java.util.Optional;
+
+/**
+ * builds a {@link ColorPickerFieldDefinition}
+ * @see <a href="https://vaadin.com/api/framework/current/com/vaadin/ui/ColorPicker.html">vaadin Docs - ColorPicker</a>
+ * @author Merkle DACH
+ */
+public class ColorPickerFieldDefinitionBuilder extends AbstractConfiguredFieldDefinitionBuilder<Integer, ColorPickerFieldDefinition, ColorPickerFieldDefinitionBuilder> {
+	@Nullable
+	private Boolean rgb;
+	@Nullable
+	private Boolean hsvv;
+	@Nullable
+	private Boolean swatches;
+	@Nullable
+	private Boolean history;
+	@Nullable
+	private Boolean textField;
+
+	public ColorPickerFieldDefinitionBuilder() {}
+	public ColorPickerFieldDefinitionBuilder(final ColorPickerFieldDefinition definition) {
+		super(definition);
+		rgb(definition.isRgb());
+		hsvv(definition.isHsvv());
+		swatches(definition.isSwatches());
+		history(definition.isHistory());
+		textField(definition.isTextField());
+	}
+
+	public ColorPickerFieldDefinitionBuilder rgb(final boolean rgb) {
+		this.rgb = rgb;
+		return self();
+	}
+
+	public ColorPickerFieldDefinitionBuilder rgb() {
+		return rgb(true);
+	}
+
+	public ColorPickerFieldDefinitionBuilder hsvv(final boolean hsvv) {
+		this.hsvv = hsvv;
+		return self();
+	}
+
+	public ColorPickerFieldDefinitionBuilder hsvv() {
+		return hsvv(true);
+	}
+
+	public ColorPickerFieldDefinitionBuilder swatches(final boolean swatches) {
+		this.swatches = swatches;
+		return self();
+	}
+
+	public ColorPickerFieldDefinitionBuilder swatches() {
+		return swatches(true);
+	}
+
+	public ColorPickerFieldDefinitionBuilder history(final boolean history) {
+		this.history = history;
+		return self();
+	}
+
+	public ColorPickerFieldDefinitionBuilder history() {
+		return history(true);
+	}
+
+	public ColorPickerFieldDefinitionBuilder textField(final boolean textField) {
+		this.textField = textField;
+		return self();
+	}
+
+	public ColorPickerFieldDefinitionBuilder textField() {
+		return textField(true);
+	}
+
+	public ColorPickerFieldDefinition build(final String name) {
+		final ColorPickerFieldDefinition definition = new ColorPickerFieldDefinition();
+		super.populate(definition, name);
+		Optional.ofNullable(rgb).ifPresent(definition::setRgb);
+		Optional.ofNullable(hsvv).ifPresent(definition::setHsvv);
+		Optional.ofNullable(swatches).ifPresent(definition::setSwatches);
+		Optional.ofNullable(history).ifPresent(definition::setHistory);
+		Optional.ofNullable(textField).ifPresent(definition::setTextField);
+		return definition;
+	}
+}

custom-definitions/src/main/java/com/merkle/oss/magnolia/definition/custom/colorpicker/ColorPickerFieldFactory.java

@@ -0,0 +1,19 @@
+package com.merkle.oss.magnolia.definition.custom.colorpicker;
+
+import com.vaadin.ui.Component;
+import info.magnolia.objectfactory.ComponentProvider;
+import info.magnolia.ui.field.factory.AbstractFieldFactory;
+
+public class ColorPickerFieldFactory extends AbstractFieldFactory<Integer, ColorPickerFieldDefinition> {
+	final ColorPickerFieldDefinition definition;
+
+	public ColorPickerFieldFactory(final ColorPickerFieldDefinition definition, final ComponentProvider componentProvider) {
+		super(definition, componentProvider);
+		this.definition = definition;
+	}
+
+	@Override
+	protected Component createFieldComponent() {
+		return new ColorPickerField(definition);
+	}
+}