@spotlightjs/overlay 0.0.19 → 0.0.21

package/dist/App.d.ts

@@ -1,12 +1,4 @@
-import { type Anchor } from './components/Trigger';
-import type { Integration } from './integrations/integration';
-type AppProps = {
-    fullScreen?: boolean;
-    showTriggerButton?: boolean;
-    defaultEventId?: string;
-    integrations?: Integration[];
-    sidecar: string;
-    anchor?: Anchor;
-};
-export default function App({ fullScreen, showTriggerButton, defaultEventId, integrations, sidecar, anchor, }: AppProps): import("react/jsx-runtime").JSX.Element;
+import { SpotlightOverlayOptions } from './types';
+type AppProps = Omit<SpotlightOverlayOptions, 'debug' | 'injectImmediately'> & Required<Pick<SpotlightOverlayOptions, 'sidecarUrl'>>;
+export default function App({ openOnInit, showTriggerButton, integrations, sidecarUrl, anchor, }: AppProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Debugger.d.ts

@@ -1,9 +1,10 @@
 import { Integration, IntegrationData } from '../integrations/integration';
-export default function Debugger({ integrations, isOpen, setOpen, integrationData, isOnline, }: {
+import { NotificationCount } from '../types';
+export default function Debugger({ integrations, isOpen, setOpen, integrationData, isOnline, setTriggerButtonCount: setNotificationCount, }: {
     integrations: Integration[];
     isOpen: boolean;
     setOpen: (value: boolean) => void;
-    defaultEventId?: string;
     integrationData: IntegrationData<unknown>;
     isOnline: boolean;
+    setTriggerButtonCount: (count: NotificationCount) => void;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/Overview.d.ts

@@ -1,5 +1,8 @@
 import { Integration, IntegrationData } from '../integrations/integration';
-export default function Overview({ integrations, integrationData, }: {
+import { NotificationCount } from '../types';
+export default function Overview({ integrations, integrationData, setTriggerButtonCount, setOpen, }: {
     integrations: Integration[];
     integrationData: IntegrationData<unknown>;
+    setTriggerButtonCount: (count: NotificationCount) => void;
+    setOpen: (value: boolean) => void;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/components/Tabs.d.ts

@@ -4,11 +4,22 @@ export type Props = {
      * Array of tabs to display.
      */
     tabs: IntegrationTab<unknown>[];
+} & (NestedTabsProps | TopLevelTabsProps);
+type NestedTabsProps = {
     /**
      * Whether the tabs are nested inside another tab.
      * If `nested` is `true`, links will be set relative to the parent
      * tab route instead of absolute to the root.
      */
-    nested?: boolean;
+    nested: true;
+    setOpen?: undefined;
 };
-export default function Tabs({ tabs, nested }: Props): import("react/jsx-runtime").JSX.Element;
+type TopLevelTabsProps = {
+    nested?: false;
+    /**
+     * Setter to control the open state of the overlay
+     */
+    setOpen: (value: boolean) => void;
+};
+export default function Tabs({ tabs, nested, setOpen }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Trigger.d.ts

@@ -1,9 +1,9 @@
-import { TriggerButtonCount } from '../types';
+import { NotificationCount } from '../types';
 export declare const DEFAULT_ANCHOR = "bottomRight";
 export type Anchor = 'bottomRight' | 'bottomLeft' | 'centerRight' | 'centerLeft' | 'topLeft' | 'topRight';
-export default function Trigger({ isOpen, setOpen, count, anchor, }: {
+export default function Trigger({ isOpen, setOpen, notificationCount, anchor, }: {
     isOpen: boolean;
     setOpen: (value: boolean) => void;
-    count: TriggerButtonCount;
+    notificationCount: NotificationCount;
     anchor?: Anchor;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/index.d.ts

@@ -1,12 +1,11 @@
-import { type Anchor } from './components/Trigger.tsx';
-import type { Integration } from './integrations/integration.ts';
+import { SpotlightOverlayOptions } from './types.ts';
 export { default as console } from './integrations/console/index.ts';
 export { default as sentry } from './integrations/sentry/index.ts';
 export { default as viteInspect } from './integrations/vite-inspect/index.ts';
 /**
  * Open the Spotlight debugger Window
  */
-export declare function openSpotlight(): Promise<void>;
+export declare function openSpotlight(path?: string | undefined): Promise<void>;
 /**
  * Close the Spotlight debugger Window
  */
@@ -25,14 +24,13 @@ export declare function onOpen(cb: () => void): Promise<void>;
  * A count of the number of collected severe events is passed to the callback.
  */
 export declare function onSevereEvent(cb: (count: number) => void): Promise<void>;
-export declare function init({ fullScreen, showTriggerButton, defaultEventId, injectImmediately, sidecar, anchor, debug, integrations, }?: {
-    integrations?: Integration[];
-    fullScreen?: boolean;
-    defaultEventId?: string;
-    sidecarUrl?: string;
-    showTriggerButton?: boolean;
-    injectImmediately?: boolean;
-    sidecar?: string;
-    anchor?: Anchor;
-    debug?: boolean;
-}): Promise<void>;
+/**
+ * Trigger an event in Spotlight.
+ *
+ * This is primarily useful for handling an uncaught error/crash, and forcing the debugger
+ * to render vs a native error handler.
+ *
+ * e.g. trigger("sentry.showError", {eventId});
+ */
+export declare function trigger(eventName: string, payload: unknown): Promise<void>;
+export declare function init({ openOnInit, showTriggerButton, injectImmediately, sidecarUrl, anchor, debug, integrations, }?: SpotlightOverlayOptions): Promise<void>;

package/dist/integrations/console/index.d.ts

@@ -8,7 +8,9 @@ export default function consoleIntegration(): {
     }) => {
         id: string;
         title: string;
-        notificationCount: number;
+        notificationCount: {
+            count: number;
+        };
         content: typeof ConsoleTab;
     }[];
     setup: () => void;

package/dist/integrations/integration.d.ts

@@ -1,4 +1,9 @@
-/// <reference types="react" />
+import { type ComponentType } from 'react';
+import { NotificationCount } from '../types';
+export type SpotlightContext = {
+    open: (path: string | undefined) => void;
+    close: () => void;
+};
 export type Integration<T = any> = {
     /**
      * Name of the integration
@@ -23,7 +28,7 @@ export type Integration<T = any> = {
      *
      * Use this hook to setup any global state, instrument handlers, etc.
      */
-    setup?: () => void | Promise<void>;
+    setup?: (context: SpotlightContext) => void | Promise<void> | TeardownFunction;
     /**
      * Hook called whenever spotlight forwards a new raw event to this integration.
      *
@@ -49,11 +54,11 @@ export type IntegrationTab<T> = {
      * If this property is set, a count badge will be displayed
      * next to the tab title with the specified value.
      */
-    notificationCount?: number;
+    notificationCount?: NotificationCount;
     /**
      * JSX content of the tab. Go crazy, this is all yours!
      */
-    content?: React.ComponentType<{
+    content?: ComponentType<{
         processedEvents: T[];
     }>;
     onSelect?: () => void;
@@ -63,16 +68,6 @@ export type ProcessedEventContainer<T> = {
      * The processed event data to be passed to your tabs.
      */
     event: T;
-    /**
-     * A level indicating the impact or severity of the processed event. Set this to
-     * 'severe' if the event is critical and users should be aware of it (e.g. a thrown error).
-     *
-     * If this is set to 'severe', a red notification count badge will be displayed
-     * next to the spotlight trigger button in the UI.
-     *
-     * @default value is 'default'
-     */
-    severity?: Severity;
 };
 export type Severity = 'default' | 'severe';
 export type IntegrationData<T> = Record<string, ProcessedEventContainer<T>[]>;
@@ -94,5 +89,6 @@ export type RawEventContext = {
      */
     data: string;
 };
-export declare function initIntegrations(integrations?: Integration[]): Promise<Integration[]>;
+type TeardownFunction = () => void | Promise<() => void>;
+export declare function initIntegrations(integrations: Integration<any>[] | undefined, context: SpotlightContext): Promise<[Integration[], TeardownFunction[]]>;
 export {};

package/dist/integrations/sentry/components/Events/Error.d.ts

@@ -5,6 +5,6 @@ export declare function ErrorTitle({ event }: {
 export declare function ErrorSummary({ event }: {
     event: SentryErrorEvent;
 }): import("react/jsx-runtime").JSX.Element;
-export default function Error({ event }: {
+export declare function Error({ event }: {
     event: SentryErrorEvent;
 }): import("react/jsx-runtime").JSX.Element;

package/dist/integrations/sentry/components/Events/Event.d.ts

@@ -0,0 +1,10 @@
+import { SentryErrorEvent, SentryEvent } from '../../types';
+export declare function EventTitle({ event }: {
+    event: SentryErrorEvent | SentryEvent;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function EventSummary({ event }: {
+    event: SentryErrorEvent | SentryEvent;
+}): import("react/jsx-runtime").JSX.Element;
+export default function Event({ event }: {
+    event: SentryErrorEvent | SentryEvent;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/integrations/sentry/components/Tags.d.ts

@@ -0,0 +1,5 @@
+export default function Tags({ tags }: {
+    tags: {
+        [key: string]: string;
+    };
+}): import("react/jsx-runtime").JSX.Element;

package/dist/integrations/sentry/data/sentryDataCache.d.ts

@@ -6,6 +6,7 @@ type TraceSubscription = ['trace', (trace: Trace) => void];
 type Subscription = OnlineSubscription | EventSubscription | TraceSubscription;
 declare class SentryDataCache {
     protected events: SentryEvent[];
+    protected eventIds: Set<string>;
     protected sdks: Sdk[];
     protected traces: Trace[];
     protected tracesById: {

package/dist/integrations/sentry/index.d.ts

@@ -1,23 +1,34 @@
 import type { Envelope } from '@sentry/types';
-import type { RawEventContext, Severity } from '../integration';
+import type { RawEventContext } from '../integration';
 import ErrorsTab from './tabs/ErrorsTab';
 import SdksTab from './tabs/SdksTab';
+import TracesTab from './tabs/TracesTab';
 type SentryIntegrationOptions = {
     sidecarUrl?: string;
 };
 export default function sentryIntegration(options?: SentryIntegrationOptions): {
     name: string;
     forwardedContentType: string[];
-    setup: () => void;
+    setup: ({ open }: import("../integration").SpotlightContext) => () => void;
     processEvent: (event: RawEventContext) => {
         event: Envelope;
-        severity: Severity;
     };
     tabs: () => ({
         id: string;
         title: string;
-        notificationCount: number;
+        notificationCount: {
+            count: number;
+            severe: boolean;
+        };
         content: typeof ErrorsTab;
+    } | {
+        id: string;
+        title: string;
+        notificationCount: {
+            count: number;
+            severe?: undefined;
+        };
+        content: typeof TracesTab;
     } | {
         id: string;
         title: string;
@@ -27,6 +38,5 @@ export default function sentryIntegration(options?: SentryIntegrationOptions): {
 };
 export declare function processEnvelope({ data }: RawEventContext): {
     event: Envelope;
-    severity: Severity;
 };
 export {};

package/dist/integrations/sentry/types.d.ts

@@ -38,6 +38,7 @@ export type Breadcrumb = {
 type CommonEventAttrs = {
     event_id: string;
     timestamp: number;
+    message?: string;
     breadcrumbs?: Breadcrumb[] | {
         values: Breadcrumb[];
     };

package/dist/lib/useKeyPress.d.ts

@@ -1,6 +1,7 @@
 /**
  * useKeyPress
- * @param {string} key - the name of the key to respond to, compared against event.key
+ * @param {string[]} keys - an array of keys to respond to, compared against event.key
  * @param {function} action - the action to perform on key press
+ * @param {boolean} propagate - whether to stop event propagation (default is false)
  */
-export default function useKeyPress(key: string, action: () => void, propagate?: boolean): void;
+export default function useKeyPress(keys: string[], action: () => void, propagate?: boolean): void;