frontend: shared <hive-warn> component for inline warning banners
Consolidates three independently-written instances of the same thing: .cred-warning (credentials.html, static markup), .tombstone-warn (core.js, JS-built), .port-conflict (swarm.js, JS-built) -- the first two differed only by an undeliberate 10% vs 8% tint, the strongest argument this was drift rather than three genuinely different needs. New autonomous custom element, frontend/packages/shared/src/hive-warn/, matching the established one-component-one-dir shadow-DOM pattern (hive-btn, hive-toast, hive-dialog). Purely presentational -- no lifecycle beyond attaching its shadow root once, no attributeChangedCallback needed since severity/pulse are read directly by :host([...]) CSS selectors rather than mirrored onto an inner element. Content passes through via a single default <slot>, so every call site keeps writing its existing <strong>/<code> markup unchanged. API: <hive-warn> (amber, default) / <hive-warn severity="red"> for an active incident vs a standing caveat, plus an opt-in pulse boolean modifier (only the port-collision banner wants it -- a banner that's always present and always pulsing just trains you to stop seeing it). Tint is a single canonical 8% for both severities now, replacing the 10%/8% split. Registered once in dashboard's common.js (same side-effect-import pattern as <hive-side-panel>) so every dashboard page picks it up without a per-file import, since all three call sites (core.js, swarm.js, credentials.js) already transitively import it. Verified: npm run build clean for both dashboard and agent packages, grepped source for leftover cred-warning/tombstone-warn/port-conflict references (none), confirmed hive-warn/HiveWarn/hive-warn-pulse present in every affected dist bundle, confirmed the still-live questions-pulse keyframe (.questions) untouched.
This commit is contained in:
parent
7ef0e8c788
commit
dfd92a7da9
9 changed files with 99 additions and 39 deletions
|
|
@ -6,6 +6,7 @@
|
|||
import { linkify as termLinkify } from '@hive/shared/terminal.js';
|
||||
import { el } from '@hive/shared/dom.js';
|
||||
import '@hive/shared/side-panel.js'; // registers <hive-side-panel> — side-effect import
|
||||
import '@hive/shared/hive-warn.js'; // registers <hive-warn> — side-effect import
|
||||
import DOMPurify from 'dompurify';
|
||||
|
||||
// ─── helpers ────────────────────────────────────────────────────────────
|
||||
|
|
|
|||
Loading…
Reference in a new issue