QColor API does not affect Color Input/Picker

[RobinSchfr]

I am using the ColorInput and the ColorPicker classes.
I want to add the functionality that the user can edit a color. So when a color is picked the color is saved in the ColorInput, and when the dialog gets opened again, the color should be set on the previous picked color (So the small circle should be on a actual position). In the current state no color is picked after opening the dialog.

My approach is to use the Qcolor API to set the default-value prop. But unfortunately no prop of the Qcolor API affects the ColorInput or the ColorPicker at all.

Here are some examples I've tried:

• ui.color_input(label='Color').props('default-value="#00ffff"')
• ui.color_input(label='Color').props('default-value=#00ffff')
• ui.color_input(label='Color').props('no-footer')
• ui.color_input(label='Color').props('default-view=tune')

Did I miss something? Does anyone have an idea how to implement my functionality?
Thanks in advance!

Addition:
Well, that's very astonishing. I just discovered that the older Documentation includes a color picker with the exact functionality that I have been hoping for. I guess this proves that it is technically possible to solve this bug.

[falkoschindler]

Very interesting. Thanks for spotting this, @RobinSchfr!

The problem seems to be that ui.color_input contains a ui.color_picker which in turn contains a q-color element. So in order to set the color of the popup window, you need to reach through this hierarchy:

color_input = ui.color_input('Color', value='#0000ff')
color_input.picker.default_slot.children[0].props('model-value="#0000ff"')

But ui.color_input shoud do that automatically. And ui.color_picker should also provide a convenient way to set the initial color.

[RobinSchfr]

Thank you very much, I'll take this quick fix for now. I'm glad that this was helpful for you.

[falkoschindler]

Commit e933862 add the correct initialization of the color picker.

[falkoschindler]

Tests are red. There's always a tiny difference between running locally and on GitHub. I'll fix it.

[RobinSchfr]

But unfortunately no prop of the Qcolor API affects the ColorInput or the ColorPicker at all.

I think it'll be good as well if you can apply props() directly to an ColorInputor ColorPicker object to change any Quasar prop.

e.g.

ui.color_input(label='Color').props('no-footer')
ui.color_input(label='Color').props('default-view=tune')

[falkoschindler]

@RobinSchfr in e933862 I introduced a member q_color so that you can access its props from outside:

color_input = ui.color_input()
color_input.picker.q_color.props('no-footer')

Using the props method directly from the color_input is tricky, because it's still a q-input with its own props. And picker.props() controls the q-menu component. Maybe we could introduce something like .picker_props(). But I think for now using .picker.q_color.props() is good enough.