sugoidogo/modrinth
1
0
Fork 0
mirror of https://github.com/modrinth/code.git synced 2026-08-25 00:55:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: dropdown panel at 0,0 (#7024)

Browse Source
This commit is contained in:
Calum H.
2026-08-06 15:10:46 +00:00
committed by GitHub
parent a89711841d
commit c671ca52f6
1 changed files with 8 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ui/src/components/base/DropdownFilterBar.vue
+8 -6
View File
@@ -387,7 +387,7 @@ import { OverlayScrollbars, type PartialOptions } from 'overlayscrollbars'
import type { Component, ComponentPublicInstance, CSSProperties } from 'vue' import type { Component, ComponentPublicInstance, CSSProperties } from 'vue'
import { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue' import { computed, nextTick, onBeforeUnmount, ref, watch } from 'vue'
import { Button, type ButtonSize } from '#ui/components/base/buttons' import { Button, type ButtonElementHandle, type ButtonSize } from '#ui/components/base/buttons'
import { useVirtualScroll } from '../../composables/virtual-scroll' import { useVirtualScroll } from '../../composables/virtual-scroll'
import MultiSelect, { type MultiSelectItem } from './MultiSelect.vue' import MultiSelect, { type MultiSelectItem } from './MultiSelect.vue'
@@ -554,7 +554,7 @@ const isCursorInsideSubmenu = ref(false)
const hasSubmenuPosition = ref(false) const hasSubmenuPosition = ref(false)
const isMobileAddMenuLayout = ref(false) const isMobileAddMenuLayout = ref(false)
const submenuOpenDirection = ref<SubmenuOpenDirection>('right') const submenuOpenDirection = ref<SubmenuOpenDirection>('right')
const addMenuTrigger = ref<HTMLElement | null>(null) const addMenuTrigger = ref<ButtonElementHandle | null>(null)
const menuContainer = ref<HTMLElement | null>(null) const menuContainer = ref<HTMLElement | null>(null)
const submenu = ref<HTMLElement | null>(null) const submenu = ref<HTMLElement | null>(null)
const activeCategoryOptionsScrollbar = ref<HTMLElement | null>(null) const activeCategoryOptionsScrollbar = ref<HTMLElement | null>(null)
@@ -732,8 +732,9 @@ const addMenuTransitionEnterActiveClass = computed(() =>
const addMenuTransitionEnterFromClass = computed(() => const addMenuTransitionEnterFromClass = computed(() =>
isMobileAddMenuLayout.value ? 'opacity-100' : 'opacity-0', isMobileAddMenuLayout.value ? 'opacity-100' : 'opacity-0',
) )
const addMenuTriggerElement = computed(() => addMenuTrigger.value?.element ?? null)
const addMenuOutsideClickTarget = computed(() => menuContainer.value ?? submenu.value) const addMenuOutsideClickTarget = computed(() => menuContainer.value ?? submenu.value)
const addMenuOutsideClickIgnore = computed(() => [addMenuTrigger, menuContainer, submenu]) const addMenuOutsideClickIgnore = computed(() => [addMenuTriggerElement, menuContainer, submenu])
const appliedFilterPreviews = computed(() => const appliedFilterPreviews = computed(() =>
Object.entries(props.modelValue) Object.entries(props.modelValue)
@@ -984,7 +985,7 @@ function handleAddMenuKeydown(event: KeyboardEvent) {
event.preventDefault() event.preventDefault()
closeAddMenu() closeAddMenu()
nextTick(() => addMenuTrigger.value?.focus()) nextTick(() => addMenuTriggerElement.value?.focus())
} }
function setCategoryButtonRef( function setCategoryButtonRef(
@@ -1585,11 +1586,12 @@ function triangleArea(a: Point, b: Point, c: Point): number {
function updateAddMenuPosition(): boolean { function updateAddMenuPosition(): boolean {
const positioningElement = const positioningElement =
menuContainer.value ?? (isMobileActiveSubmenu.value ? submenu.value : null) menuContainer.value ?? (isMobileActiveSubmenu.value ? submenu.value : null)
if (typeof window === 'undefined' || !addMenuTrigger.value || !positioningElement) { const triggerElement = addMenuTriggerElement.value
if (typeof window === 'undefined' || !triggerElement || !positioningElement) {
return false return false
} }
const triggerRect = addMenuTrigger.value.getBoundingClientRect() const triggerRect = triggerElement.getBoundingClientRect()
const dropdownWidth = Math.max(ADD_MENU_WIDTH, triggerRect.width) const dropdownWidth = Math.max(ADD_MENU_WIDTH, triggerRect.width)
addMenuStyle.value = { addMenuStyle.value = {