@hoox-sh/hoox-tui 0.3.2 → 0.4.0

package/src/view-registry.tsx

@@ -8,7 +8,7 @@
  * View registry — single source of truth for view factories, sidebar items,
  * keyboard shortcuts, and command-palette view commands.
  */
-import type { ViewId } from "@hoox-sh/hoox-shared";
+import { VIEW_IDS, type ViewId } from "@hoox-sh/hoox-shared";
 import type { DialogHandle } from "./components/ui/dialog";
 import type { CommandEntry } from "./components/shared/command-palette";
 
@@ -247,25 +247,7 @@ export function isRegisteredViewId(id: unknown): id is ViewId {
 /** Compile-time exhaustiveness helper (call once at module load). */
 function assertFullCoverage(entries: ViewRegistryEntry[]): void {
   const ids = new Set(entries.map((e) => e.id));
-  const required: ViewId[] = [
-    "dashboard",
-    "workers",
-    "worker-detail",
-    "trade-monitor",
-    "logs-viewer",
-    "service-manager",
-    "config-editor",
-    "setup-wizard",
-    "settings",
-    "queue-depth",
-    "kv-viewer",
-    "secrets-viewer",
-    "db-query",
-    "ai-chat",
-    "edge-topology",
-    "worker-settings",
-  ];
-  for (const id of required) {
+  for (const id of VIEW_IDS) {
     if (!ids.has(id)) throw new Error(`view-registry missing ViewId: ${id}`);
   }
   // Unique keyboard bindings within each modifier class
@@ -298,6 +280,7 @@ export const SIDEBAR_ITEMS: {
   shortcut: e.shortcut,
 }));
 
+/** Sidebar rows in registry order (id, short label, key hint). */
 export function getSidebarItems(): {
   id: ViewId;
   label: string;
@@ -306,6 +289,7 @@ export function getSidebarItems(): {
   return SIDEBAR_ITEMS;
 }
 
+/** Ctrl+digit / letter → view id (primary shortcuts). */
 export function getViewShortcutMap(): Record<string, ViewId> {
   const map: Record<string, ViewId> = {};
   for (const e of VIEW_REGISTRY) {
@@ -314,6 +298,7 @@ export function getViewShortcutMap(): Record<string, ViewId> {
   return map;
 }
 
+/** Ctrl+Alt+letter → view id (overflow chords once Ctrl+0-9 are taken). */
 export function getCtrlAltViewMap(): Record<string, ViewId> {
   const map: Record<string, ViewId> = {};
   for (const e of VIEW_REGISTRY) {
@@ -322,12 +307,14 @@ export function getCtrlAltViewMap(): Record<string, ViewId> {
   return map;
 }
 
+/** Factory for `id`, or the dashboard factory when the id is unknown. */
 export function getViewFactory(id: ViewId): ViewFactory {
   const entry = VIEW_REGISTRY.find((e) => e.id === id);
   // Fail soft to dashboard when store has a stale/unknown id
   return entry?.factory ?? VIEW_REGISTRY[0]!.factory;
 }
 
+/** Command-palette entries for every registered view. */
 export function getViewPaletteCommands(): CommandEntry[] {
   return VIEW_REGISTRY.map((e) => ({
     id: e.id,

package/src/components/shared/animated-border.tsx

@@ -1,58 +0,0 @@
-/**
- * Copyright (c) 2026 HOOX · HOOX · jango-blockchained (hoox-sh)
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/** @jsxImportSource @opentui/react */
-/**
- * AnimatedBorder — bordered panel chrome with static accent on focus.
- * (Name kept for call-site compatibility; no color animation.)
- *
- * On focus: border uses Colors.accent + double style.
- * Title: CoolBrackets around uppercase HUD label.
- */
-import { type ReactNode } from "react";
-import { Colors } from "@hoox-sh/hoox-shared";
-import { CoolBrackets } from "./cool-brackets";
-
-// ── Types ──────────────────────────────────────────────────────────────────
-
-export interface AnimatedBorderProps {
-  /** Content to wrap with the border */
-  children: ReactNode;
-  /** Whether the contained element is focused/highlighted */
-  focused?: boolean;
-  /** Optional HUD-style panel title (rendered uppercase with accent brackets) */
-  title?: string;
-}
-
-// ── Component ──────────────────────────────────────────────────────────────
-
-export function AnimatedBorder({
-  children,
-  focused = false,
-  title,
-}: AnimatedBorderProps) {
-  return (
-    <box flexDirection="column" flexGrow={1}>
-      {title && (
-        <box flexDirection="row" gap={1} paddingLeft={1} paddingBottom={0}>
-          <CoolBrackets open="┌" close="┐" gap={1}>
-            <text fg={Colors["muted-foreground"]} bold>
-              {title.toUpperCase()}
-            </text>
-          </CoolBrackets>
-        </box>
-      )}
-      <box
-        border={true}
-        borderStyle={focused ? "double" : "single"}
-        borderColor={focused ? Colors.accent : Colors.border}
-        backgroundColor={Colors.card}
-        flexGrow={1}
-      >
-        {children}
-      </box>
-    </box>
-  );
-}

package/src/components/shared/keybinding-hint.tsx

@@ -1,37 +0,0 @@
-/**
- * Copyright (c) 2026 HOOX · HOOX · jango-blockchained (hoox-sh)
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/** @jsxImportSource @opentui/react */
-/**
- * KeybindingHint — renders a keyboard shortcut label for the status bar
- * and command palette results.
- *
- * Format: " keys  label" — keys in dim/muted, label in foreground.
- * Used as a compact shortcut indicator throughout the TUI.
- */
-import { Colors } from "@hoox-sh/hoox-shared";
-
-// ── Types ──────────────────────────────────────────────────────────────────
-
-export interface KeybindingHintProps {
-  /** The key combination (e.g. "Ctrl+P", "^P", "↑↓") */
-  keys: string;
-  /** The action description (e.g. "Palette", "Navigate") */
-  label: string;
-}
-
-// ── Component ──────────────────────────────────────────────────────────────
-
-export function KeybindingHint({ keys, label }: KeybindingHintProps) {
-  return (
-    <box flexDirection="row" gap={0}>
-      <text dim fg={Colors.muted}>
-        {keys}
-      </text>
-      <text> </text>
-      <text fg={Colors.foreground}>{label}</text>
-    </box>
-  );
-}

package/src/components/ui/select.tsx

@@ -1,49 +0,0 @@
-/**
- * Copyright (c) 2026 HOOX · HOOX · jango-blockchained (hoox-sh)
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/** @jsxImportSource @opentui/react */
-/**
- * SelectModal — keyboard-navigable option picker via in-house DialogHandle.
- * Does not depend on @opentui-ui/dialog (nested OpenTUI crash on global install).
- */
-import type { DialogHandle } from "./dialog";
-import { showChoice } from "./dialog";
-
-// ── Types ──────────────────────────────────────────────────────────────────
-
-/** A single selectable option */
-export interface SelectOption {
-  /** Unique key for the option */
-  key: string;
-  /** Display label shown in the list */
-  label: string;
-  /** Optional description rendered dimmed below or beside the label */
-  description?: string;
-}
-
-/** Options for the SelectModal */
-export interface SelectModalOptions {
-  /** Title displayed at the top of the modal (bold, accent-colored) */
-  title: string;
-  /** Array of selectable options */
-  options: SelectOption[];
-  /** Whether clicking outside the modal dismisses it (default: true) */
-  closeOnClickOutside?: boolean;
-}
-
-/**
- * Show a modal select dialog with keyboard navigation.
- * Returns the selected option's `key`, or `undefined` if dismissed.
- */
-export async function showSelectModal(
-  dialog: DialogHandle,
-  opts: SelectModalOptions
-): Promise<string | undefined> {
-  return showChoice(dialog, {
-    title: opts.title,
-    choices: opts.options,
-    closeOnClickOutside: opts.closeOnClickOutside ?? true,
-  });
-}

package/src/hooks/use-keyboard.ts

@@ -1,130 +0,0 @@
-/**
- * Copyright (c) 2026 HOOX · HOOX · jango-blockchained (hoox-sh)
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * useKeyboard — Priority-ordered keyboard handler hook.
- *
- * Registers a keypress handler with a priority. Higher priority handlers
- * run first. Cleans up on unmount.
- *
- * A **single** renderer keypress subscription is shared by all consumers
- * (avoids N× handlers each re-dispatching the full list — O(n²) fires).
- *
- * Priority convention:
- *   0   — Modal/dialog (highest)
- *   10  — View-local shortcuts
- *   50  — App-global shortcuts
- *   100 — Default/passthrough
- */
-import { useEffect, useRef } from "react";
-import { getRendererRef } from "./renderer-ref";
-
-export interface KeyEvent {
-  name: string;
-  ctrl: boolean;
-  shift: boolean;
-  alt: boolean;
-  meta: boolean;
-  sequence: string;
-}
-
-export interface UseKeyboardOptions {
-  priority?: number;
-  enabled?: boolean;
-}
-
-type KeyHandler = (key: KeyEvent) => void;
-
-interface RegisteredHandler {
-  handler: KeyHandler;
-  priority: number;
-}
-
-const globalHandlers: RegisteredHandler[] = [];
-
-/** One shared keypress subscription for the whole process. */
-let keyInputCleanup: (() => void) | null = null;
-
-function sortHandlers(): void {
-  globalHandlers.sort((a, b) => a.priority - b.priority);
-}
-
-function dispatchKey(key: unknown): void {
-  // Snapshot so unsubscribes during dispatch cannot skip handlers
-  const snapshot = globalHandlers.slice();
-  for (const { handler: h } of snapshot) {
-    h(key as KeyEvent);
-  }
-}
-
-function attachKeyInputIfNeeded(): void {
-  if (keyInputCleanup) return;
-  const renderer = getRendererRef();
-  if (!renderer?.keyInput) return;
-  const off = renderer.keyInput.on("keypress", dispatchKey);
-  keyInputCleanup =
-    typeof off === "function"
-      ? off
-      : () => {
-          // OpenTUI may return void; best-effort detach via off if present
-          try {
-            (
-              renderer.keyInput as { off?: (e: string, fn: unknown) => void }
-            ).off?.("keypress", dispatchKey);
-          } catch {
-            // ignore
-          }
-        };
-}
-
-function detachKeyInputIfIdle(): void {
-  if (globalHandlers.length > 0 || !keyInputCleanup) return;
-  try {
-    keyInputCleanup();
-  } catch {
-    // already torn down
-  }
-  keyInputCleanup = null;
-}
-
-export function registerGlobalHandler(
-  handler: KeyHandler,
-  priority = 50
-): () => void {
-  const entry: RegisteredHandler = { handler, priority };
-  globalHandlers.push(entry);
-  sortHandlers();
-  attachKeyInputIfNeeded();
-  return () => {
-    const idx = globalHandlers.indexOf(entry);
-    if (idx >= 0) globalHandlers.splice(idx, 1);
-    detachKeyInputIfIdle();
-  };
-}
-
-export function useKeyboard(
-  handler: KeyHandler,
-  options: UseKeyboardOptions = {}
-): void {
-  const { priority = 10, enabled = true } = options;
-  const handlerRef = useRef(handler);
-  handlerRef.current = handler;
-
-  useEffect(() => {
-    if (!enabled) return;
-
-    const wrapped: KeyHandler = (key) => handlerRef.current(key);
-    const entry: RegisteredHandler = { handler: wrapped, priority };
-    globalHandlers.push(entry);
-    sortHandlers();
-    attachKeyInputIfNeeded();
-
-    return () => {
-      const idx = globalHandlers.indexOf(entry);
-      if (idx >= 0) globalHandlers.splice(idx, 1);
-      detachKeyInputIfIdle();
-    };
-  }, [priority, enabled]);
-}

package/src/hooks/use-service-data.ts

@@ -1,35 +0,0 @@
-/**
- * Copyright (c) 2026 HOOX · HOOX · jango-blockchained (hoox-sh)
- * SPDX-License-Identifier: Apache-2.0
- */
-
-/**
- * useServiceData — Thin typed wrapper over Zustand useServiceStore.
- *
- * Usage: useServiceData(s => s.workers)
- *        useServiceData(s => s.connectionStatus)
- */
-import { useServiceStore } from "@hoox-sh/hoox-shared";
-
-export type ServiceStoreState = ReturnType<typeof useServiceStore.getState>;
-export type ServiceStoreSelector<T> = (state: ServiceStoreState) => T;
-
-/**
- * Store hook used by {@link useServiceData}. Production points at
- * `useServiceStore`; unit tests may swap this for a pure selector runner
- * via {@link __setServiceStoreHookForTests}.
- */
-let storeHook: <T>(selector: ServiceStoreSelector<T>) => T =
-  useServiceStore as <T>(selector: ServiceStoreSelector<T>) => T;
-
-/** @internal Test-only seam — pass `null` to restore the real Zustand hook. */
-export function __setServiceStoreHookForTests(
-  hook: (<T>(selector: ServiceStoreSelector<T>) => T) | null
-): void {
-  storeHook =
-    hook ?? (useServiceStore as <T>(selector: ServiceStoreSelector<T>) => T);
-}
-
-export function useServiceData<T>(selector: ServiceStoreSelector<T>): T {
-  return storeHook(selector);
-}