tatulund / colorpicker Goto Github PK
View Code? Open in Web Editor NEWColorPicker component for Vaadin 23.1 and newer versions
License: Other
ColorPicker component for Vaadin 23.1 and newer versions
License: Other
The color picker only shows the string captions for colors when the combo-box is dropped down. Can it be made to show the rendered caption of the selected color? Right now the color box has the right color, but the text field is left blank.
Also, would it be possible to optionally allow custom rendering code to render the caption string? Or perhaps allow it to be a component? We have a use case where we want more formatting than just a simple text string insertion.
Thank you much.
I have been trying tt get this to work with Vaadin 24.1.7
I have implemented it as per the code displayed in the Vaadin directory for the add-on.
Once the page is up and running and I inspect where the color picker should be all I see is (As per the screenshot)
I have included the correct version as per the POM file
I have tried to do a full clean of the build and re-implement but I still run into this issue.
Are you able to test against this version and see if it works ? Or see what could be causing this issue ?
When an invalid string is entered, the color picker becomes invalid and its value becomes null. Is there a way to make the color picker default to a particular color when invalid input is entered, so that the color picker should never actually be in an invalid state?
I tried something like:
colorPicker.addValueChangeListener(event -> {
if (event.getValue() == null) {
colorPicker.setValue(defaultColor);
}
colorPicker.setInvalid(false);
});
but this didn't have the desired effect. The color picker did switch to the default color, but it also remained invalid.
I also tried:
binder.forField(colorPicker)
.withConverter(pres -> pres == null ? defaultColor : pres, model -> model == null ? defaultColor : model)
.bind(...)
but this didn't work either - the color picker still appeared invalid, and the color swatch on the left was black instead of the default color.
Thanks for your help, and thanks for creating this component! It's really handy.
Calling setReadOnly(false) on a ColorPicker instance results in this state:
This seems to be caused by css rules that check only for the existence of the attribute, like this one:
:host([readonly]) #colorpicker {
background: transparent;
border: 1px dashed var(--lumo-contrast-30pct);
pointer-events: none;
}
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.