mirror of
https://github.com/windmill-labs/windmill.git
synced 2026-10-13 08:02:47 +00:00
The band is a single element whose placement is styled rather than branched: a page
registering a side-panel inset used to swap it between two `{#if}` arms, destroying the
header and rebuilding it a frame later — a blink of no header with the content sliding
up into the gap.
The workspace and its fork become one breadcrumb part: the name leads home (inert in a
session, where the workspace is the session's scope rather than a place to go) and one
chevron opens the picker, which already expands a family to reach its forks. The
picker's panel hangs from the part's left edge, opens with the active family expanded,
and closes before the switch runs — the switch renames the workspace, which moves the
trigger the panel hangs from, and floating-ui was chasing it across the viewport.
The item's path is a plain label rather than a row of pickers: same separators and
weight, and a click copies it with its own confirmation. The kind icon goes, the page
below says what kind it is.
Around them: a "prod" badge for a root workspace, the session's acting fork beside the
session's name rather than in the breadcrumb, the edit-in-dev affordance as a button in
the header, the drafts count as a sentence, and a fade when the workspace changes under
a page that stays mounted.
Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
40 lines
917 B
Svelte
40 lines
917 B
Svelte
<!--
|
|
@component
|
|
Fills the layout's page header from the route that mounts it: the breadcrumb (an item's path, or a
|
|
section name for a list) and the page's own buttons. Renders nothing itself.
|
|
|
|
Only a route page mounts this. An editor nested in a session pane or a drawer must not take over
|
|
the header, so nesting is decided by the caller rather than guessed from context.
|
|
-->
|
|
<script lang="ts">
|
|
import { onMount } from 'svelte'
|
|
import { pageHeader, type PageHeaderContent } from './pageHeaderRegistry.svelte'
|
|
|
|
let {
|
|
item,
|
|
section,
|
|
hint,
|
|
actions,
|
|
actionsOrder,
|
|
contexts,
|
|
barPlacement,
|
|
actingWorkspaceId,
|
|
barRightInset
|
|
}: PageHeaderContent = $props()
|
|
|
|
onMount(() => {
|
|
const id = pageHeader.register(() => ({
|
|
item,
|
|
section,
|
|
hint,
|
|
actions,
|
|
actionsOrder,
|
|
contexts,
|
|
barPlacement,
|
|
actingWorkspaceId,
|
|
barRightInset
|
|
}))
|
|
return () => pageHeader.release(id)
|
|
})
|
|
</script>
|