Color picker UI does not update on drag (possibly related to SSR)
See original GitHub issueHi there — first off, thanks for making this!
I implemented this and I’m seeing the following error in console:
Warning: Prop `style` did not match. Server: "position:absolute;top:0px;right:0px;bottom:0px;left:0px;background:url(null) center left" Client: "position:absolute;top:0px;right:0px;bottom:0px;left:0px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAMUlEQVQ4T2NkYGAQYcAP3uCTZhw1gGGYhAGBZIA/nYDCgBDAm9BGDWAAJyRCgLaBCAAgXwixzAS0pgAAAABJRU5ErkJggg==) center left"
in div (created by Checkboard)
in Checkboard (created by Chrome)
We are using NextJS so I’m wondering if the issue comes from that.
Dragging still works in that it returns the proper value in onChange
, but it does not update the UI so it looks like it’s stuck.
Issue Analytics
- State:
- Created 3 years ago
- Reactions:5
- Comments:10
Top Results From Across the Web
Why is my React Color popup not updating? - Stack Overflow
However, when I open my popup and drag the selector in SketchPicker , the color in the UI does not update, and the...
Read more >CHANGELOG - Naive UI
Fix n-input-number may not update input when value is set in on-blur callback. ... Fix n-color-picker can't input alpha value correctly manually.
Read more >Color picker color selector doesn't work in IE11 - Telerik
Hello, I have recently implemented the Color Picker in my site and I'm having issues in IE 11. The color picker opens, however,...
Read more >Changelog - Shoelace
Breaking changes in components with the Stable badge will not be accepted ... a bug in <sl-color-picker> that sometimes prevented the color from...
Read more >Changelog | High Definition RP | 13.1.9 - Unity - Manual
Fixed Nans happening due to volumetric clouds when the pixel color is ... Fixed Render Graph Debug UI not refreshing correctly in the...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@hkurra drag is working, but sketchpicker is not moving, it remains unchanged does not reflect color change.
You can solve this by loading the ChromePicker on the client using Next.js dynamic imports. https://nextjs.org/docs/advanced-features/dynamic-import