inkreachhub/inkreach-agent
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(plugins): 悬浮胶囊细节修正——药丸收窄加高、面板高度自适应、区域头控件收拢

Browse Source
This commit is contained in:
Rick Ye
2026-09-11 16:08:56 +08:00
parent 781a6c8beb
commit a052b6a2c4
3 changed files with 9 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/desktop/src/renderer/src/plugins/PluginFloatingCapsule.tsx
+7 -7
View File
@@ -166,7 +166,7 @@ export function PluginFloatingCapsule({
type="button"
title="插件状态（点击展开）"
onClick={() => setOpen(true)}
className="flex max-w-48 shrink-0 items-center gap-1.5 rounded-full border border-line bg-surface px-2 py-0.5 text-[11px] leading-[18px] text-ink-2 shadow-card transition-colors hover:border-line-strong hover:text-ink"
className="flex h-7 max-w-36 shrink-0 items-center gap-1.5 rounded-full border border-line bg-surface px-2.5 text-[11.5px] text-ink-2 shadow-card transition-colors hover:border-line-strong hover:text-ink"
>
<span
aria-hidden
@@ -185,25 +185,25 @@ export function PluginFloatingCapsule({
return (
<div ref={rootRef} className="relative shrink-0">
<div className="absolute right-0 top-full z-50 mt-1.5 flex w-80 flex-col overflow-hidden rounded-card border border-line bg-surface text-left shadow-overlay">
{/* 固定高度内容区：分组手风琴 + 溢出滚动 */}
<div className="h-[min(480px,58vh)] overflow-y-auto overscroll-contain px-1.5 py-1.5">
{/* 最大高度封顶，高度随内容自适应；溢出才滚动 */}
<div className="max-h-[min(480px,58vh)] overflow-y-auto overscroll-contain px-1.5 py-1.5">
{[...byPlugin.entries()].map(([pluginId, pluginEntries], areaIdx) => {
const plugin = plugins.find((p) => p.manifest.id === pluginId)
const areaCollapsed = collapsedAreas.includes(pluginId)
return (
<div key={pluginId} className={areaIdx > 0 ? 'mt-1 border-t border-line pt-1' : ''}>
{/* 区域头 = 插件名；第一个区域右侧是收回药丸的 ⤡ */}
<div className="flex w-full items-center gap-1 rounded-control pr-0.5">
{/* 区域头 = 插件名；控件只占自身大小（图标/箭头贴标题），第一个区域右侧是收回药丸的 ⤡ */}
<div className="flex items-center gap-0.5 px-1 py-0.5">
<button
type="button"
aria-expanded={!areaCollapsed}
onClick={() => toggleArea(pluginId)}
className="flex min-w-0 flex-1 items-center gap-1.5 rounded-control px-2 py-1.5 text-left transition-colors hover:bg-hover"
className="flex min-w-0 items-center gap-1.5 rounded-control px-1.5 py-1 text-left transition-colors hover:bg-hover"
>
{plugin ? (
<PluginIconValue icon={plugin.manifest.icon} size={14} className="shrink-0 text-ink-2" />
) : null}
<span className="min-w-0 flex-1 truncate text-[12.5px] font-medium text-ink">
<span className="min-w-0 truncate text-[12.5px] font-medium text-ink">
{plugin?.manifest.name ?? pluginId}
</span>
<LuChevronDown