@hedwigjs/devtools 0.1.0

package/dist/ui/tabs/messages/rollup.d.ts

@@ -0,0 +1,44 @@
+import type { MessageLogEntry, MessagesRollupConfig } from "../../../inspector/types";
+/**
+ * A contiguous run of messages that share `(topic, source)` and arrived
+ * within `windowMs` gaps of each other. Rendered as a single collapsible
+ * row so that stream-y topics (e.g. `chat.reply-chunk.v1`) don't flood the
+ * log.
+ */
+export interface StreamGroup {
+    kind: "stream";
+    /** Stable React key derived from the first entry's id. */
+    key: string;
+    topic: string;
+    source: string;
+    /** Chronological (oldest → newest). */
+    entries: MessageLogEntry[];
+    count: number;
+    /** Unix ms of the first entry in the group. */
+    firstAt: number;
+    /** Unix ms of the latest entry in the group. */
+    lastAt: number;
+}
+export interface SingleGroup {
+    kind: "single";
+    entry: MessageLogEntry;
+}
+export type DisplayItem = StreamGroup | SingleGroup;
+/**
+ * Fold consecutive matching entries into stream groups.
+ *
+ * Input is expected in chronological order (oldest → newest). Output is in
+ * the same order — reverse in the view layer for display.
+ *
+ * Boundary rules:
+ * - Group breaks when topic OR source changes.
+ * - Group breaks when the gap between adjacent entries exceeds `windowMs`.
+ * - A run with fewer than `minCount` entries is emitted as individual
+ *   `SingleGroup`s rather than a stream — the rollup is only worth the
+ *   click if the burst is substantial.
+ *
+ * Pending entries (no `createdAt` change) group by their creation
+ * timestamp; if a stream is still receiving frames, the last entry's time
+ * keeps advancing and new arrivals extend the same group naturally.
+ */
+export declare function computeDisplayItems(entriesOldToNew: ReadonlyArray<MessageLogEntry>, rollup: MessagesRollupConfig | null): DisplayItem[];

package/dist/ui/tabs/renderActiveTab.d.ts

@@ -0,0 +1,19 @@
+import React from "react";
+import type { MessageInspectorStore } from "../../inspector/createInspectorStore";
+import type { MessageBrokerForDevTools, MessagesFilter, MessagesRollupConfig } from "../../inspector/types";
+import type { DevToolsTabId } from "../shell/layout/panelTypes";
+export interface TabNavigateOptions {
+    filterPatch?: Partial<MessagesFilter>;
+}
+export interface TabRenderContext {
+    /** Navigate to another tab, optionally pre-setting a Messages filter. */
+    onNavigate: (tab: DevToolsTabId, options?: TabNavigateOptions) => void;
+    /** Rollup config for the Messages tab; `null` disables grouping. */
+    messagesRollup: MessagesRollupConfig | null;
+    /** Broker reference — needed by the Debug tab to call $debug.send. */
+    broker: MessageBrokerForDevTools;
+}
+/**
+ * Extension point: add a new section by adding to `DevToolsTabId` union + a case here.
+ */
+export declare function renderActiveTab(id: DevToolsTabId, store: MessageInspectorStore, context: TabRenderContext): React.ReactNode;

package/dist/ui/tabs/replay-buffer/ReplayBufferTab.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from "react";
+import type { MessageInspectorStore } from "../../../inspector/createInspectorStore";
+export interface ReplayBufferTabProps {
+    store: MessageInspectorStore;
+}
+export declare function ReplayBufferTab({ store }: ReplayBufferTabProps): ReactNode;

package/dist/ui/tabs/replay-buffer/components/HistoryEntryRow/HistoryEntryRow.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from "react";
+import type { HistoryEntry } from "../../../../../inspector/types";
+interface HistoryEntryRowProps {
+    entry: HistoryEntry;
+}
+export declare function HistoryEntryRow({ entry }: HistoryEntryRowProps): ReactNode;
+export {};

package/dist/ui/tabs/system-events/SystemEventsTab.d.ts

@@ -0,0 +1,6 @@
+import type { ReactNode } from "react";
+import type { MessageInspectorStore } from "../../../inspector/createInspectorStore";
+export interface SystemEventsTabProps {
+    store: MessageInspectorStore;
+}
+export declare function SystemEventsTab({ store }: SystemEventsTabProps): ReactNode;

package/dist/ui/tabs/system-events/components/SystemEventRow/SystemEventRow.d.ts

@@ -0,0 +1,7 @@
+import type { ReactNode } from "react";
+import type { SystemEventLogEntry } from "../../../../../inspector/types";
+interface SystemEventRowProps {
+    entry: SystemEventLogEntry;
+}
+export declare function SystemEventRow({ entry }: SystemEventRowProps): ReactNode;
+export {};

