DropdownInput preview support and ColorButton history improvements (#1598)

* DropdownInput support preview

* fix typo and rm logs

* Add previewable flag

* fix cr typos

* Improve color button history

* rename

* update dropdown preview behaviour

* Color picker preset color

* Another way to handle blend mode preview

* Apply suggestions from code review

* Use on_commit instead of on_update for some dropdowns

* Debugging progress

* add debug

* active not equal to highlight in some cases

* rm logs

---------

Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
zhiyuan
2024-04-29 17:03:58 -07:00
committed by GitHub
co-authored by Keavon Chambers
parent 282969df3d
commit e769f50877
11 changed files with 97 additions and 51 deletions
@@ -19,7 +19,7 @@
let scroller: LayoutCol | undefined;
let searchTextInput: TextInput | undefined;
const dispatch = createEventDispatcher<{ open: boolean; activeEntry: MenuListEntry; naturalWidth: number }>();
const dispatch = createEventDispatcher<{ open: boolean; activeEntry: MenuListEntry; hoverInEntry: MenuListEntry; hoverOutEntry: undefined; naturalWidth: number }>();
export let entries: MenuListEntry[][];
export let activeEntry: MenuListEntry | undefined = undefined;
@@ -164,7 +164,10 @@
}
function onEntryPointerEnter(menuListEntry: MenuListEntry) {
if (!menuListEntry.children?.length) return;
if (!menuListEntry.children?.length) {
dispatch("hoverInEntry", menuListEntry);
return;
}
let childReference = getChildReference(menuListEntry);
if (childReference) {
@@ -174,7 +177,10 @@
}
function onEntryPointerLeave(menuListEntry: MenuListEntry) {
if (!menuListEntry.children?.length) return;
if (!menuListEntry.children?.length) {
dispatch("hoverOutEntry");
return;
}
let childReference = getChildReference(menuListEntry);
if (childReference) {
@@ -346,9 +352,9 @@
highlighted = newHighlight;
// Interactive menus should keep the active entry the same as the highlighted one
if (interactive && newHighlight?.value !== activeEntry?.value && newHighlight) {
dispatch("activeEntry", newHighlight);
}
// if (interactive && newHighlight?.value !== activeEntry?.value && newHighlight) {
// dispatch("activeEntry", newHighlight);
// }
// Scroll into view
let container = scroller?.div?.();