diff --git a/app/src/menus/Menu.ts b/app/src/menus/Menu.ts index bea1495640b..bc32c4669f6 100644 --- a/app/src/menus/Menu.ts +++ b/app/src/menus/Menu.ts @@ -61,6 +61,9 @@ export class Menu { } public showSubMenu(subMenuElement: HTMLElement) { + subMenuElement.querySelectorAll(".b3-list-item--focus").forEach((item) => { + item.classList.remove("b3-list-item--focus"); + }); const itemRect = subMenuElement.parentElement.getBoundingClientRect(); subMenuElement.style.top = (itemRect.top - 8) + "px"; subMenuElement.style.left = (itemRect.right + 8) + "px"; diff --git a/app/src/menus/workspace.ts b/app/src/menus/workspace.ts index fb6930b017e..1dac78af310 100644 --- a/app/src/menus/workspace.ts +++ b/app/src/menus/workspace.ts @@ -357,7 +357,7 @@ export const workspaceMenu = (app: App, rect: DOMRect) => { return a.name.localeCompare(b.name, undefined, {numeric: true}); }).forEach((item: ISaveLayout) => { if (inputElement.value === "" || item.name.toLowerCase().indexOf(inputElement.value.toLowerCase()) > -1) { - html += `
+ html += `
${item.name}
${item.time ? dayjs(item.time).format("YYYY-MM-DD HH:mm") : ""} @@ -370,14 +370,18 @@ export const workspaceMenu = (app: App, rect: DOMRect) => { }; const inputElement = menuElement.querySelector(".b3-text-field") as HTMLInputElement; const listElement = menuElement.querySelector(".b3-list"); + inputElement.addEventListener("focus", () => { + const listItemElement = inputElement.nextElementSibling?.querySelector(".b3-list-item"); + listItemElement?.classList.add("b3-list-item--focus"); + }); inputElement.addEventListener("keydown", (event) => { event.stopPropagation(); if (event.isComposing) { return; } upDownHint(listElement, event); - if (event.key === "Escape") { - window.siyuan.menus.menu.remove(); + if (event.key === "Escape" || (event.key === "ArrowLeft" && inputElement.value === "")) { + window.siyuan.menus.menu.remove(true); } else if (event.key === "Enter") { const currentElement = listElement.querySelector(".b3-list-item--focus"); if (currentElement) { @@ -394,6 +398,8 @@ export const workspaceMenu = (app: App, rect: DOMRect) => { } event.stopPropagation(); listElement.innerHTML = genListHTML(); + const listItemElement = inputElement.nextElementSibling?.querySelector(".b3-list-item"); + listItemElement?.classList.add("b3-list-item--focus"); }); listElement.addEventListener("click", (event: MouseEvent) => { if (window.siyuan.config.readonly) {