swarm-ui: page shell + layout primitives

Structural foundation split out of hyperhive#3118 per mara's steer:
structure first so the real overview page (hive roster) and later
routes (swarm-wide agent roster) land as content changes rather than
each reinventing chrome + nav + a table/panel/chip shape.

- <Shell>: header bar (branding) + nav row, wraps every route. Route
  list lives in Shell itself (one small SPA, one place to know its
  own nav).
- ui/Panel, ui/StatusChip, ui/Table: the three primitives the
  overview page's actual scope (hive roster: name/domain/status,
  linking out to each hive's own dashboard) calls for, nothing
  speculative beyond that.

Preact-native styling (plain CSS files imported via swarm-ui.css, no
shadow DOM — this package renders into light DOM) — not
@hive/shared's chrome.css, which is the old MPA dashboard's visual
language. Same base16/Catppuccin color tokens via theme.css/colors.css
so it still reads as hyperhive.

npm run build (whole frontend workspace) + npm run typecheck both
clean. Verified with a real headless-chromium screenshot against the
built dist, not just source-reading.

Fixes hyperhive#3211
This commit is contained in:
iris 2026-08-12 21:05:12 +02:00 • committed by mara
commit 67eb0c660d
10 changed files with 224 additions and 29 deletions

View file

@ -0,0 +1,14 @@
// <Panel> — the one generic container primitive every route needs: a
// bordered surface with an optional title, no other opinions. Not a
// card-with-actions/footer/whatever kit — those get added the first
// time a real page actually needs one, not speculatively ahead of it.
import type { ComponentChildren } from 'preact';
export function Panel({ title, children }: { title?: string; children: ComponentChildren }) {
return (
<section class="ui-panel">
{title ? <h2 class="ui-panel-title">{title}</h2> : null}
<div class="ui-panel-body">{children}</div>
</section>
);
}