diff --git a/packages/web/components/filter.tsx b/packages/web/components/filter.tsx
index c0ab4149..2da6d049 100644
--- a/packages/web/components/filter.tsx
+++ b/packages/web/components/filter.tsx
@@ -89,7 +89,7 @@ export function FilterList({
function updateFilter(originalPhrase: string) {
let foundExactMatch = false;
let results = fuzzySorter(originalPhrase, options);
- if (allowNew && !foundExactMatch) {
+ if (allowNew && !foundExactMatch && originalPhrase) {
results.push({
name: originalPhrase,
hint: newHint,
@@ -121,6 +121,8 @@ export function FilterList({
};
}, []);
+ let exiting = false;
+
const returnEl = (
@@ -133,7 +135,9 @@ export function FilterList({
ref={searchBoxRef}
onChange={filterUpdate}
onBlur={(e) => {
- searchBoxRef.current!.focus();
+ if (!exiting) {
+ searchBoxRef.current!.focus();
+ }
}}
onKeyDown={(e: React.KeyboardEvent) => {
// console.log("Key up", e);
@@ -150,10 +154,24 @@ export function FilterList({
);
break;
case "Enter":
+ exiting = true;
onSelect(matchingOptions[selectedOption]);
e.preventDefault();
break;
+ case "PageUp":
+ setSelectionOption(Math.max(0, selectedOption - 5));
+ break;
+ case "PageDown":
+ setSelectionOption(Math.max(0, selectedOption + 5));
+ break;
+ case "Home":
+ setSelectionOption(0);
+ break;
+ case "End":
+ setSelectionOption(matchingOptions.length - 1);
+ break;
case "Escape":
+ exiting = true;
onSelect(undefined);
break;
case " ":
diff --git a/packages/web/styles/filter_box.scss b/packages/web/styles/filter_box.scss
index 9e16e1e7..1783b5cb 100644
--- a/packages/web/styles/filter_box.scss
+++ b/packages/web/styles/filter_box.scss
@@ -10,7 +10,7 @@
top: 0;
bottom: 0;
max-height: 290px;
- overflow: hide;
+ // overflow: hide;
z-index: 100;
}
@@ -19,7 +19,8 @@
background-color: #fff;
border: rgb(103, 103, 103) 1px solid;
border-radius: 8px;
- box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
+ box-shadow: rgba(0, 0, 0, 0.35) 0px 20px 20px;
+ overflow: hidden;
margin: 10px;
.header {
@@ -55,7 +56,7 @@
}
.result-list {
- max-height: 200px;
+ max-height: 216px;
overflow-y: scroll;
.icon {
@@ -70,11 +71,14 @@
.selected-option {
padding: 8px;
cursor: pointer;
+ height: 20px;
+ line-height: 20px;
}
.selected-option {
background-color: var(--highlight-color);
color: #eee;
+ // border-radius: 5px;
}
.option .hint,
diff --git a/website/CHANGELOG.md b/website/CHANGELOG.md
index b5d0aad6..a157b53a 100644
--- a/website/CHANGELOG.md
+++ b/website/CHANGELOG.md
@@ -5,4 +5,10 @@ An attempt at documenting of the changes/new features introduced in each (pre) r
* Plugs can implement their own unfurlers by responding to the `unfurl:options` event (see the [Twitter plug](https://github.com/silverbulletmd/silverbullet-twitter) for an example).
* Core implements only one unfurl option: “Extract title” which pulls the `
` tag from the linked URL and replaces it with a `[bla](URL)` style link.
* Removed status bar: to further simplify the SB UI. You can still pull up the same stat on demand with the `Stats: Show` command.
+* The page switcher is now maintaining its ordering based on, in order:
+ 1. Last opened pages (in current session)
+ 2. Last modified date (on disk)
+ 3. Everything else
+ 4. The currently open page (at the bottom)
+* Filter boxes (used for the page switching and command palette among other things) now also support PgUp, PgDown, Home and End and have some visual glitches fixed as well.
* Reverted exposing an empty `window` object to sandboxes running in workers and node.js (introduced in 0.0.28)