@ericchen1990/pano-view 2.3.0 → 2.5.0
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.
- package/README.md +243 -6
- package/README.zh-CN.md +243 -6
- package/dist/index.cjs +993 -601
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +275 -190
- package/dist/index.d.ts +275 -190
- package/dist/index.mjs +618 -227
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
|
-
import { CSSProperties, ReactNode, ComponentPropsWithoutRef, IframeHTMLAttributes } from 'react';
|
|
2
|
+
import { CSSProperties, ReactNode, ComponentPropsWithoutRef, RefObject, IframeHTMLAttributes } from 'react';
|
|
3
3
|
import { Texture, ColorRepresentation, Vector3 } from 'three';
|
|
4
4
|
|
|
5
5
|
declare const MAX_HOTSPOT_PITCH = 90;
|
|
@@ -127,6 +127,25 @@ type PanoramaPointerEvent = {
|
|
|
127
127
|
clientY: number;
|
|
128
128
|
};
|
|
129
129
|
|
|
130
|
+
type BackgroundAudioSnapshot = {
|
|
131
|
+
ready: boolean;
|
|
132
|
+
playing: boolean;
|
|
133
|
+
blocked: boolean;
|
|
134
|
+
ended: boolean;
|
|
135
|
+
muted: boolean;
|
|
136
|
+
volume: number;
|
|
137
|
+
};
|
|
138
|
+
type BackgroundAudioController = {
|
|
139
|
+
subscribe: (onStoreChange: () => void) => () => void;
|
|
140
|
+
getSnapshot: () => BackgroundAudioSnapshot;
|
|
141
|
+
play: () => void;
|
|
142
|
+
pause: () => void;
|
|
143
|
+
togglePlay: () => void;
|
|
144
|
+
setVolume: (volume: number) => void;
|
|
145
|
+
setMuted: (muted: boolean) => void;
|
|
146
|
+
toggleMuted: () => void;
|
|
147
|
+
};
|
|
148
|
+
|
|
130
149
|
type KeyboardControlAction = "left" | "right" | "up" | "down" | "zoomIn" | "zoomOut" | "previousScene" | "nextScene" | "reset";
|
|
131
150
|
type KeyboardControlKeys = Partial<Record<KeyboardControlAction, string | readonly string[]>>;
|
|
132
151
|
/** Options for keyboard-driven panorama navigation. */
|
|
@@ -173,6 +192,189 @@ declare function cycleSceneId(scenes: readonly {
|
|
|
173
192
|
*/
|
|
174
193
|
declare function KeyboardControls({ enabled, keys, rotateSpeed, zoomSpeed, shiftMultiplier, invert, fovSpeed, onPreviousScene, onNextScene, }: KeyboardControlsProps): null;
|
|
175
194
|
|
|
195
|
+
type VideoPlaybackState = "playing" | "paused" | "ended" | "blocked";
|
|
196
|
+
type VideoHotspotErrorEvent = {
|
|
197
|
+
id: string;
|
|
198
|
+
source: "poster" | "video";
|
|
199
|
+
error: unknown;
|
|
200
|
+
};
|
|
201
|
+
type VideoHotspotProps = HotspotCommonProps & {
|
|
202
|
+
src: string;
|
|
203
|
+
playing: boolean;
|
|
204
|
+
poster?: string;
|
|
205
|
+
loop?: boolean;
|
|
206
|
+
muted?: boolean;
|
|
207
|
+
volume?: number;
|
|
208
|
+
playsInline?: boolean;
|
|
209
|
+
preload?: "none" | "metadata" | "auto";
|
|
210
|
+
crossOrigin?: "" | "anonymous" | "use-credentials";
|
|
211
|
+
onPlaybackStateChange?: (state: VideoPlaybackState) => void;
|
|
212
|
+
onPlaybackError?: (error: unknown) => void;
|
|
213
|
+
onEnded?: () => void;
|
|
214
|
+
onError?: (event: VideoHotspotErrorEvent) => void;
|
|
215
|
+
};
|
|
216
|
+
declare function VideoHotspot({ id, src, playing, poster, loop, muted, volume, playsInline, preload, crossOrigin, width, height, opacity, onPlaybackStateChange, onPlaybackError, onEnded, onError, ...anchorProps }: VideoHotspotProps): react.JSX.Element;
|
|
217
|
+
|
|
218
|
+
type PanoVideoSource = {
|
|
219
|
+
src: string;
|
|
220
|
+
type?: string;
|
|
221
|
+
};
|
|
222
|
+
type PanoVideoVariant = {
|
|
223
|
+
id: string;
|
|
224
|
+
label: string;
|
|
225
|
+
poster?: string;
|
|
226
|
+
sources: readonly PanoVideoSource[];
|
|
227
|
+
};
|
|
228
|
+
type PanoVideoTrackKind = "subtitles" | "captions";
|
|
229
|
+
type PanoVideoTrack = {
|
|
230
|
+
/** Defaults to `srcLang`. */
|
|
231
|
+
id?: string;
|
|
232
|
+
src: string;
|
|
233
|
+
srcLang: string;
|
|
234
|
+
label: string;
|
|
235
|
+
kind?: PanoVideoTrackKind;
|
|
236
|
+
default?: boolean;
|
|
237
|
+
};
|
|
238
|
+
type PanoVideoCaptionAppearance = {
|
|
239
|
+
color?: string;
|
|
240
|
+
background?: string;
|
|
241
|
+
fontSize?: number | string;
|
|
242
|
+
fontFamily?: string;
|
|
243
|
+
fontWeight?: CSSProperties["fontWeight"];
|
|
244
|
+
textShadow?: string;
|
|
245
|
+
padding?: string;
|
|
246
|
+
borderRadius?: number | string;
|
|
247
|
+
maxWidth?: number | string;
|
|
248
|
+
bottom?: number | string;
|
|
249
|
+
lineHeight?: number | string;
|
|
250
|
+
};
|
|
251
|
+
type PanoVideoControlsAppearance = {
|
|
252
|
+
background?: string;
|
|
253
|
+
color?: string;
|
|
254
|
+
accent?: string;
|
|
255
|
+
borderRadius?: number | string;
|
|
256
|
+
fontSize?: number | string;
|
|
257
|
+
padding?: string;
|
|
258
|
+
};
|
|
259
|
+
type PanoVideoErrorSource = "poster" | "video" | "track";
|
|
260
|
+
type PanoVideoErrorEvent = {
|
|
261
|
+
source: PanoVideoErrorSource;
|
|
262
|
+
error: unknown;
|
|
263
|
+
};
|
|
264
|
+
type PanoVideoPlaybackSnapshot = {
|
|
265
|
+
ready: boolean;
|
|
266
|
+
playing: boolean;
|
|
267
|
+
blocked: boolean;
|
|
268
|
+
ended: boolean;
|
|
269
|
+
currentTime: number;
|
|
270
|
+
duration: number;
|
|
271
|
+
volume: number;
|
|
272
|
+
/** False when the element ignores `volume` (iOS Safari). Mute still works. */
|
|
273
|
+
volumeAdjustable: boolean;
|
|
274
|
+
muted: boolean;
|
|
275
|
+
playbackRate: number;
|
|
276
|
+
variantId: string;
|
|
277
|
+
variants: readonly PanoVideoVariant[];
|
|
278
|
+
trackId: string | null;
|
|
279
|
+
tracks: readonly PanoVideoTrack[];
|
|
280
|
+
captionText: string;
|
|
281
|
+
captionAppearance: Required<PanoVideoCaptionAppearance>;
|
|
282
|
+
captionsEnabled: boolean;
|
|
283
|
+
playbackRates: readonly number[];
|
|
284
|
+
playbackState: VideoPlaybackState;
|
|
285
|
+
};
|
|
286
|
+
type PanoVideoController = {
|
|
287
|
+
subscribe: (onStoreChange: () => void) => () => void;
|
|
288
|
+
getSnapshot: () => PanoVideoPlaybackSnapshot;
|
|
289
|
+
play: () => Promise<void>;
|
|
290
|
+
pause: () => void;
|
|
291
|
+
togglePlay: () => void;
|
|
292
|
+
seek: (time: number) => void;
|
|
293
|
+
setVolume: (volume: number) => void;
|
|
294
|
+
setMuted: (muted: boolean) => void;
|
|
295
|
+
toggleMuted: () => void;
|
|
296
|
+
setPlaybackRate: (rate: number) => void;
|
|
297
|
+
setVariantId: (id: string) => void;
|
|
298
|
+
setTrackId: (id: string | null) => void;
|
|
299
|
+
setCaptionAppearance: (appearance: Partial<PanoVideoCaptionAppearance>) => void;
|
|
300
|
+
};
|
|
301
|
+
|
|
302
|
+
type WebVRMode = "webxr" | "mobilevr" | "fake";
|
|
303
|
+
type WebVRProfileId = "none" | "cardboard-v1" | "cardboard-v2" | "gear-vr" | "daydream";
|
|
304
|
+
type WebVRProfile = {
|
|
305
|
+
id?: string;
|
|
306
|
+
label?: string;
|
|
307
|
+
/** Vertical field of view for each eye, in degrees. */
|
|
308
|
+
fov: number;
|
|
309
|
+
/** Distance between the eyes, in millimetres. */
|
|
310
|
+
ipdMm: number;
|
|
311
|
+
/** Distance from the display to the headset lens, in millimetres. */
|
|
312
|
+
screenToLensMm?: number;
|
|
313
|
+
/** Radial lens distortion coefficients. Zero disables distortion. */
|
|
314
|
+
k1: number;
|
|
315
|
+
k2: number;
|
|
316
|
+
};
|
|
317
|
+
type WebVRChromeAppearance = {
|
|
318
|
+
background?: CSSProperties["background"];
|
|
319
|
+
color?: CSSProperties["color"];
|
|
320
|
+
accent?: CSSProperties["color"];
|
|
321
|
+
borderRadius?: CSSProperties["borderRadius"];
|
|
322
|
+
fontSize?: CSSProperties["fontSize"];
|
|
323
|
+
setupTitle?: ReactNode;
|
|
324
|
+
};
|
|
325
|
+
type WebVRChrome = boolean | WebVRChromeAppearance;
|
|
326
|
+
type WebVRProps = {
|
|
327
|
+
/** Mount the built-in Enter / Exit / Setup chrome. Defaults to true. */
|
|
328
|
+
chrome?: WebVRChrome;
|
|
329
|
+
/** Enable the phone stereoscopic fallback. Defaults to true. */
|
|
330
|
+
mobileVr?: boolean;
|
|
331
|
+
/** Treat desktop device-orientation sensors as MobileVR. Defaults to false. */
|
|
332
|
+
desktopSupport?: boolean;
|
|
333
|
+
/** Allow a mouse-driven stereoscopic desktop simulation. Defaults to true. */
|
|
334
|
+
fakeSupport?: boolean;
|
|
335
|
+
/** Physical diagonal screen size in inches, or automatic detection. */
|
|
336
|
+
screensize?: number | "auto";
|
|
337
|
+
/** Headset preset or a custom lens profile. */
|
|
338
|
+
profile?: WebVRProfileId | WebVRProfile;
|
|
339
|
+
/** Show a center reticle in VR. Defaults to true. */
|
|
340
|
+
cursor?: boolean;
|
|
341
|
+
/**
|
|
342
|
+
* Milliseconds to keep looking at a hotspot before a gaze click.
|
|
343
|
+
* Defaults to 1500. Set to 0 to disable auto-click.
|
|
344
|
+
*/
|
|
345
|
+
cursorDwellMs?: number;
|
|
346
|
+
/**
|
|
347
|
+
* Keep the display awake while MobileVR or simulated VR is active.
|
|
348
|
+
* Uses the Screen Wake Lock API when available, otherwise a looping
|
|
349
|
+
* hidden video. Defaults to true.
|
|
350
|
+
*/
|
|
351
|
+
wakelock?: boolean;
|
|
352
|
+
/**
|
|
353
|
+
* Lock the mouse in simulated desktop VR so movement looks around with
|
|
354
|
+
* no visible cursor. Click the view to re-lock after Escape. Defaults to true.
|
|
355
|
+
*/
|
|
356
|
+
mousePointerLock?: boolean;
|
|
357
|
+
onAvailable?: () => void;
|
|
358
|
+
onUnavailable?: () => void;
|
|
359
|
+
onEnterVR?: (mode: WebVRMode) => void;
|
|
360
|
+
onExitVR?: (mode: WebVRMode) => void;
|
|
361
|
+
onDenied?: (error?: unknown) => void;
|
|
362
|
+
onUnknownDevice?: () => void;
|
|
363
|
+
};
|
|
364
|
+
type WebVRHandle = {
|
|
365
|
+
enterVR: () => Promise<boolean>;
|
|
366
|
+
exitVR: () => Promise<void>;
|
|
367
|
+
toggleVR: () => Promise<boolean>;
|
|
368
|
+
isAvailable: () => boolean;
|
|
369
|
+
isEnabled: () => boolean;
|
|
370
|
+
getMode: () => WebVRMode | null;
|
|
371
|
+
requestPermission: () => Promise<boolean>;
|
|
372
|
+
};
|
|
373
|
+
type WebVRSettings = {
|
|
374
|
+
screensize: number | "auto";
|
|
375
|
+
profileId: WebVRProfileId;
|
|
376
|
+
};
|
|
377
|
+
|
|
176
378
|
type PanoViewerState = {
|
|
177
379
|
/** Horizontal look angle in degrees. Positive values look right. */
|
|
178
380
|
yaw: number;
|
|
@@ -189,11 +391,44 @@ type PanoViewerHandle = {
|
|
|
189
391
|
getView: () => PanoViewerState;
|
|
190
392
|
setView: (view: Partial<PanoViewerState>, options?: SetPanoViewerOptions) => void;
|
|
191
393
|
reset: () => void;
|
|
394
|
+
enterFullscreen: () => Promise<void>;
|
|
395
|
+
exitFullscreen: () => Promise<void>;
|
|
396
|
+
toggleFullscreen: () => Promise<void>;
|
|
397
|
+
isFullscreen: () => boolean;
|
|
398
|
+
setScene: (id: string) => boolean;
|
|
399
|
+
nextScene: () => boolean;
|
|
400
|
+
previousScene: () => boolean;
|
|
401
|
+
getActiveSceneId: () => string | null;
|
|
402
|
+
getSceneIds: () => readonly string[];
|
|
403
|
+
isSceneTransitioning: () => boolean;
|
|
404
|
+
enterVR: () => Promise<boolean>;
|
|
405
|
+
exitVR: () => Promise<void>;
|
|
406
|
+
toggleVR: () => Promise<boolean>;
|
|
407
|
+
isVRAvailable: () => boolean;
|
|
408
|
+
isVREnabled: () => boolean;
|
|
409
|
+
getVRMode: () => WebVRMode | null;
|
|
410
|
+
requestVRPermission: () => Promise<boolean>;
|
|
411
|
+
getVideo: () => PanoVideoController | null;
|
|
412
|
+
subscribeVideo: (onStoreChange: () => void) => () => void;
|
|
413
|
+
playVideo: () => Promise<void>;
|
|
414
|
+
pauseVideo: () => void;
|
|
415
|
+
toggleVideo: () => void;
|
|
416
|
+
seekVideo: (time: number) => void;
|
|
417
|
+
setVideoVolume: (volume: number) => void;
|
|
418
|
+
setVideoMuted: (muted: boolean) => void;
|
|
419
|
+
toggleVideoMuted: () => void;
|
|
420
|
+
getBackgroundAudio: () => BackgroundAudioController | null;
|
|
421
|
+
subscribeBackgroundAudio: (onStoreChange: () => void) => () => void;
|
|
422
|
+
playBackgroundAudio: () => Promise<void>;
|
|
423
|
+
pauseBackgroundAudio: () => void;
|
|
424
|
+
toggleBackgroundAudio: () => void;
|
|
425
|
+
setBackgroundAudioVolume: (volume: number) => void;
|
|
426
|
+
setBackgroundAudioMuted: (muted: boolean) => void;
|
|
427
|
+
toggleBackgroundAudioMuted: () => void;
|
|
192
428
|
/** @deprecated Control an AutoRotate component's enabled prop instead. */
|
|
193
429
|
startAutoRotate: () => void;
|
|
194
430
|
/** @deprecated Control an AutoRotate component's enabled prop instead. */
|
|
195
431
|
stopAutoRotate: () => void;
|
|
196
|
-
toggleFullscreen: () => Promise<void>;
|
|
197
432
|
};
|
|
198
433
|
type MouseControlButton = "left" | "middle" | "right";
|
|
199
434
|
/** Options for the default mouse control channel (also MouseControls props). */
|
|
@@ -558,7 +793,14 @@ type BackgroundAudioProps = {
|
|
|
558
793
|
sources?: Readonly<Record<string, BackgroundAudioSource>>;
|
|
559
794
|
/** Current scene id. Required when `sources` is set. */
|
|
560
795
|
sceneId?: string;
|
|
561
|
-
|
|
796
|
+
/**
|
|
797
|
+
* Controlled playing state. When provided, the parent owns play/pause.
|
|
798
|
+
* When omitted, the component manages its own state and imperative
|
|
799
|
+
* `playBackgroundAudio` / `pauseBackgroundAudio` work directly.
|
|
800
|
+
*/
|
|
801
|
+
playing?: boolean;
|
|
802
|
+
/** Initial playing state when `playing` is omitted. Defaults to false. */
|
|
803
|
+
defaultPlaying?: boolean;
|
|
562
804
|
/** Defaults to true. */
|
|
563
805
|
loop?: boolean;
|
|
564
806
|
muted?: boolean;
|
|
@@ -577,7 +819,7 @@ type BackgroundAudioProps = {
|
|
|
577
819
|
* as a child of PanoViewer, alongside Scenes or a panorama source — not inside
|
|
578
820
|
* renderHotspots.
|
|
579
821
|
*/
|
|
580
|
-
declare function BackgroundAudio({ src, sources, sceneId, playing, loop, muted, volume, pauseWhenHidden, fadeMs, crossOrigin, onPlaybackStateChange, onPlaybackError, onEnded, onError, }: BackgroundAudioProps): null;
|
|
822
|
+
declare function BackgroundAudio({ src, sources, sceneId, playing: controlledPlaying, defaultPlaying, loop, muted, volume, pauseWhenHidden, fadeMs, crossOrigin, onPlaybackStateChange, onPlaybackError, onEnded, onError, }: BackgroundAudioProps): null;
|
|
581
823
|
|
|
582
824
|
declare const PANO_FILTER_PRESETS: readonly ["none", "grayscale", "sepia", "vintage", "cool", "warm", "pencil", "coloredPencil", "crayon", "watercolor", "cartoon", "crosshatch"];
|
|
583
825
|
type PanoFilterPreset = (typeof PANO_FILTER_PRESETS)[number];
|
|
@@ -638,82 +880,6 @@ type GyroProps = {
|
|
|
638
880
|
*/
|
|
639
881
|
declare const Gyro: react.ForwardRefExoticComponent<GyroProps & react.RefAttributes<GyroHandle>>;
|
|
640
882
|
|
|
641
|
-
type WebVRMode = "webxr" | "mobilevr" | "fake";
|
|
642
|
-
type WebVRProfileId = "none" | "cardboard-v1" | "cardboard-v2" | "gear-vr" | "daydream";
|
|
643
|
-
type WebVRProfile = {
|
|
644
|
-
id?: string;
|
|
645
|
-
label?: string;
|
|
646
|
-
/** Vertical field of view for each eye, in degrees. */
|
|
647
|
-
fov: number;
|
|
648
|
-
/** Distance between the eyes, in millimetres. */
|
|
649
|
-
ipdMm: number;
|
|
650
|
-
/** Distance from the display to the headset lens, in millimetres. */
|
|
651
|
-
screenToLensMm?: number;
|
|
652
|
-
/** Radial lens distortion coefficients. Zero disables distortion. */
|
|
653
|
-
k1: number;
|
|
654
|
-
k2: number;
|
|
655
|
-
};
|
|
656
|
-
type WebVRChromeAppearance = {
|
|
657
|
-
background?: CSSProperties["background"];
|
|
658
|
-
color?: CSSProperties["color"];
|
|
659
|
-
accent?: CSSProperties["color"];
|
|
660
|
-
borderRadius?: CSSProperties["borderRadius"];
|
|
661
|
-
fontSize?: CSSProperties["fontSize"];
|
|
662
|
-
setupTitle?: ReactNode;
|
|
663
|
-
};
|
|
664
|
-
type WebVRChrome = boolean | WebVRChromeAppearance;
|
|
665
|
-
type WebVRProps = {
|
|
666
|
-
/** Mount the built-in Enter / Exit / Setup chrome. Defaults to true. */
|
|
667
|
-
chrome?: WebVRChrome;
|
|
668
|
-
/** Enable the phone stereoscopic fallback. Defaults to true. */
|
|
669
|
-
mobileVr?: boolean;
|
|
670
|
-
/** Treat desktop device-orientation sensors as MobileVR. Defaults to false. */
|
|
671
|
-
desktopSupport?: boolean;
|
|
672
|
-
/** Allow a mouse-driven stereoscopic desktop simulation. Defaults to true. */
|
|
673
|
-
fakeSupport?: boolean;
|
|
674
|
-
/** Physical diagonal screen size in inches, or automatic detection. */
|
|
675
|
-
screensize?: number | "auto";
|
|
676
|
-
/** Headset preset or a custom lens profile. */
|
|
677
|
-
profile?: WebVRProfileId | WebVRProfile;
|
|
678
|
-
/** Show a center reticle in VR. Defaults to true. */
|
|
679
|
-
cursor?: boolean;
|
|
680
|
-
/**
|
|
681
|
-
* Milliseconds to keep looking at a hotspot before a gaze click.
|
|
682
|
-
* Defaults to 1500. Set to 0 to disable auto-click.
|
|
683
|
-
*/
|
|
684
|
-
cursorDwellMs?: number;
|
|
685
|
-
/**
|
|
686
|
-
* Keep the display awake while MobileVR or simulated VR is active.
|
|
687
|
-
* Uses the Screen Wake Lock API when available, otherwise a looping
|
|
688
|
-
* hidden video. Defaults to true.
|
|
689
|
-
*/
|
|
690
|
-
wakelock?: boolean;
|
|
691
|
-
/**
|
|
692
|
-
* Lock the mouse in simulated desktop VR so movement looks around with
|
|
693
|
-
* no visible cursor. Click the view to re-lock after Escape. Defaults to true.
|
|
694
|
-
*/
|
|
695
|
-
mousePointerLock?: boolean;
|
|
696
|
-
onAvailable?: () => void;
|
|
697
|
-
onUnavailable?: () => void;
|
|
698
|
-
onEnterVR?: (mode: WebVRMode) => void;
|
|
699
|
-
onExitVR?: (mode: WebVRMode) => void;
|
|
700
|
-
onDenied?: (error?: unknown) => void;
|
|
701
|
-
onUnknownDevice?: () => void;
|
|
702
|
-
};
|
|
703
|
-
type WebVRHandle = {
|
|
704
|
-
enterVR: () => Promise<boolean>;
|
|
705
|
-
exitVR: () => Promise<void>;
|
|
706
|
-
toggleVR: () => Promise<boolean>;
|
|
707
|
-
isAvailable: () => boolean;
|
|
708
|
-
isEnabled: () => boolean;
|
|
709
|
-
getMode: () => WebVRMode | null;
|
|
710
|
-
requestPermission: () => Promise<boolean>;
|
|
711
|
-
};
|
|
712
|
-
type WebVRSettings = {
|
|
713
|
-
screensize: number | "auto";
|
|
714
|
-
profileId: WebVRProfileId;
|
|
715
|
-
};
|
|
716
|
-
|
|
717
883
|
declare const WebVR: react.ForwardRefExoticComponent<WebVRProps & react.RefAttributes<WebVRHandle>>;
|
|
718
884
|
|
|
719
885
|
declare const DEFAULT_WEBVR_CHROME_APPEARANCE: Required<Omit<WebVRChromeAppearance, "setupTitle">>;
|
|
@@ -829,6 +995,11 @@ declare function usePanoEvents({ idleTime, onViewChange, onViewSettled, onViewIn
|
|
|
829
995
|
*/
|
|
830
996
|
declare function PanoEvents(props: PanoEventsProps): null;
|
|
831
997
|
|
|
998
|
+
type UsePanoViewerResult = PanoViewerHandle & {
|
|
999
|
+
ref: RefObject<PanoViewerHandle | null>;
|
|
1000
|
+
};
|
|
1001
|
+
declare function usePanoViewer(): UsePanoViewerResult;
|
|
1002
|
+
|
|
832
1003
|
type MouseControlsProps = MouseControlsOptions & {
|
|
833
1004
|
/**
|
|
834
1005
|
* Maximum FOV change rate in degrees per second for wheel zoom. When
|
|
@@ -872,113 +1043,6 @@ type SphereProps = {
|
|
|
872
1043
|
};
|
|
873
1044
|
declare function Sphere({ src, previewUrl, yawOffset, onReady, onLoad, onError, onPreviewError, visible, }: SphereProps): react.JSX.Element | null;
|
|
874
1045
|
|
|
875
|
-
type VideoPlaybackState = "playing" | "paused" | "ended" | "blocked";
|
|
876
|
-
type VideoHotspotErrorEvent = {
|
|
877
|
-
id: string;
|
|
878
|
-
source: "poster" | "video";
|
|
879
|
-
error: unknown;
|
|
880
|
-
};
|
|
881
|
-
type VideoHotspotProps = HotspotCommonProps & {
|
|
882
|
-
src: string;
|
|
883
|
-
playing: boolean;
|
|
884
|
-
poster?: string;
|
|
885
|
-
loop?: boolean;
|
|
886
|
-
muted?: boolean;
|
|
887
|
-
volume?: number;
|
|
888
|
-
playsInline?: boolean;
|
|
889
|
-
preload?: "none" | "metadata" | "auto";
|
|
890
|
-
crossOrigin?: "" | "anonymous" | "use-credentials";
|
|
891
|
-
onPlaybackStateChange?: (state: VideoPlaybackState) => void;
|
|
892
|
-
onPlaybackError?: (error: unknown) => void;
|
|
893
|
-
onEnded?: () => void;
|
|
894
|
-
onError?: (event: VideoHotspotErrorEvent) => void;
|
|
895
|
-
};
|
|
896
|
-
declare function VideoHotspot({ id, src, playing, poster, loop, muted, volume, playsInline, preload, crossOrigin, width, height, opacity, onPlaybackStateChange, onPlaybackError, onEnded, onError, ...anchorProps }: VideoHotspotProps): react.JSX.Element;
|
|
897
|
-
|
|
898
|
-
type PanoVideoSource = {
|
|
899
|
-
src: string;
|
|
900
|
-
type?: string;
|
|
901
|
-
};
|
|
902
|
-
type PanoVideoVariant = {
|
|
903
|
-
id: string;
|
|
904
|
-
label: string;
|
|
905
|
-
poster?: string;
|
|
906
|
-
sources: readonly PanoVideoSource[];
|
|
907
|
-
};
|
|
908
|
-
type PanoVideoTrackKind = "subtitles" | "captions";
|
|
909
|
-
type PanoVideoTrack = {
|
|
910
|
-
/** Defaults to `srcLang`. */
|
|
911
|
-
id?: string;
|
|
912
|
-
src: string;
|
|
913
|
-
srcLang: string;
|
|
914
|
-
label: string;
|
|
915
|
-
kind?: PanoVideoTrackKind;
|
|
916
|
-
default?: boolean;
|
|
917
|
-
};
|
|
918
|
-
type PanoVideoCaptionAppearance = {
|
|
919
|
-
color?: string;
|
|
920
|
-
background?: string;
|
|
921
|
-
fontSize?: number | string;
|
|
922
|
-
fontFamily?: string;
|
|
923
|
-
fontWeight?: CSSProperties["fontWeight"];
|
|
924
|
-
textShadow?: string;
|
|
925
|
-
padding?: string;
|
|
926
|
-
borderRadius?: number | string;
|
|
927
|
-
maxWidth?: number | string;
|
|
928
|
-
bottom?: number | string;
|
|
929
|
-
lineHeight?: number | string;
|
|
930
|
-
};
|
|
931
|
-
type PanoVideoControlsAppearance = {
|
|
932
|
-
background?: string;
|
|
933
|
-
color?: string;
|
|
934
|
-
accent?: string;
|
|
935
|
-
borderRadius?: number | string;
|
|
936
|
-
fontSize?: number | string;
|
|
937
|
-
padding?: string;
|
|
938
|
-
};
|
|
939
|
-
type PanoVideoErrorSource = "poster" | "video" | "track";
|
|
940
|
-
type PanoVideoErrorEvent = {
|
|
941
|
-
source: PanoVideoErrorSource;
|
|
942
|
-
error: unknown;
|
|
943
|
-
};
|
|
944
|
-
type PanoVideoPlaybackSnapshot = {
|
|
945
|
-
ready: boolean;
|
|
946
|
-
playing: boolean;
|
|
947
|
-
blocked: boolean;
|
|
948
|
-
ended: boolean;
|
|
949
|
-
currentTime: number;
|
|
950
|
-
duration: number;
|
|
951
|
-
volume: number;
|
|
952
|
-
/** False when the element ignores `volume` (iOS Safari). Mute still works. */
|
|
953
|
-
volumeAdjustable: boolean;
|
|
954
|
-
muted: boolean;
|
|
955
|
-
playbackRate: number;
|
|
956
|
-
variantId: string;
|
|
957
|
-
variants: readonly PanoVideoVariant[];
|
|
958
|
-
trackId: string | null;
|
|
959
|
-
tracks: readonly PanoVideoTrack[];
|
|
960
|
-
captionText: string;
|
|
961
|
-
captionAppearance: Required<PanoVideoCaptionAppearance>;
|
|
962
|
-
captionsEnabled: boolean;
|
|
963
|
-
playbackRates: readonly number[];
|
|
964
|
-
playbackState: VideoPlaybackState;
|
|
965
|
-
};
|
|
966
|
-
type PanoVideoController = {
|
|
967
|
-
subscribe: (onStoreChange: () => void) => () => void;
|
|
968
|
-
getSnapshot: () => PanoVideoPlaybackSnapshot;
|
|
969
|
-
play: () => Promise<void>;
|
|
970
|
-
pause: () => void;
|
|
971
|
-
togglePlay: () => void;
|
|
972
|
-
seek: (time: number) => void;
|
|
973
|
-
setVolume: (volume: number) => void;
|
|
974
|
-
setMuted: (muted: boolean) => void;
|
|
975
|
-
toggleMuted: () => void;
|
|
976
|
-
setPlaybackRate: (rate: number) => void;
|
|
977
|
-
setVariantId: (id: string) => void;
|
|
978
|
-
setTrackId: (id: string | null) => void;
|
|
979
|
-
setCaptionAppearance: (appearance: Partial<PanoVideoCaptionAppearance>) => void;
|
|
980
|
-
};
|
|
981
|
-
|
|
982
1046
|
type PanoVideoProps = {
|
|
983
1047
|
/** Single-file shortcut when `variants` is omitted. */
|
|
984
1048
|
src?: string;
|
|
@@ -1144,7 +1208,19 @@ type SceneTransitionErrorEvent = {
|
|
|
1144
1208
|
};
|
|
1145
1209
|
type ScenesProps = {
|
|
1146
1210
|
scenes: readonly Scene[];
|
|
1147
|
-
|
|
1211
|
+
/**
|
|
1212
|
+
* Controlled scene id. When provided, the parent owns the active scene.
|
|
1213
|
+
* Imperative `setScene` / `nextScene` / `previousScene` will call
|
|
1214
|
+
* `onActiveSceneIdChange` so the parent can update its state.
|
|
1215
|
+
*/
|
|
1216
|
+
activeSceneId?: string;
|
|
1217
|
+
/**
|
|
1218
|
+
* Uncontrolled initial scene id. Used when `activeSceneId` is omitted.
|
|
1219
|
+
* Imperative calls update the internal state directly.
|
|
1220
|
+
*/
|
|
1221
|
+
defaultActiveSceneId?: string;
|
|
1222
|
+
/** Called when imperative scene methods request a scene change in controlled mode. */
|
|
1223
|
+
onActiveSceneIdChange?: (id: string) => void;
|
|
1148
1224
|
transition?: SceneTransition;
|
|
1149
1225
|
/** Rendered only after a scene has finished transitioning in. */
|
|
1150
1226
|
renderHotspots?: (scene: Scene) => ReactNode;
|
|
@@ -1157,7 +1233,16 @@ type ScenesProps = {
|
|
|
1157
1233
|
/** Maximum physical-pixel area of the outgoing GPU snapshot. */
|
|
1158
1234
|
snapshotMaxPixels?: number;
|
|
1159
1235
|
};
|
|
1160
|
-
declare function Scenes({ maxTextureMemoryMb, maxConcurrentTileLoads, ...
|
|
1236
|
+
declare function Scenes({ maxTextureMemoryMb, maxConcurrentTileLoads, activeSceneId: controlledId, defaultActiveSceneId, onActiveSceneIdChange, scenes, ...rest }: ScenesProps): react.JSX.Element;
|
|
1237
|
+
|
|
1238
|
+
type ScenesController = {
|
|
1239
|
+
setScene: (id: string) => boolean;
|
|
1240
|
+
nextScene: () => boolean;
|
|
1241
|
+
previousScene: () => boolean;
|
|
1242
|
+
getActiveSceneId: () => string;
|
|
1243
|
+
getSceneIds: () => readonly string[];
|
|
1244
|
+
isTransitioning: () => boolean;
|
|
1245
|
+
};
|
|
1161
1246
|
|
|
1162
1247
|
type ImageHotspotProps = HotspotCommonProps & {
|
|
1163
1248
|
src: string;
|
|
@@ -1493,4 +1578,4 @@ type PointHotspotDefinition = ImageHotspotDefinition | GraphicHotspotDefinition
|
|
|
1493
1578
|
/** A serializable, discriminated hotspot collection item. */
|
|
1494
1579
|
type HotspotDefinition = PointHotspotDefinition | PolygonHotspotDefinition | PolylineHotspotDefinition;
|
|
1495
1580
|
|
|
1496
|
-
export { type ArrowGraphic, AudioHotspot, type AudioHotspotDefinition, type AudioHotspotErrorEvent, type AudioHotspotProps, type AudioPlaybackState, AutoRotate, type AutoRotateProps, BackgroundAudio, type BackgroundAudioErrorEvent, type BackgroundAudioProps, type BackgroundAudioSource, type CircleGraphic, type CubeFaceCode, DEFAULT_HOTSPOT_TOOLTIP_APPEARANCE, DEFAULT_HOTSPOT_TOOLTIP_OFFSET, DEFAULT_PANO_CURSORS, DEFAULT_PANO_VIDEO_CAPTION_APPEARANCE, DEFAULT_PANO_VIDEO_CONTROLS_APPEARANCE, DEFAULT_PANO_VIDEO_PLAYBACK_RATES, DEFAULT_WEBVR_CHROME_APPEARANCE, DEFAULT_WEBVR_CURSOR_DWELL_MS, type DiamondGraphic, type GraphicDefinition, GraphicHotspot, type GraphicHotspotDefinition, type GraphicHotspotProps, Gyro, type GyroHandle, type GyroProps, type GyroTouchMode, type HotspotCommonProps, type HotspotDefinition, type HotspotDefinitionBase, type HotspotDragEvent, type HotspotInputSource, type HotspotInteractionEvent, type HotspotMode, type HotspotPointerEvents, type HotspotPosition, type HotspotScaleMode, type HotspotTooltipAppearance, type HotspotTooltipContent, type HotspotTooltipPlacement, type HotspotTooltipTrigger, IframeHotspot, type IframeHotspotDefinition, type IframeHotspotProps, type IframePointerPolicy, ImageHotspot, type ImageHotspotDefinition, type ImageHotspotProps, type KeyboardControlAction, type KeyboardControlKeys, KeyboardControls, type KeyboardControlsProps, MAX_HOTSPOT_PITCH, MIN_PANO_CONTEXT_MENU_BACKGROUND_OPACITY, type MouseControlButton, MouseControls, type MouseControlsOptions, type MouseControlsProps, PANO_FILTER_PRESETS, PanoContextMenu, type PanoContextMenuActionItem, type PanoContextMenuAppearance, type PanoContextMenuEntry, type PanoContextMenuItem, type PanoContextMenuPresetActions, type PanoContextMenuPresetId, type PanoContextMenuPresetRef, type PanoContextMenuPresets, type PanoContextMenuProps, type PanoContextMenuRenderProps, type PanoContextMenuSelectContext, type PanoContextMenuSeparatorItem, type PanoCursor, type PanoCursors, type PanoEventBus, type PanoEventListener, type PanoEventMap, type PanoEventType, PanoEvents, type PanoEventsProps, PanoFilter, type PanoFilterPreset, type PanoFilterProps, type PanoResizeEvent, PanoVideo, type PanoVideoCaptionAppearance, type PanoVideoController, PanoVideoControls, type PanoVideoControlsAppearance, type PanoVideoControlsProps, type PanoVideoErrorEvent, type PanoVideoErrorSource, type PanoVideoPlaybackSnapshot, type PanoVideoProps, type PanoVideoSource, type PanoVideoTrack, type PanoVideoTrackKind, type PanoVideoVariant, PanoViewer, type PanoViewerHandle, type PanoViewerProps, type PanoViewerState, type PanoWheelEvent, type PanoramaControlsOptions, type PanoramaPointerEvent, type PointHotspotDefinition, type PointHotspotDefinitionBase, PolygonHotspot, type PolygonHotspotDefinition, type PolygonHotspotProps, type PolygonValidationCode, type PolygonValidationIssue, type PolygonVerticesChangeEvent, PolylineHotspot, type PolylineHotspotDefinition, type PolylineHotspotProps, type PolylineValidationIssue, type PolylineVerticesChangeEvent, type RectangleGraphic, type RingGraphic, type Scene, type SceneTransition, type SceneTransitionEndEvent, type SceneTransitionErrorEvent, type SceneTransitionPreset, Scenes, type ScenesProps, type SequenceFrameDirection, type SequenceFrameEvent, SequenceHotspot, type SequenceHotspotDefinition, type SequenceHotspotErrorEvent, type SequenceHotspotProps, type SequenceLoadProgress, type SequencePlaybackState, type SetPanoViewerOptions, Sphere, type SphereProps, type SphereScene, type StarGraphic, type SvgGraphic, type SvgPathGraphic, TextHotspot, type TextHotspotAlign, type TextHotspotDefinition, type TextHotspotFontStyle, type TextHotspotProps, type TextHotspotStyle, type TextHotspotVerticalAlign, type TextHotspotWhiteSpace, Tile, type TileAddress, type TileLoadError, type TileLoadProgress, type TileMultiresConfig, type TileProps, type TileScene, TouchControls, type TouchControlsOptions, type TouchControlsProps, type TriangleGraphic, VideoHotspot, type VideoHotspotDefinition, type VideoHotspotErrorEvent, type VideoHotspotProps, type VideoPlaybackState, type ViewInteractionEvent, type ViewInteractionSource, WEBVR_PROFILES, WEBVR_PROFILE_IDS, WebVR, type WebVRChrome, type WebVRChromeAppearance, type WebVRHandle, type WebVRMode, type WebVRProfile, type WebVRProfileId, type WebVRProps, type WebVRSettings, clampPanoPitch, composePanoContextMenuItems, createDefaultPanoContextMenuItems, createPanoContextMenuPresets, cycleSceneId, normalizePanoPosition, normalizePanoYaw, panoPositionToVector3, resolvePanoContextMenuEntries, unwrapPolygonVertices, usePanoEvents, validatePolygonVertices, validatePolylineVertices, vector3ToPanoPosition };
|
|
1581
|
+
export { type ArrowGraphic, AudioHotspot, type AudioHotspotDefinition, type AudioHotspotErrorEvent, type AudioHotspotProps, type AudioPlaybackState, AutoRotate, type AutoRotateProps, BackgroundAudio, type BackgroundAudioController, type BackgroundAudioErrorEvent, type BackgroundAudioProps, type BackgroundAudioSnapshot, type BackgroundAudioSource, type CircleGraphic, type CubeFaceCode, DEFAULT_HOTSPOT_TOOLTIP_APPEARANCE, DEFAULT_HOTSPOT_TOOLTIP_OFFSET, DEFAULT_PANO_CURSORS, DEFAULT_PANO_VIDEO_CAPTION_APPEARANCE, DEFAULT_PANO_VIDEO_CONTROLS_APPEARANCE, DEFAULT_PANO_VIDEO_PLAYBACK_RATES, DEFAULT_WEBVR_CHROME_APPEARANCE, DEFAULT_WEBVR_CURSOR_DWELL_MS, type DiamondGraphic, type GraphicDefinition, GraphicHotspot, type GraphicHotspotDefinition, type GraphicHotspotProps, Gyro, type GyroHandle, type GyroProps, type GyroTouchMode, type HotspotCommonProps, type HotspotDefinition, type HotspotDefinitionBase, type HotspotDragEvent, type HotspotInputSource, type HotspotInteractionEvent, type HotspotMode, type HotspotPointerEvents, type HotspotPosition, type HotspotScaleMode, type HotspotTooltipAppearance, type HotspotTooltipContent, type HotspotTooltipPlacement, type HotspotTooltipTrigger, IframeHotspot, type IframeHotspotDefinition, type IframeHotspotProps, type IframePointerPolicy, ImageHotspot, type ImageHotspotDefinition, type ImageHotspotProps, type KeyboardControlAction, type KeyboardControlKeys, KeyboardControls, type KeyboardControlsProps, MAX_HOTSPOT_PITCH, MIN_PANO_CONTEXT_MENU_BACKGROUND_OPACITY, type MouseControlButton, MouseControls, type MouseControlsOptions, type MouseControlsProps, PANO_FILTER_PRESETS, PanoContextMenu, type PanoContextMenuActionItem, type PanoContextMenuAppearance, type PanoContextMenuEntry, type PanoContextMenuItem, type PanoContextMenuPresetActions, type PanoContextMenuPresetId, type PanoContextMenuPresetRef, type PanoContextMenuPresets, type PanoContextMenuProps, type PanoContextMenuRenderProps, type PanoContextMenuSelectContext, type PanoContextMenuSeparatorItem, type PanoCursor, type PanoCursors, type PanoEventBus, type PanoEventListener, type PanoEventMap, type PanoEventType, PanoEvents, type PanoEventsProps, PanoFilter, type PanoFilterPreset, type PanoFilterProps, type PanoResizeEvent, PanoVideo, type PanoVideoCaptionAppearance, type PanoVideoController, PanoVideoControls, type PanoVideoControlsAppearance, type PanoVideoControlsProps, type PanoVideoErrorEvent, type PanoVideoErrorSource, type PanoVideoPlaybackSnapshot, type PanoVideoProps, type PanoVideoSource, type PanoVideoTrack, type PanoVideoTrackKind, type PanoVideoVariant, PanoViewer, type PanoViewerHandle, type PanoViewerProps, type PanoViewerState, type PanoWheelEvent, type PanoramaControlsOptions, type PanoramaPointerEvent, type PointHotspotDefinition, type PointHotspotDefinitionBase, PolygonHotspot, type PolygonHotspotDefinition, type PolygonHotspotProps, type PolygonValidationCode, type PolygonValidationIssue, type PolygonVerticesChangeEvent, PolylineHotspot, type PolylineHotspotDefinition, type PolylineHotspotProps, type PolylineValidationIssue, type PolylineVerticesChangeEvent, type RectangleGraphic, type RingGraphic, type Scene, type SceneTransition, type SceneTransitionEndEvent, type SceneTransitionErrorEvent, type SceneTransitionPreset, Scenes, type ScenesController, type ScenesProps, type SequenceFrameDirection, type SequenceFrameEvent, SequenceHotspot, type SequenceHotspotDefinition, type SequenceHotspotErrorEvent, type SequenceHotspotProps, type SequenceLoadProgress, type SequencePlaybackState, type SetPanoViewerOptions, Sphere, type SphereProps, type SphereScene, type StarGraphic, type SvgGraphic, type SvgPathGraphic, TextHotspot, type TextHotspotAlign, type TextHotspotDefinition, type TextHotspotFontStyle, type TextHotspotProps, type TextHotspotStyle, type TextHotspotVerticalAlign, type TextHotspotWhiteSpace, Tile, type TileAddress, type TileLoadError, type TileLoadProgress, type TileMultiresConfig, type TileProps, type TileScene, TouchControls, type TouchControlsOptions, type TouchControlsProps, type TriangleGraphic, type UsePanoViewerResult, VideoHotspot, type VideoHotspotDefinition, type VideoHotspotErrorEvent, type VideoHotspotProps, type VideoPlaybackState, type ViewInteractionEvent, type ViewInteractionSource, WEBVR_PROFILES, WEBVR_PROFILE_IDS, WebVR, type WebVRChrome, type WebVRChromeAppearance, type WebVRHandle, type WebVRMode, type WebVRProfile, type WebVRProfileId, type WebVRProps, type WebVRSettings, clampPanoPitch, composePanoContextMenuItems, createDefaultPanoContextMenuItems, createPanoContextMenuPresets, cycleSceneId, normalizePanoPosition, normalizePanoYaw, panoPositionToVector3, resolvePanoContextMenuEntries, unwrapPolygonVertices, usePanoEvents, usePanoViewer, validatePolygonVertices, validatePolylineVertices, vector3ToPanoPosition };
|