dtoro
bd44626532
Every place that showed entity detail (Knowledge Base's right sidebar, the EntitySheet drawer used by Knowledge and the chat session graph, the standalone /entity/:slug page) now opens the entity in its own floating, draggable, resizable window instead — several can be open side by side, and clicking a relation inside one opens another, building up a stack. Windows are managed by one global wmkit instance (new $lib/stores/windows.ts + $lib/components/EntityDesktop.svelte, mounted once in App.svelte), themed with the app's own card/border/ring tokens rather than wmkit's bundled themes (app.css). - Delete EntitySheet.svelte (redundant) and the KnowledgeBase resizable detail pane; row/graph-node click handlers now call openEntityWindow(slug) instead of setting local sidebar state. - SessionGraph (chat's "Scope" mini-graph): clicking a node opens its window directly instead of a click-through mini-detail panel with its own resize handle and "Full detail" button — that whole subsystem is now dead and removed. Node highlight ring is kept (still useful to see what you last opened) and now clears itself via an effect watching the shared window-manager store, so closing a window drops the highlight instead of leaving it pointing at nothing — same fix applied to Knowledge Base's row highlight. - Compact the entity-detail panel's padding (container + each DetailSection) now that it's typically viewed in a small window rather than a full-height sidebar. - Fix KnowledgeBase's browse pane losing its flex-1/min-w-0 (and thus full width) when the wrapping single-child div around it was removed along with the old detail-pane split. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
47 lines
1.9 KiB
Svelte
47 lines
1.9 KiB
Svelte
<script lang="ts">
|
|
// Global floating-window layer — mounted once in App.svelte, above every
|
|
// page, so an entity opened from Knowledge Base, chat, or anywhere else
|
|
// lands in the same window stack instead of each page owning its own
|
|
// single-entity sidebar/sheet. See $lib/stores/windows.ts.
|
|
import { dk, wmState, openEntityWindow } from '$lib/stores/windows'
|
|
import EntityDetailContent from './EntityDetailContent.svelte'
|
|
import XIcon from '@lucide/svelte/icons/x'
|
|
import MinusIcon from '@lucide/svelte/icons/minus'
|
|
</script>
|
|
|
|
<div use:dk.desktop class="pointer-events-none fixed inset-0 z-40">
|
|
{#each $wmState.order as id (id)}
|
|
{@const win = $wmState.windows[id]}
|
|
{#if win}
|
|
<section use:dk.window={{ id }} class="min-w-0" aria-label={win.title}>
|
|
<header data-wm-drag class="flex shrink-0 cursor-move items-center justify-between gap-2 border-b bg-muted/40 px-3 py-1.5">
|
|
<span data-wm-title class="min-w-0 flex-1 truncate font-mono text-xs font-medium">{win.title}</span>
|
|
<div class="flex shrink-0 items-center gap-0.5">
|
|
<button
|
|
type="button"
|
|
data-wm-minimize
|
|
class="rounded p-1 text-muted-foreground hover:bg-muted hover:text-foreground"
|
|
aria-label="Minimize {win.title}"
|
|
>
|
|
<MinusIcon class="size-3.5" />
|
|
</button>
|
|
<button
|
|
type="button"
|
|
data-wm-close
|
|
class="rounded p-1 text-muted-foreground hover:bg-destructive/10 hover:text-destructive"
|
|
aria-label="Close {win.title}"
|
|
>
|
|
<XIcon class="size-3.5" />
|
|
</button>
|
|
</div>
|
|
</header>
|
|
<div data-wm-content class="min-h-0 flex-1 overflow-hidden">
|
|
{#key id}
|
|
<EntityDetailContent slug={id} onSelectEntity={openEntityWindow} />
|
|
{/key}
|
|
</div>
|
|
</section>
|
|
{/if}
|
|
{/each}
|
|
</div>
|