mirror of
https://github.com/solidtime-io/solidtime.git
synced 2026-08-18 21:22:15 +01:00
add focus trap to tag dropdown to fix focus management
This commit is contained in:
@@ -6,6 +6,7 @@ import TagCreateModal from '@/packages/ui/src/Tag/TagCreateModal.vue';
|
||||
import MultiselectDropdownItem from '@/packages/ui/src/Input/MultiselectDropdownItem.vue';
|
||||
import type { Tag } from '@/packages/api/src';
|
||||
import type { Placement } from '@floating-ui/vue';
|
||||
import {UseFocusTrap} from "@vueuse/integrations/useFocusTrap/component";
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
@@ -177,6 +178,9 @@ const showCreateTagModal = ref(false);
|
||||
<slot name="trigger"></slot>
|
||||
</template>
|
||||
<template #content>
|
||||
<UseFocusTrap
|
||||
v-if="open"
|
||||
:options="{ immediate: true, allowOutsideClick: true }">
|
||||
<input
|
||||
ref="searchInput"
|
||||
:value="searchValue"
|
||||
@@ -217,6 +221,7 @@ const showCreateTagModal = ref(false);
|
||||
<span>Create new Tag</span>
|
||||
</button>
|
||||
</div>
|
||||
</UseFocusTrap>
|
||||
</template>
|
||||
</Dropdown>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user