diff --git a/packages/hub-ui/src/client/components/dock/Dock.vue b/packages/hub-ui/src/client/components/dock/Dock.vue index 9545a95e..61d3f9bc 100644 --- a/packages/hub-ui/src/client/components/dock/Dock.vue +++ b/packages/hub-ui/src/client/components/dock/Dock.vue @@ -6,7 +6,7 @@ import { useEventListener, useScreenSafeArea, whenever } from '@vueuse/core' import { computed, onMounted, reactive, ref, useTemplateRef } from 'vue' import { BUILTIN_ENTRY_CLIENT_AUTH_NOTICE } from '../../constants' import { docksSplitGroupsWithCapacity } from '../../state/dock-settings' -import { setDocksOverflowPanel } from '../../state/floating-tooltip' +import { setDocksOverflowPanel, useDocksGroupPanel } from '../../state/floating-tooltip' import { useIsRpcTrusted } from '../../utils/useIsRpcTrusted' import BrandMark from '../icons/BrandMark.vue' import { @@ -175,9 +175,15 @@ function bringUp() { const isHidden = computed(() => false) +// An open group menu popover anchors to a dock-bar button — collapsing the rail +// out from under it would leave the menu floating, detached from its trigger. +const docksGroupPanel = useDocksGroupPanel() + const isMinimized = computed(() => { if (context.panel.store.inactiveTimeout < 0) return false + if (docksGroupPanel.value) + return false if (context.panel.store.inactiveTimeout === 0) return true // @ts-expect-error compatibility diff --git a/packages/hub-ui/src/client/components/dock/DockEdge.vue b/packages/hub-ui/src/client/components/dock/DockEdge.vue index 169b0fb8..de354a4e 100644 --- a/packages/hub-ui/src/client/components/dock/DockEdge.vue +++ b/packages/hub-ui/src/client/components/dock/DockEdge.vue @@ -7,7 +7,7 @@ import { useEventListener } from '@vueuse/core' import { computed, h, onMounted, ref, useTemplateRef } from 'vue' import { getEntryGroup } from '../../state/dock-settings' import { sharedStateToRef } from '../../state/docks' -import { setEdgePositionDropdown, setFloatingTooltip, useEdgePositionDropdown } from '../../state/floating-tooltip' +import { setEdgePositionDropdown, setFloatingTooltip, useDocksGroupPanel, useEdgePositionDropdown } from '../../state/floating-tooltip' import { useIframePanes } from '../../utils/useIframePanes' import BrandMark from '../icons/BrandMark.vue' import ViewEntry from '../views/ViewEntry.vue' @@ -60,6 +60,10 @@ function bringUp() { }, +store.inactiveTimeout || 0) } +// An open group menu popover anchors to a toolbar button — collapsing the +// toolbar out from under it would leave the menu floating, detached from it. +const docksGroupPanel = useDocksGroupPanel() + const isCollapsed = computed(() => { if (!settings.value.autoCollapseEdgeToolbar) return false @@ -67,6 +71,8 @@ const isCollapsed = computed(() => { return false if (context.panel.isDragging) return false + if (docksGroupPanel.value) + return false if (hasPanelContent.value) return false if (store.inactiveTimeout === 0)