package/dist/ui/topicsRegistry.d.ts

@@ -0,0 +1,42 @@
+import type { ReactNode } from "react";
+/**
+ * Минимальная форма одного контракта, которую DevTools требует от реестра.
+ *
+ * Совместима со shape'ом `EventContract` из `@hedwigjs/create-registry`,
+ * но описана локально, чтобы DevTools не зависел от какого-либо
+ * конкретного registry-пакета.
+ */
+export interface TopicContractInfo {
+    /** Имя топика, например `"users.fetched.v1"`. */
+    name: string;
+    /** Человекочитаемое описание для UI. */
+    description: string;
+    /** Именованные фикстуры payload'а. Минимум — ключ `happy`. */
+    examples?: Readonly<Record<string, unknown>>;
+    /** Если событие deprecated — имя топика-наследника. */
+    deprecatedBy?: string;
+    /**
+     * Топик — телеметрический (тrace/observability). У него по замыслу
+     * может не быть business-подписчиков, поэтому `NACK NO_SUBSCRIBERS`
+     * для него — ожидаемое состояние, не ошибка. DevTools использует
+     * этот флаг чтобы рендерить такие NACK'и нейтрально.
+     */
+    observability?: boolean;
+}
+/**
+ * Каталог топиков, индексированный по имени топика.
+ * Передаётся в `MessageBrokerDevTools` через prop `registry`.
+ */
+export type TopicsRegistry = Readonly<Record<string, TopicContractInfo>>;
+export interface TopicsRegistryProviderProps {
+    registry: TopicsRegistry | undefined;
+    children: ReactNode;
+}
+export declare function TopicsRegistryProvider({ registry, children, }: TopicsRegistryProviderProps): ReactNode;
+/**
+ * Хук для табов DevTools: возвращает реестр топиков, переданный
+ * в `MessageBrokerDevTools`. `null` означает, что реестр не передан —
+ * UI должен это корректно обработать (показать пустое состояние / disable
+ * функциональность каталога).
+ */
+export declare function useTopicsRegistry(): TopicsRegistry | null;

package/dist/ui/utils/formatRelativeTime.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Formats a Unix timestamp (ms) as a human-readable relative time string.
+ * Returns "never" for null, "just now" for < 1s, otherwise "Xs/Xm/Xh ago".
+ */
+export declare function formatRelativeTime(ts: number | null): string;

package/package.json

@@ -0,0 +1,80 @@
+{
+  "name": "@hedwigjs/devtools",
+  "version": "0.1.0",
+  "description": "DevTools panel for @hedwigjs/broker — message flow, clients, and observability inspector.",
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "sideEffects": true,
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/hedwigjs/hedwig.git",
+    "directory": "packages/devtools"
+  },
+  "bugs": {
+    "url": "https://github.com/hedwigjs/hedwig/issues"
+  },
+  "homepage": "https://github.com/hedwigjs/hedwig/tree/main/packages/devtools#readme",
+  "scripts": {
+    "build": "webpack --config webpack.config.cjs && tsc -p tsconfig.dts.json",
+    "watch": "webpack --config webpack.config.cjs --watch",
+    "test": "jest",
+    "test:watch": "jest --watch",
+    "typecheck": "tsc --noEmit"
+  },
+  "peerDependencies": {
+    "@hedwigjs/broker": "^0.1.0",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1"
+  },
+  "devDependencies": {
+    "@hedwigjs/broker": "*",
+    "@types/jest": "^29.5.0",
+    "@types/react": "^19.1.13",
+    "@types/react-dom": "^19.1.9",
+    "css-loader": "^6.10.0",
+    "jest": "^29.5.0",
+    "react": "^19.1.1",
+    "react-dom": "^19.1.1",
+    "style-loader": "^3.3.4",
+    "ts-jest": "^29.1.0",
+    "ts-loader": "^9.5.2",
+    "typescript": "^5.8.3",
+    "webpack": "^5.99.8",
+    "webpack-cli": "^6.0.1"
+  },
+  "keywords": [
+    "hedwig",
+    "devtools",
+    "message-broker",
+    "microfrontends",
+    "react",
+    "observability"
+  ],
+  "files": [
+    "dist",
+    "README.md",
+    "LICENSE"
+  ],
+  "engines": {
+    "node": ">=18.17.0"
+  },
+  "jest": {
+    "preset": "ts-jest",
+    "testEnvironment": "node",
+    "testMatch": [
+      "**/src/**/*.test.ts"
+    ]
+  }
+}