self-hosted/it-tools
self-hosted/it-tools
1
0
Fork 0
mirror of https://github.com/CorentinTh/it-tools synced 2024-07-08 03:25:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(search-bar): use cmd + k to focus on mac

Browse Source
This commit is contained in:
Corentin Thomasset 2022-12-21 00:21:12 +01:00
parent bfc2e24bbf
commit bf88836dbe
No known key found for this signature in database
GPG Key ID: DBD997E935996158
1 changed files with 10 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/SearchBar.vue
View File

@ -40,16 +40,25 @@ const keys = useMagicKeys({
if (e.ctrlKey && e.key === 'k' && e.type === 'keydown') {
e.preventDefault();
}
if (e.metaKey && e.key === 'k' && e.type === 'keydown') {
e.preventDefault();
}
},
});
whenever(keys.ctrl_k, () => {
focusTarget.value.focus();
});
whenever(keys.meta_k, () => {
focusTarget.value.focus();
});
function renderOption({ tool }: { tool: Tool }) {
return h(SearchBarItem, { tool });
}
const isMac = computed(() => window.navigator.userAgent.toLowerCase().includes('mac'));
</script>
<template>
@ -68,7 +77,7 @@ function renderOption({ tool }: { tool: Tool }) {
ref="focusTarget"
round
clearable
placeholder="Search a tool... [Ctrl + K]"
:placeholder="`Search a tool (use ${isMac ? 'Cmd' : 'Ctrl'} + K to focus)`"
:value="slotValue"
:input-props="{ autocomplete: 'disabled' }"
@input="handleInput"