ryanamay/inkdrop-command-palette
1
0
Fork 0
mirror of https://github.com/ryanamay/inkdrop-command-palette.git synced 2024-09-20 01:40:34 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

fixed popup issue

Browse source
This commit is contained in:
fuwaa 2022-08-22 15:17:43 +08:00
parent 2c6a630093
commit dbf66e6b42
No known key found for this signature in database
GPG key ID: 7CE0BF0D3175E2DC
3 changed files with 6 additions and 25 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
cz.json
View file

@ -1,7 +0,0 @@
{
"commitizen": {
"name": "cz_conventional_commits",
"version": "0.0.1",
"tag_format": "v0.0.1"
}
}

2
keymaps/wordcount.json
View file

@ -1,5 +1,5 @@
{ {
"body": { "body": {
"ctrl-shift-,": "commandpalette:toggle" "ctrl-k": "commandpalette:toggle"
} }
} }

22
lib/components/palette.js
View file

@ -7,8 +7,6 @@ const CommandPalette = (props) => {
const modal = useModal(); const modal = useModal();
const { Dialog } = inkdrop.components.classes; const { Dialog } = inkdrop.components.classes;
const searchRef = useRef(null);
const toggle = useCallback(() => { const toggle = useCallback(() => {
modal.show(); modal.show();
logger.debug("Dialog was toggled!"); logger.debug("Dialog was toggled!");
@ -21,23 +19,14 @@ const CommandPalette = (props) => {
return () => sub.dispose(); return () => sub.dispose();
}, [toggle]); }, [toggle]);
// focus text box when dialog is shown
useLayoutEffect(() => { useLayoutEffect(() => {
document setTimeout(() => {
.getElementById("cpInput") const textbox = document.getElementById("cpInput");
.addEventListener("visibilitychange", onVisibilityChange); textbox.focus();
}, 50);
return () =>
document
.getElementById("cpInput")
.removeEventListener("visibilitychange", onVisibilityChange);
}); });
const onVisibilityChange = () => {
if (element.classList.contains("visible")) {
document.getElementById("cpInput").focus();
}
};
return ( return (
<Dialog {...modal.state} onBackdropClick={modal.close}> <Dialog {...modal.state} onBackdropClick={modal.close}>
<Dialog.Content className="commandpalette"> <Dialog.Content className="commandpalette">
@ -50,7 +39,6 @@ const CommandPalette = (props) => {
spellCheck="false" spellCheck="false"
className="cpInput" className="cpInput"
id="cpInput" id="cpInput"
ref={searchRef}
/> />
</div> </div>
</div> </div>