@dialtribe/react-sdk 0.1.0-alpha.8 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -2,10 +2,10 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import React$1, { Component, ReactNode, ErrorInfo } from 'react';
3
3
 
4
4
  /**
5
- * DialTribe SDK Context
5
+ * Dialtribe SDK Context
6
6
  * Manages session token and auto-refresh across all SDK components
7
7
  */
8
- interface DialTribeContextValue {
8
+ interface DialtribeContextValue {
9
9
  /** Current session token */
10
10
  sessionToken: string | null;
11
11
  /** Update the session token (called automatically on refresh) */
@@ -17,7 +17,7 @@ interface DialTribeContextValue {
17
17
  /** Optional API base URL override */
18
18
  apiBaseUrl?: string;
19
19
  }
20
- interface DialTribeProviderProps {
20
+ interface DialtribeProviderProps {
21
21
  /** Session token from your backend (required) */
22
22
  sessionToken: string;
23
23
  /** Called when the API returns a refreshed token via X-Session-Token header */
@@ -34,59 +34,70 @@ interface DialTribeProviderProps {
34
34
  children: React$1.ReactNode;
35
35
  }
36
36
  /**
37
- * DialTribe Provider
37
+ * Dialtribe Provider
38
38
  *
39
39
  * Wraps your app to provide session token authentication to all SDK components.
40
40
  *
41
41
  * @example
42
42
  * ```tsx
43
43
  * // Production (default)
44
- * <DialTribeProvider
44
+ * <DialtribeProvider
45
45
  * sessionToken="sess_xxx..."
46
46
  * onTokenRefresh={(newToken) => setToken(newToken)}
47
47
  * onTokenExpired={() => router.push('/login')}
48
48
  * >
49
49
  * <App />
50
- * </DialTribeProvider>
50
+ * </DialtribeProvider>
51
51
  *
52
52
  * // Local development (explicit)
53
- * <DialTribeProvider
53
+ * <DialtribeProvider
54
54
  * sessionToken="sess_xxx..."
55
55
  * apiBaseUrl="http://localhost:3001/api/public/v1"
56
56
  * onTokenRefresh={(newToken) => setToken(newToken)}
57
57
  * >
58
58
  * <App />
59
- * </DialTribeProvider>
59
+ * </DialtribeProvider>
60
60
  *
61
61
  * // Local development (via env var - recommended)
62
62
  * // Set NEXT_PUBLIC_DIALTRIBE_API_URL=http://localhost:3001/api/public/v1 in .env
63
- * <DialTribeProvider sessionToken="sess_xxx...">
63
+ * <DialtribeProvider sessionToken="sess_xxx...">
64
64
  * <App />
65
- * </DialTribeProvider>
65
+ * </DialtribeProvider>
66
66
  * ```
67
67
  */
68
- declare function DialTribeProvider({ sessionToken: initialToken, onTokenRefresh, onTokenExpired, apiBaseUrl, children, }: DialTribeProviderProps): react_jsx_runtime.JSX.Element;
68
+ declare function DialtribeProvider({ sessionToken: initialToken, onTokenRefresh, onTokenExpired, apiBaseUrl, children, }: DialtribeProviderProps): react_jsx_runtime.JSX.Element;
69
69
  /**
70
- * Hook to access DialTribe context
70
+ * Hook to access Dialtribe context
71
71
  *
72
- * @throws Error if used outside DialTribeProvider
72
+ * @throws Error if used outside DialtribeProvider
73
73
  *
74
74
  * @example
75
75
  * ```tsx
76
- * const { sessionToken, setSessionToken } = useDialTribe();
76
+ * const { sessionToken, setSessionToken } = useDialtribe();
77
77
  * ```
78
78
  */
79
- declare function useDialTribe(): DialTribeContextValue;
79
+ declare function useDialtribe(): DialtribeContextValue;
80
+ /**
81
+ * Hook to optionally access Dialtribe context
82
+ * Returns null if not within a DialtribeProvider (doesn't throw)
83
+ *
84
+ * @example
85
+ * ```tsx
86
+ * const context = useDialtribeOptional();
87
+ * const sessionToken = context?.sessionToken ?? propSessionToken;
88
+ * ```
89
+ */
90
+ declare function useDialtribeOptional(): DialtribeContextValue | null;
80
91
 
81
92
  /**
82
- * DialTribe API Client
93
+ * Dialtribe API Client
83
94
  *
84
- * Handles all API communication with DialTribe endpoints.
95
+ * Handles all API communication with Dialtribe endpoints.
85
96
  * Automatically manages session token refresh via X-Session-Token headers.
86
97
  *
87
98
  * Supports configurable API base URL for development:
88
99
  * 1. Via environment variable: NEXT_PUBLIC_DIALTRIBE_API_URL
89
- * 2. Via apiBaseUrl prop on DialTribeProvider (takes precedence)
100
+ * 2. Via apiBaseUrl prop on DialtribeProvider (takes precedence)
90
101
  *
91
102
  * Defaults to production URL if neither is specified.
92
103
  */
@@ -98,8 +109,9 @@ declare const ENDPOINTS: {
98
109
  readonly broadcast: (id: number) => string;
99
110
  readonly contentPlay: `${string}/content/play`;
100
111
  readonly presignedUrl: `${string}/media/presigned-url`;
101
- readonly sessionStart: `${string}/session/start`;
102
- readonly sessionPing: `${string}/session/ping`;
112
+ readonly audienceStart: `${string}/audiences/start`;
113
+ readonly audiencePing: `${string}/audiences/ping`;
114
+ readonly sessionPing: `${string}/sessions/ping`;
103
115
  };
104
116
  interface ApiClientConfig {
105
117
  /** Session token for authentication */
@@ -116,17 +128,17 @@ interface ApiClientConfig {
116
128
  apiBaseUrl?: string;
117
129
  }
118
130
  /**
119
- * DialTribe API Client
131
+ * Dialtribe API Client
120
132
  *
121
- * Low-level client for making authenticated requests to DialTribe API.
133
+ * Low-level client for making authenticated requests to Dialtribe API.
122
134
  * Handles session token auto-refresh automatically.
123
135
  */
124
- declare class DialTribeClient {
136
+ declare class DialtribeClient {
125
137
  private config;
126
138
  private endpoints;
127
139
  constructor(config: ApiClientConfig);
128
140
  /**
129
- * Make an authenticated request to DialTribe API
141
+ * Make an authenticated request to Dialtribe API
130
142
  *
131
143
  * Automatically:
132
144
  * - Adds Authorization header with session token
@@ -292,8 +304,8 @@ interface TranscriptData {
292
304
  words?: TranscriptWord[];
293
305
  }
294
306
 
295
- interface BroadcastPlayerProps {
296
- /** Broadcast data from DialTribe API */
307
+ interface DialtribePlayerProps {
308
+ /** Broadcast data from Dialtribe API */
297
309
  broadcast: Broadcast;
298
310
  /** Optional: App ID for tracking */
299
311
  appId?: string;
@@ -323,72 +335,28 @@ interface BroadcastPlayerProps {
323
335
  enableKeyboardShortcuts?: boolean;
324
336
  }
325
337
  /**
326
- * BroadcastPlayer - Core media player component (no modal wrapper)
338
+ * DialtribePlayer - Media player component for Dialtribe broadcasts
327
339
  *
328
340
  * Plays video/audio broadcasts with transcript, waveform visualization, and clip creation.
329
- * Uses DialTribeClient for authenticated API calls.
341
+ * For modal or fullscreen display, wrap with the Overlay component.
330
342
  *
331
343
  * @example
332
344
  * ```tsx
333
- * <BroadcastPlayer
334
- * broadcast={broadcast}
335
- * appId="app_123"
336
- * contentId={456}
337
- * />
338
- * ```
339
- */
340
- declare function BroadcastPlayer({ broadcast, appId, contentId, foreignId, foreignTier, renderClipCreator, onError, className, enableKeyboardShortcuts, }: BroadcastPlayerProps): react_jsx_runtime.JSX.Element;
341
-
342
- interface BroadcastPlayerModalProps {
343
- /** Broadcast data from DialTribe API */
344
- broadcast: Broadcast;
345
- /** Whether modal is open */
346
- isOpen: boolean;
347
- /** Called when modal should close */
348
- onClose: () => void;
349
- /** Optional: App ID for tracking */
350
- appId?: string;
351
- /** Optional: Content ID for tracking */
352
- contentId?: number;
353
- /** Foreign user ID from partner system (any tier) */
354
- foreignId?: string;
355
- /** Tier name from partner system (e.g., 'guest', 'member', 'subscriber_gold') */
356
- foreignTier?: string;
357
- /**
358
- * Optional render prop for clip creator
359
- * If provided, the "Create Clip" button will be shown and this will be called when clicked
360
- */
361
- renderClipCreator?: (props: {
362
- isOpen: boolean;
363
- onClose: () => void;
364
- sourceVideoUrl?: string;
365
- sourceAudioUrl?: string;
366
- sourceDuration: number;
367
- onPauseParent: () => void;
368
- }) => React.ReactNode;
369
- /** Optional: Custom CSS classes for the player */
370
- className?: string;
371
- /** Optional: Enable keyboard shortcuts (Space, arrows, M, F, etc.). Default: false */
372
- enableKeyboardShortcuts?: boolean;
373
- }
374
- /**
375
- * BroadcastPlayerModal - Modal wrapper for BroadcastPlayer
345
+ * // Inline (embedded in page)
346
+ * <DialtribePlayer broadcast={broadcast} />
376
347
  *
377
- * Provides a modal overlay with ESC key handling and backdrop click to close.
378
- * Uses the new BroadcastPlayer component for all player functionality.
348
+ * // Modal (wrap with Overlay)
349
+ * <DialtribeOverlay mode="modal" isOpen={show} onClose={() => setShow(false)}>
350
+ * <DialtribePlayer broadcast={broadcast} />
351
+ * </DialtribeOverlay>
379
352
  *
380
- * @example
381
- * ```tsx
382
- * <BroadcastPlayerModal
383
- * broadcast={broadcast}
384
- * isOpen={showModal}
385
- * onClose={() => setShowModal(false)}
386
- * appId="app_123"
387
- * contentId={456}
388
- * />
353
+ * // Fullscreen (wrap with Overlay)
354
+ * <DialtribeOverlay mode="fullscreen" isOpen={show} onClose={() => setShow(false)}>
355
+ * <DialtribePlayer broadcast={broadcast} />
356
+ * </DialtribeOverlay>
389
357
  * ```
390
358
  */
391
- declare function BroadcastPlayerModal({ broadcast, isOpen, onClose, appId, contentId, foreignId, foreignTier, renderClipCreator, className, enableKeyboardShortcuts, }: BroadcastPlayerModalProps): react_jsx_runtime.JSX.Element | null;
359
+ declare function DialtribePlayer({ broadcast, appId, contentId, foreignId, foreignTier, renderClipCreator, onError, className, enableKeyboardShortcuts, }: DialtribePlayerProps): react_jsx_runtime.JSX.Element;
392
360
 
393
361
  interface Props {
394
362
  children: ReactNode;
@@ -422,7 +390,7 @@ interface State {
422
390
  * - Logs errors for debugging
423
391
  * - Allows graceful recovery
424
392
  */
425
- declare class BroadcastPlayerErrorBoundary extends Component<Props, State> {
393
+ declare class DialtribePlayerErrorBoundary extends Component<Props, State> {
426
394
  constructor(props: Props);
427
395
  static getDerivedStateFromError(error: Error): Partial<State>;
428
396
  componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
@@ -476,6 +444,50 @@ interface LoadingSpinnerProps {
476
444
  */
477
445
  declare function LoadingSpinner({ text, size, variant, }: LoadingSpinnerProps): react_jsx_runtime.JSX.Element;
478
446
 
447
+ /** Display mode for the overlay */
448
+ type DialtribeOverlayMode = "modal" | "fullscreen";
449
+ interface DialtribeOverlayProps {
450
+ /** Whether the overlay is open */
451
+ isOpen: boolean;
452
+ /** Called when the overlay should close */
453
+ onClose: () => void;
454
+ /** Display mode: "modal" (centered with backdrop) or "fullscreen" (fills viewport) */
455
+ mode?: DialtribeOverlayMode;
456
+ /** Content to display inside the overlay */
457
+ children: React.ReactNode;
458
+ /** Optional: aria-label for accessibility */
459
+ ariaLabel?: string;
460
+ /** Optional: Show close button. Default: true */
461
+ showCloseButton?: boolean;
462
+ /** Optional: Close on backdrop click. Default: true */
463
+ closeOnBackdropClick?: boolean;
464
+ /** Optional: Close on ESC key. Default: true */
465
+ closeOnEsc?: boolean;
466
+ }
467
+ /**
468
+ * DialtribeOverlay - Reusable modal/fullscreen overlay component
469
+ *
470
+ * Provides a consistent overlay experience with:
471
+ * - Focus management (traps focus, restores on close)
472
+ * - ESC key to close
473
+ * - Backdrop click to close
474
+ * - Accessible with proper ARIA attributes
475
+ *
476
+ * @example
477
+ * ```tsx
478
+ * // Modal mode (centered with backdrop blur)
479
+ * <DialtribeOverlay isOpen={show} onClose={() => setShow(false)} mode="modal">
480
+ * <MyContent />
481
+ * </DialtribeOverlay>
482
+ *
483
+ * // Fullscreen mode (fills entire viewport)
484
+ * <DialtribeOverlay isOpen={show} onClose={() => setShow(false)} mode="fullscreen">
485
+ * <MyContent />
486
+ * </DialtribeOverlay>
487
+ * ```
488
+ */
489
+ declare function DialtribeOverlay({ isOpen, onClose, mode, children, ariaLabel, showCloseButton, closeOnBackdropClick, closeOnEsc, }: DialtribeOverlayProps): react_jsx_runtime.JSX.Element | null;
490
+
479
491
  /**
480
492
  * Format seconds to time string (HH:MM:SS or MM:SS)
481
493
  *
@@ -545,4 +557,4 @@ declare const HTTP_STATUS: {
545
557
  };
546
558
  type HttpStatusCode = typeof HTTP_STATUS[keyof typeof HTTP_STATUS];
547
559
 
548
- export { type ApiClientConfig, AudioWaveform, type Broadcast, BroadcastPlayer, BroadcastPlayerErrorBoundary, BroadcastPlayerModal, type BroadcastPlayerModalProps, type BroadcastPlayerProps, CDN_DOMAIN, DIALTRIBE_API_BASE, DialTribeClient, type DialTribeContextValue, DialTribeProvider, type DialTribeProviderProps, ENDPOINTS, HTTP_STATUS, type HttpStatusCode, LoadingSpinner, type TranscriptData, type TranscriptSegment, type TranscriptWord, buildBroadcastCdnUrl, buildBroadcastS3KeyPrefix, formatTime, useDialTribe };
560
+ export { type ApiClientConfig as A, type Broadcast as B, CDN_DOMAIN as C, DialtribeProvider as D, ENDPOINTS as E, HTTP_STATUS as H, LoadingSpinner as L, type TranscriptWord as T, type DialtribeContextValue as a, type DialtribeProviderProps as b, DialtribeClient as c, DIALTRIBE_API_BASE as d, DialtribePlayer as e, type DialtribePlayerProps as f, DialtribePlayerErrorBoundary as g, AudioWaveform as h, DialtribeOverlay as i, type DialtribeOverlayProps as j, type DialtribeOverlayMode as k, type TranscriptSegment as l, type TranscriptData as m, formatTime as n, buildBroadcastCdnUrl as o, buildBroadcastS3KeyPrefix as p, type HttpStatusCode as q, useDialtribeOptional as r, useDialtribe as u };
@@ -2,10 +2,10 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
2
2
  import React$1, { Component, ReactNode, ErrorInfo } from 'react';
3
3
 
4
4
  /**
5
- * DialTribe SDK Context
5
+ * Dialtribe SDK Context
6
6
  * Manages session token and auto-refresh across all SDK components
7
7
  */
8
- interface DialTribeContextValue {
8
+ interface DialtribeContextValue {
9
9
  /** Current session token */
10
10
  sessionToken: string | null;
11
11
  /** Update the session token (called automatically on refresh) */
@@ -17,7 +17,7 @@ interface DialTribeContextValue {
17
17
  /** Optional API base URL override */
18
18
  apiBaseUrl?: string;
19
19
  }
20
- interface DialTribeProviderProps {
20
+ interface DialtribeProviderProps {
21
21
  /** Session token from your backend (required) */
22
22
  sessionToken: string;
23
23
  /** Called when the API returns a refreshed token via X-Session-Token header */
@@ -34,59 +34,70 @@ interface DialTribeProviderProps {
34
34
  children: React$1.ReactNode;
35
35
  }
36
36
  /**
37
- * DialTribe Provider
37
+ * Dialtribe Provider
38
38
  *
39
39
  * Wraps your app to provide session token authentication to all SDK components.
40
40
  *
41
41
  * @example
42
42
  * ```tsx
43
43
  * // Production (default)
44
- * <DialTribeProvider
44
+ * <DialtribeProvider
45
45
  * sessionToken="sess_xxx..."
46
46
  * onTokenRefresh={(newToken) => setToken(newToken)}
47
47
  * onTokenExpired={() => router.push('/login')}
48
48
  * >
49
49
  * <App />
50
- * </DialTribeProvider>
50
+ * </DialtribeProvider>
51
51
  *
52
52
  * // Local development (explicit)
53
- * <DialTribeProvider
53
+ * <DialtribeProvider
54
54
  * sessionToken="sess_xxx..."
55
55
  * apiBaseUrl="http://localhost:3001/api/public/v1"
56
56
  * onTokenRefresh={(newToken) => setToken(newToken)}
57
57
  * >
58
58
  * <App />
59
- * </DialTribeProvider>
59
+ * </DialtribeProvider>
60
60
  *
61
61
  * // Local development (via env var - recommended)
62
62
  * // Set NEXT_PUBLIC_DIALTRIBE_API_URL=http://localhost:3001/api/public/v1 in .env
63
- * <DialTribeProvider sessionToken="sess_xxx...">
63
+ * <DialtribeProvider sessionToken="sess_xxx...">
64
64
  * <App />
65
- * </DialTribeProvider>
65
+ * </DialtribeProvider>
66
66
  * ```
67
67
  */
68
- declare function DialTribeProvider({ sessionToken: initialToken, onTokenRefresh, onTokenExpired, apiBaseUrl, children, }: DialTribeProviderProps): react_jsx_runtime.JSX.Element;
68
+ declare function DialtribeProvider({ sessionToken: initialToken, onTokenRefresh, onTokenExpired, apiBaseUrl, children, }: DialtribeProviderProps): react_jsx_runtime.JSX.Element;
69
69
  /**
70
- * Hook to access DialTribe context
70
+ * Hook to access Dialtribe context
71
71
  *
72
- * @throws Error if used outside DialTribeProvider
72
+ * @throws Error if used outside DialtribeProvider
73
73
  *
74
74
  * @example
75
75
  * ```tsx
76
- * const { sessionToken, setSessionToken } = useDialTribe();
76
+ * const { sessionToken, setSessionToken } = useDialtribe();
77
77
  * ```
78
78
  */
79
- declare function useDialTribe(): DialTribeContextValue;
79
+ declare function useDialtribe(): DialtribeContextValue;
80
+ /**
81
+ * Hook to optionally access Dialtribe context
82
+ * Returns null if not within a DialtribeProvider (doesn't throw)
83
+ *
84
+ * @example
85
+ * ```tsx
86
+ * const context = useDialtribeOptional();
87
+ * const sessionToken = context?.sessionToken ?? propSessionToken;
88
+ * ```
89
+ */
90
+ declare function useDialtribeOptional(): DialtribeContextValue | null;
80
91
 
81
92
  /**
82
- * DialTribe API Client
93
+ * Dialtribe API Client
83
94
  *
84
- * Handles all API communication with DialTribe endpoints.
95
+ * Handles all API communication with Dialtribe endpoints.
85
96
  * Automatically manages session token refresh via X-Session-Token headers.
86
97
  *
87
98
  * Supports configurable API base URL for development:
88
99
  * 1. Via environment variable: NEXT_PUBLIC_DIALTRIBE_API_URL
89
- * 2. Via apiBaseUrl prop on DialTribeProvider (takes precedence)
100
+ * 2. Via apiBaseUrl prop on DialtribeProvider (takes precedence)
90
101
  *
91
102
  * Defaults to production URL if neither is specified.
92
103
  */
@@ -98,8 +109,9 @@ declare const ENDPOINTS: {
98
109
  readonly broadcast: (id: number) => string;
99
110
  readonly contentPlay: `${string}/content/play`;
100
111
  readonly presignedUrl: `${string}/media/presigned-url`;
101
- readonly sessionStart: `${string}/session/start`;
102
- readonly sessionPing: `${string}/session/ping`;
112
+ readonly audienceStart: `${string}/audiences/start`;
113
+ readonly audiencePing: `${string}/audiences/ping`;
114
+ readonly sessionPing: `${string}/sessions/ping`;
103
115
  };
104
116
  interface ApiClientConfig {
105
117
  /** Session token for authentication */
@@ -116,17 +128,17 @@ interface ApiClientConfig {
116
128
  apiBaseUrl?: string;
117
129
  }
118
130
  /**
119
- * DialTribe API Client
131
+ * Dialtribe API Client
120
132
  *
121
- * Low-level client for making authenticated requests to DialTribe API.
133
+ * Low-level client for making authenticated requests to Dialtribe API.
122
134
  * Handles session token auto-refresh automatically.
123
135
  */
124
- declare class DialTribeClient {
136
+ declare class DialtribeClient {
125
137
  private config;
126
138
  private endpoints;
127
139
  constructor(config: ApiClientConfig);
128
140
  /**
129
- * Make an authenticated request to DialTribe API
141
+ * Make an authenticated request to Dialtribe API
130
142
  *
131
143
  * Automatically:
132
144
  * - Adds Authorization header with session token
@@ -292,8 +304,8 @@ interface TranscriptData {
292
304
  words?: TranscriptWord[];
293
305
  }
294
306
 
295
- interface BroadcastPlayerProps {
296
- /** Broadcast data from DialTribe API */
307
+ interface DialtribePlayerProps {
308
+ /** Broadcast data from Dialtribe API */
297
309
  broadcast: Broadcast;
298
310
  /** Optional: App ID for tracking */
299
311
  appId?: string;
@@ -323,72 +335,28 @@ interface BroadcastPlayerProps {
323
335
  enableKeyboardShortcuts?: boolean;
324
336
  }
325
337
  /**
326
- * BroadcastPlayer - Core media player component (no modal wrapper)
338
+ * DialtribePlayer - Media player component for Dialtribe broadcasts
327
339
  *
328
340
  * Plays video/audio broadcasts with transcript, waveform visualization, and clip creation.
329
- * Uses DialTribeClient for authenticated API calls.
341
+ * For modal or fullscreen display, wrap with the Overlay component.
330
342
  *
331
343
  * @example
332
344
  * ```tsx
333
- * <BroadcastPlayer
334
- * broadcast={broadcast}
335
- * appId="app_123"
336
- * contentId={456}
337
- * />
338
- * ```
339
- */
340
- declare function BroadcastPlayer({ broadcast, appId, contentId, foreignId, foreignTier, renderClipCreator, onError, className, enableKeyboardShortcuts, }: BroadcastPlayerProps): react_jsx_runtime.JSX.Element;
341
-
342
- interface BroadcastPlayerModalProps {
343
- /** Broadcast data from DialTribe API */
344
- broadcast: Broadcast;
345
- /** Whether modal is open */
346
- isOpen: boolean;
347
- /** Called when modal should close */
348
- onClose: () => void;
349
- /** Optional: App ID for tracking */
350
- appId?: string;
351
- /** Optional: Content ID for tracking */
352
- contentId?: number;
353
- /** Foreign user ID from partner system (any tier) */
354
- foreignId?: string;
355
- /** Tier name from partner system (e.g., 'guest', 'member', 'subscriber_gold') */
356
- foreignTier?: string;
357
- /**
358
- * Optional render prop for clip creator
359
- * If provided, the "Create Clip" button will be shown and this will be called when clicked
360
- */
361
- renderClipCreator?: (props: {
362
- isOpen: boolean;
363
- onClose: () => void;
364
- sourceVideoUrl?: string;
365
- sourceAudioUrl?: string;
366
- sourceDuration: number;
367
- onPauseParent: () => void;
368
- }) => React.ReactNode;
369
- /** Optional: Custom CSS classes for the player */
370
- className?: string;
371
- /** Optional: Enable keyboard shortcuts (Space, arrows, M, F, etc.). Default: false */
372
- enableKeyboardShortcuts?: boolean;
373
- }
374
- /**
375
- * BroadcastPlayerModal - Modal wrapper for BroadcastPlayer
345
+ * // Inline (embedded in page)
346
+ * <DialtribePlayer broadcast={broadcast} />
376
347
  *
377
- * Provides a modal overlay with ESC key handling and backdrop click to close.
378
- * Uses the new BroadcastPlayer component for all player functionality.
348
+ * // Modal (wrap with Overlay)
349
+ * <DialtribeOverlay mode="modal" isOpen={show} onClose={() => setShow(false)}>
350
+ * <DialtribePlayer broadcast={broadcast} />
351
+ * </DialtribeOverlay>
379
352
  *
380
- * @example
381
- * ```tsx
382
- * <BroadcastPlayerModal
383
- * broadcast={broadcast}
384
- * isOpen={showModal}
385
- * onClose={() => setShowModal(false)}
386
- * appId="app_123"
387
- * contentId={456}
388
- * />
353
+ * // Fullscreen (wrap with Overlay)
354
+ * <DialtribeOverlay mode="fullscreen" isOpen={show} onClose={() => setShow(false)}>
355
+ * <DialtribePlayer broadcast={broadcast} />
356
+ * </DialtribeOverlay>
389
357
  * ```
390
358
  */
391
- declare function BroadcastPlayerModal({ broadcast, isOpen, onClose, appId, contentId, foreignId, foreignTier, renderClipCreator, className, enableKeyboardShortcuts, }: BroadcastPlayerModalProps): react_jsx_runtime.JSX.Element | null;
359
+ declare function DialtribePlayer({ broadcast, appId, contentId, foreignId, foreignTier, renderClipCreator, onError, className, enableKeyboardShortcuts, }: DialtribePlayerProps): react_jsx_runtime.JSX.Element;
392
360
 
393
361
  interface Props {
394
362
  children: ReactNode;
@@ -422,7 +390,7 @@ interface State {
422
390
  * - Logs errors for debugging
423
391
  * - Allows graceful recovery
424
392
  */
425
- declare class BroadcastPlayerErrorBoundary extends Component<Props, State> {
393
+ declare class DialtribePlayerErrorBoundary extends Component<Props, State> {
426
394
  constructor(props: Props);
427
395
  static getDerivedStateFromError(error: Error): Partial<State>;
428
396
  componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
@@ -476,6 +444,50 @@ interface LoadingSpinnerProps {
476
444
  */
477
445
  declare function LoadingSpinner({ text, size, variant, }: LoadingSpinnerProps): react_jsx_runtime.JSX.Element;
478
446
 
447
+ /** Display mode for the overlay */
448
+ type DialtribeOverlayMode = "modal" | "fullscreen";
449
+ interface DialtribeOverlayProps {
450
+ /** Whether the overlay is open */
451
+ isOpen: boolean;
452
+ /** Called when the overlay should close */
453
+ onClose: () => void;
454
+ /** Display mode: "modal" (centered with backdrop) or "fullscreen" (fills viewport) */
455
+ mode?: DialtribeOverlayMode;
456
+ /** Content to display inside the overlay */
457
+ children: React.ReactNode;
458
+ /** Optional: aria-label for accessibility */
459
+ ariaLabel?: string;
460
+ /** Optional: Show close button. Default: true */
461
+ showCloseButton?: boolean;
462
+ /** Optional: Close on backdrop click. Default: true */
463
+ closeOnBackdropClick?: boolean;
464
+ /** Optional: Close on ESC key. Default: true */
465
+ closeOnEsc?: boolean;
466
+ }
467
+ /**
468
+ * DialtribeOverlay - Reusable modal/fullscreen overlay component
469
+ *
470
+ * Provides a consistent overlay experience with:
471
+ * - Focus management (traps focus, restores on close)
472
+ * - ESC key to close
473
+ * - Backdrop click to close
474
+ * - Accessible with proper ARIA attributes
475
+ *
476
+ * @example
477
+ * ```tsx
478
+ * // Modal mode (centered with backdrop blur)
479
+ * <DialtribeOverlay isOpen={show} onClose={() => setShow(false)} mode="modal">
480
+ * <MyContent />
481
+ * </DialtribeOverlay>
482
+ *
483
+ * // Fullscreen mode (fills entire viewport)
484
+ * <DialtribeOverlay isOpen={show} onClose={() => setShow(false)} mode="fullscreen">
485
+ * <MyContent />
486
+ * </DialtribeOverlay>
487
+ * ```
488
+ */
489
+ declare function DialtribeOverlay({ isOpen, onClose, mode, children, ariaLabel, showCloseButton, closeOnBackdropClick, closeOnEsc, }: DialtribeOverlayProps): react_jsx_runtime.JSX.Element | null;
490
+
479
491
  /**
480
492
  * Format seconds to time string (HH:MM:SS or MM:SS)
481
493
  *
@@ -545,4 +557,4 @@ declare const HTTP_STATUS: {
545
557
  };
546
558
  type HttpStatusCode = typeof HTTP_STATUS[keyof typeof HTTP_STATUS];
547
559
 
548
- export { type ApiClientConfig, AudioWaveform, type Broadcast, BroadcastPlayer, BroadcastPlayerErrorBoundary, BroadcastPlayerModal, type BroadcastPlayerModalProps, type BroadcastPlayerProps, CDN_DOMAIN, DIALTRIBE_API_BASE, DialTribeClient, type DialTribeContextValue, DialTribeProvider, type DialTribeProviderProps, ENDPOINTS, HTTP_STATUS, type HttpStatusCode, LoadingSpinner, type TranscriptData, type TranscriptSegment, type TranscriptWord, buildBroadcastCdnUrl, buildBroadcastS3KeyPrefix, formatTime, useDialTribe };
560
+ export { type ApiClientConfig as A, type Broadcast as B, CDN_DOMAIN as C, DialtribeProvider as D, ENDPOINTS as E, HTTP_STATUS as H, LoadingSpinner as L, type TranscriptWord as T, type DialtribeContextValue as a, type DialtribeProviderProps as b, DialtribeClient as c, DIALTRIBE_API_BASE as d, DialtribePlayer as e, type DialtribePlayerProps as f, DialtribePlayerErrorBoundary as g, AudioWaveform as h, DialtribeOverlay as i, type DialtribeOverlayProps as j, type DialtribeOverlayMode as k, type TranscriptSegment as l, type TranscriptData as m, formatTime as n, buildBroadcastCdnUrl as o, buildBroadcastS3KeyPrefix as p, type HttpStatusCode as q, useDialtribeOptional as r, useDialtribe as u };
@@ -0,0 +1,3 @@
1
+ export { A as ApiClientConfig, h as AudioWaveform, B as Broadcast, C as CDN_DOMAIN, d as DIALTRIBE_API_BASE, c as DialtribeClient, a as DialtribeContextValue, i as DialtribeOverlay, k as DialtribeOverlayMode, j as DialtribeOverlayProps, e as DialtribePlayer, g as DialtribePlayerErrorBoundary, f as DialtribePlayerProps, D as DialtribeProvider, b as DialtribeProviderProps, E as ENDPOINTS, H as HTTP_STATUS, q as HttpStatusCode, L as LoadingSpinner, m as TranscriptData, l as TranscriptSegment, T as TranscriptWord, o as buildBroadcastCdnUrl, p as buildBroadcastS3KeyPrefix, n as formatTime, u as useDialtribe } from './dialtribe-player-CNriUtNi.mjs';
2
+ import 'react/jsx-runtime';
3
+ import 'react';
@@ -0,0 +1,3 @@
1
+ export { A as ApiClientConfig, h as AudioWaveform, B as Broadcast, C as CDN_DOMAIN, d as DIALTRIBE_API_BASE, c as DialtribeClient, a as DialtribeContextValue, i as DialtribeOverlay, k as DialtribeOverlayMode, j as DialtribeOverlayProps, e as DialtribePlayer, g as DialtribePlayerErrorBoundary, f as DialtribePlayerProps, D as DialtribeProvider, b as DialtribeProviderProps, E as ENDPOINTS, H as HTTP_STATUS, q as HttpStatusCode, L as LoadingSpinner, m as TranscriptData, l as TranscriptSegment, T as TranscriptWord, o as buildBroadcastCdnUrl, p as buildBroadcastS3KeyPrefix, n as formatTime, u as useDialtribe } from './dialtribe-player-CNriUtNi.js';
2
+ import 'react/jsx-runtime';
3
+ import 'react';