@react-perfscope/ui 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,87 @@
+/// <reference lib="es2015" />
+/// <reference lib="dom" />
+
+import { Recorder, StackFrame, RecordingResult } from '@react-perfscope/core';
+import { ComponentChild, h } from 'preact';
+
+type WidgetPosition = 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
+interface MountOptions {
+    /** The recorder to control. The UI calls .start()/.stop() on it. */
+    recorder: Recorder;
+    /** Corner placement of the floating widget. Defaults to 'bottom-right'. */
+    position?: WidgetPosition;
+    /**
+     * The host element under which the Shadow DOM root is created. Defaults
+     * to document.body. Useful for testing or custom layouts.
+     */
+    host?: HTMLElement;
+    /**
+     * Optional async resolver that maps a captured StackFrame to its original
+     * source position. The Panel uses this when expanding a row with stack data.
+     * Defaults to a no-op if not provided.
+     */
+    resolveFrame?: (frame: StackFrame) => Promise<StackFrame>;
+    /**
+     * Optional async post-processor run after `recorder.stop()`. The Panel
+     * renders the raw result immediately, then re-renders with the resolved
+     * value (e.g. self-profiling long-task attribution, which only becomes
+     * available once the Profiler trace settles).
+     */
+    finalize?: (result: RecordingResult) => Promise<RecordingResult>;
+}
+type UnmountFn = () => void;
+
+interface MountShadowOptions {
+    /** Parent element under which the host div is appended. Defaults to document.body. */
+    parent?: HTMLElement;
+}
+declare function mountShadow(vnode: ComponentChild, opts?: MountShadowOptions): () => void;
+
+declare function mount(opts: MountOptions): UnmountFn;
+
+interface WidgetProps {
+    recording: boolean;
+    elapsedMs?: number;
+    onToggle: () => void;
+    position?: WidgetPosition;
+}
+declare function Widget(props: WidgetProps): h.JSX.Element;
+
+interface PanelProps {
+    result: RecordingResult;
+    position?: WidgetPosition;
+    onClose: () => void;
+    resolveFrame?: (frame: StackFrame) => Promise<StackFrame>;
+}
+declare function Panel(props: PanelProps): h.JSX.Element;
+
+interface AppProps {
+    recorder: Recorder;
+    position?: WidgetPosition;
+    resolveFrame?: (frame: StackFrame) => Promise<StackFrame>;
+    finalize?: (result: RecordingResult) => Promise<RecordingResult>;
+}
+declare function App(props: AppProps): h.JSX.Element;
+
+interface OverlayStyle {
+    /** Border color (CSS color). Defaults to red. */
+    border?: string;
+    /** Background fill (CSS color). Defaults to translucent red. */
+    fill?: string;
+    /** Optional dashed border for "previous position" overlays. */
+    dashed?: boolean;
+}
+declare function showOverlay(id: string, rect: DOMRect, style?: OverlayStyle): void;
+/**
+ * Trigger the fade-out transition and remove the overlay after it completes.
+ * If the overlay is shown again before the fade timer fires, the timer is
+ * cancelled and the element is kept.
+ */
+declare function hideOverlay(id: string): void;
+/**
+ * Remove every overlay immediately, skipping the fade. Used by Panel
+ * unmount cleanup where we don't want lingering overlays.
+ */
+declare function hideAllOverlays(): void;
+
+export { App, type MountOptions, Panel, type UnmountFn, Widget, type WidgetPosition, hideAllOverlays, hideOverlay, mount, mountShadow, showOverlay };