react-native-video-provider 0.1.1
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/AuVideo.podspec +28 -0
- package/LICENSE +20 -0
- package/README.md +183 -0
- package/android/build.gradle +59 -0
- package/android/src/main/AndroidManifest.xml +2 -0
- package/android/src/main/java/com/auvideo/AuVideoModule.kt +259 -0
- package/android/src/main/java/com/auvideo/AuVideoPackage.kt +35 -0
- package/android/src/main/java/com/auvideo/AuVideoSurfaceView.kt +40 -0
- package/android/src/main/java/com/auvideo/AuVideoSurfaceViewManager.kt +38 -0
- package/android/src/main/java/com/auvideo/PlayerCore.kt +366 -0
- package/android/src/main/java/com/auvideo/SurfaceRegistry.kt +26 -0
- package/android/src/main/res/layout/au_video_player_view.xml +10 -0
- package/ios/AuVideo.h +10 -0
- package/ios/AuVideo.mm +232 -0
- package/ios/AuVideoOrientation.swift +59 -0
- package/ios/AuVideoPlayerCore.swift +415 -0
- package/ios/AuVideoSurfaceRegistry.swift +30 -0
- package/ios/AuVideoSurfaceView.h +15 -0
- package/ios/AuVideoSurfaceView.mm +63 -0
- package/lib/module/AuVideoSurfaceNativeComponent.ts +8 -0
- package/lib/module/NativeAuVideo.js +5 -0
- package/lib/module/NativeAuVideo.js.map +1 -0
- package/lib/module/components/FloatingPlayer.js +119 -0
- package/lib/module/components/FloatingPlayer.js.map +1 -0
- package/lib/module/components/FullscreenPlayer.js +59 -0
- package/lib/module/components/FullscreenPlayer.js.map +1 -0
- package/lib/module/components/GestureOverlay.js +56 -0
- package/lib/module/components/GestureOverlay.js.map +1 -0
- package/lib/module/components/MiniPlayer.js +89 -0
- package/lib/module/components/MiniPlayer.js.map +1 -0
- package/lib/module/components/VideoControls.js +191 -0
- package/lib/module/components/VideoControls.js.map +1 -0
- package/lib/module/components/VideoPlayer.js +65 -0
- package/lib/module/components/VideoPlayer.js.map +1 -0
- package/lib/module/components/VideoSurface.js +35 -0
- package/lib/module/components/VideoSurface.js.map +1 -0
- package/lib/module/core/VideoManager.js +436 -0
- package/lib/module/core/VideoManager.js.map +1 -0
- package/lib/module/hooks/useFullscreen.js +19 -0
- package/lib/module/hooks/useFullscreen.js.map +1 -0
- package/lib/module/hooks/usePiP.js +17 -0
- package/lib/module/hooks/usePiP.js.map +1 -0
- package/lib/module/hooks/usePlayback.js +21 -0
- package/lib/module/hooks/usePlayback.js.map +1 -0
- package/lib/module/hooks/useVideo.js +17 -0
- package/lib/module/hooks/useVideo.js.map +1 -0
- package/lib/module/hooks/useVideoEvents.js +26 -0
- package/lib/module/hooks/useVideoEvents.js.map +1 -0
- package/lib/module/index.js +19 -0
- package/lib/module/index.js.map +1 -0
- package/lib/module/package.json +1 -0
- package/lib/module/provider/VideoContext.js +14 -0
- package/lib/module/provider/VideoContext.js.map +1 -0
- package/lib/module/provider/VideoProvider.js +36 -0
- package/lib/module/provider/VideoProvider.js.map +1 -0
- package/lib/module/state/createVideoStore.js +33 -0
- package/lib/module/state/createVideoStore.js.map +1 -0
- package/lib/module/types/events.js +4 -0
- package/lib/module/types/events.js.map +1 -0
- package/lib/module/types/index.js +2 -0
- package/lib/module/types/index.js.map +1 -0
- package/lib/module/types/video.js +2 -0
- package/lib/module/types/video.js.map +1 -0
- package/lib/module/utils/Emitter.js +39 -0
- package/lib/module/utils/Emitter.js.map +1 -0
- package/lib/module/utils/formatTime.js +15 -0
- package/lib/module/utils/formatTime.js.map +1 -0
- package/lib/typescript/package.json +1 -0
- package/lib/typescript/src/AuVideoSurfaceNativeComponent.d.ts +8 -0
- package/lib/typescript/src/AuVideoSurfaceNativeComponent.d.ts.map +1 -0
- package/lib/typescript/src/NativeAuVideo.d.ts +85 -0
- package/lib/typescript/src/NativeAuVideo.d.ts.map +1 -0
- package/lib/typescript/src/components/FloatingPlayer.d.ts +12 -0
- package/lib/typescript/src/components/FloatingPlayer.d.ts.map +1 -0
- package/lib/typescript/src/components/FullscreenPlayer.d.ts +12 -0
- package/lib/typescript/src/components/FullscreenPlayer.d.ts.map +1 -0
- package/lib/typescript/src/components/GestureOverlay.d.ts +14 -0
- package/lib/typescript/src/components/GestureOverlay.d.ts.map +1 -0
- package/lib/typescript/src/components/MiniPlayer.d.ts +16 -0
- package/lib/typescript/src/components/MiniPlayer.d.ts.map +1 -0
- package/lib/typescript/src/components/VideoControls.d.ts +17 -0
- package/lib/typescript/src/components/VideoControls.d.ts.map +1 -0
- package/lib/typescript/src/components/VideoPlayer.d.ts +27 -0
- package/lib/typescript/src/components/VideoPlayer.d.ts.map +1 -0
- package/lib/typescript/src/components/VideoSurface.d.ts +18 -0
- package/lib/typescript/src/components/VideoSurface.d.ts.map +1 -0
- package/lib/typescript/src/core/VideoManager.d.ts +88 -0
- package/lib/typescript/src/core/VideoManager.d.ts.map +1 -0
- package/lib/typescript/src/hooks/useFullscreen.d.ts +7 -0
- package/lib/typescript/src/hooks/useFullscreen.d.ts.map +1 -0
- package/lib/typescript/src/hooks/usePiP.d.ts +6 -0
- package/lib/typescript/src/hooks/usePiP.d.ts.map +1 -0
- package/lib/typescript/src/hooks/usePlayback.d.ts +13 -0
- package/lib/typescript/src/hooks/usePlayback.d.ts.map +1 -0
- package/lib/typescript/src/hooks/useVideo.d.ts +13 -0
- package/lib/typescript/src/hooks/useVideo.d.ts.map +1 -0
- package/lib/typescript/src/hooks/useVideoEvents.d.ts +14 -0
- package/lib/typescript/src/hooks/useVideoEvents.d.ts.map +1 -0
- package/lib/typescript/src/index.d.ts +18 -0
- package/lib/typescript/src/index.d.ts.map +1 -0
- package/lib/typescript/src/provider/VideoContext.d.ts +8 -0
- package/lib/typescript/src/provider/VideoContext.d.ts.map +1 -0
- package/lib/typescript/src/provider/VideoProvider.d.ts +18 -0
- package/lib/typescript/src/provider/VideoProvider.d.ts.map +1 -0
- package/lib/typescript/src/state/createVideoStore.d.ts +6 -0
- package/lib/typescript/src/state/createVideoStore.d.ts.map +1 -0
- package/lib/typescript/src/types/events.d.ts +46 -0
- package/lib/typescript/src/types/events.d.ts.map +1 -0
- package/lib/typescript/src/types/index.d.ts +3 -0
- package/lib/typescript/src/types/index.d.ts.map +1 -0
- package/lib/typescript/src/types/video.d.ts +70 -0
- package/lib/typescript/src/types/video.d.ts.map +1 -0
- package/lib/typescript/src/utils/Emitter.d.ts +15 -0
- package/lib/typescript/src/utils/Emitter.d.ts.map +1 -0
- package/lib/typescript/src/utils/formatTime.d.ts +2 -0
- package/lib/typescript/src/utils/formatTime.d.ts.map +1 -0
- package/package.json +154 -0
- package/src/AuVideoSurfaceNativeComponent.ts +8 -0
- package/src/NativeAuVideo.ts +106 -0
- package/src/components/FloatingPlayer.tsx +130 -0
- package/src/components/FullscreenPlayer.tsx +64 -0
- package/src/components/GestureOverlay.tsx +76 -0
- package/src/components/MiniPlayer.tsx +93 -0
- package/src/components/VideoControls.tsx +213 -0
- package/src/components/VideoPlayer.tsx +77 -0
- package/src/components/VideoSurface.tsx +39 -0
- package/src/core/VideoManager.ts +441 -0
- package/src/hooks/useFullscreen.ts +14 -0
- package/src/hooks/usePiP.ts +13 -0
- package/src/hooks/usePlayback.ts +26 -0
- package/src/hooks/useVideo.ts +16 -0
- package/src/hooks/useVideoEvents.ts +33 -0
- package/src/index.ts +54 -0
- package/src/provider/VideoContext.ts +12 -0
- package/src/provider/VideoProvider.tsx +41 -0
- package/src/state/createVideoStore.ts +33 -0
- package/src/types/events.ts +22 -0
- package/src/types/index.ts +11 -0
- package/src/types/video.ts +85 -0
- package/src/utils/Emitter.ts +51 -0
- package/src/utils/formatTime.ts +12 -0
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { Modal, StatusBar, StyleSheet, View } from 'react-native';
|
|
4
|
+
import { FULLSCREEN_SURFACE_ID } from "../core/VideoManager.js";
|
|
5
|
+
import { usePlayback } from "../hooks/usePlayback.js";
|
|
6
|
+
import { useVideoManager } from "../provider/VideoContext.js";
|
|
7
|
+
import { VideoControls } from "./VideoControls.js";
|
|
8
|
+
import { VideoSurface } from "./VideoSurface.js";
|
|
9
|
+
|
|
10
|
+
/**
|
|
11
|
+
* Built-in fullscreen host, rendered by VideoProvider. While visible,
|
|
12
|
+
* rotation is unlocked natively (all orientations allowed); on exit the
|
|
13
|
+
* previous orientation lock is restored and the player re-attaches to the
|
|
14
|
+
* surface it came from.
|
|
15
|
+
*
|
|
16
|
+
* Rendered automatically — you normally never mount this yourself. Apps
|
|
17
|
+
* that want fullscreen "inside" a navigation screen can instead render a
|
|
18
|
+
* plain <VideoSurface> there and call attach().
|
|
19
|
+
*/
|
|
20
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
21
|
+
export function FullscreenPlayer() {
|
|
22
|
+
const manager = useVideoManager();
|
|
23
|
+
const fullscreen = usePlayback(s => s.fullscreen);
|
|
24
|
+
if (!fullscreen) {
|
|
25
|
+
return null;
|
|
26
|
+
}
|
|
27
|
+
return /*#__PURE__*/_jsxs(Modal, {
|
|
28
|
+
visible: true,
|
|
29
|
+
transparent: false,
|
|
30
|
+
animationType: "fade",
|
|
31
|
+
presentationStyle: "fullScreen",
|
|
32
|
+
statusBarTranslucent: true,
|
|
33
|
+
navigationBarTranslucent: true,
|
|
34
|
+
supportedOrientations: ['portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right'],
|
|
35
|
+
onRequestClose: () => manager.exitFullscreen(),
|
|
36
|
+
children: [/*#__PURE__*/_jsx(StatusBar, {
|
|
37
|
+
hidden: true
|
|
38
|
+
}), /*#__PURE__*/_jsxs(View, {
|
|
39
|
+
style: styles.container,
|
|
40
|
+
children: [/*#__PURE__*/_jsx(VideoSurface, {
|
|
41
|
+
surfaceId: FULLSCREEN_SURFACE_ID,
|
|
42
|
+
autoAttach: true,
|
|
43
|
+
style: styles.surface
|
|
44
|
+
}), /*#__PURE__*/_jsx(VideoControls, {
|
|
45
|
+
onClose: () => manager.exitFullscreen()
|
|
46
|
+
})]
|
|
47
|
+
})]
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
const styles = StyleSheet.create({
|
|
51
|
+
container: {
|
|
52
|
+
flex: 1,
|
|
53
|
+
backgroundColor: '#000'
|
|
54
|
+
},
|
|
55
|
+
surface: {
|
|
56
|
+
flex: 1
|
|
57
|
+
}
|
|
58
|
+
});
|
|
59
|
+
//# sourceMappingURL=FullscreenPlayer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Modal","StatusBar","StyleSheet","View","FULLSCREEN_SURFACE_ID","usePlayback","useVideoManager","VideoControls","VideoSurface","jsx","_jsx","jsxs","_jsxs","FullscreenPlayer","manager","fullscreen","s","visible","transparent","animationType","presentationStyle","statusBarTranslucent","navigationBarTranslucent","supportedOrientations","onRequestClose","exitFullscreen","children","hidden","style","styles","container","surfaceId","autoAttach","surface","onClose","create","flex","backgroundColor"],"sourceRoot":"../../../src","sources":["components/FullscreenPlayer.tsx"],"mappings":";;AAAA,SAASA,KAAK,EAAEC,SAAS,EAAEC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AACjE,SAASC,qBAAqB,QAAQ,yBAAsB;AAC5D,SAASC,WAAW,QAAQ,yBAAsB;AAClD,SAASC,eAAe,QAAQ,6BAA0B;AAC1D,SAASC,aAAa,QAAQ,oBAAiB;AAC/C,SAASC,YAAY,QAAQ,mBAAgB;;AAE7C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AATA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAUA,OAAO,SAASC,gBAAgBA,CAAA,EAAG;EACjC,MAAMC,OAAO,GAAGR,eAAe,CAAC,CAAC;EACjC,MAAMS,UAAU,GAAGV,WAAW,CAAEW,CAAC,IAAKA,CAAC,CAACD,UAAU,CAAC;EAEnD,IAAI,CAACA,UAAU,EAAE;IACf,OAAO,IAAI;EACb;EAEA,oBACEH,KAAA,CAACZ,KAAK;IACJiB,OAAO;IACPC,WAAW,EAAE,KAAM;IACnBC,aAAa,EAAC,MAAM;IACpBC,iBAAiB,EAAC,YAAY;IAC9BC,oBAAoB;IACpBC,wBAAwB;IACxBC,qBAAqB,EAAE,CACrB,UAAU,EACV,sBAAsB,EACtB,WAAW,EACX,gBAAgB,EAChB,iBAAiB,CACjB;IACFC,cAAc,EAAEA,CAAA,KAAMV,OAAO,CAACW,cAAc,CAAC,CAAE;IAAAC,QAAA,gBAE/ChB,IAAA,CAACT,SAAS;MAAC0B,MAAM;IAAA,CAAE,CAAC,eACpBf,KAAA,CAACT,IAAI;MAACyB,KAAK,EAAEC,MAAM,CAACC,SAAU;MAAAJ,QAAA,gBAC5BhB,IAAA,CAACF,YAAY;QACXuB,SAAS,EAAE3B,qBAAsB;QACjC4B,UAAU;QACVJ,KAAK,EAAEC,MAAM,CAACI;MAAQ,CACvB,CAAC,eACFvB,IAAA,CAACH,aAAa;QAAC2B,OAAO,EAAEA,CAAA,KAAMpB,OAAO,CAACW,cAAc,CAAC;MAAE,CAAE,CAAC;IAAA,CACtD,CAAC;EAAA,CACF,CAAC;AAEZ;AAEA,MAAMI,MAAM,GAAG3B,UAAU,CAACiC,MAAM,CAAC;EAC/BL,SAAS,EAAE;IACTM,IAAI,EAAE,CAAC;IACPC,eAAe,EAAE;EACnB,CAAC;EACDJ,OAAO,EAAE;IACPG,IAAI,EAAE;EACR;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useCallback, useRef } from 'react';
|
|
4
|
+
import { Pressable, StyleSheet } from 'react-native';
|
|
5
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
6
|
+
const DOUBLE_TAP_MS = 280;
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Tap layer for player chrome: single tap (toggle controls), double tap
|
|
10
|
+
* left/right (seek back/forward), long press. Pinch/brightness/volume
|
|
11
|
+
* gestures are on the roadmap (need native cooperation).
|
|
12
|
+
*/
|
|
13
|
+
export function GestureOverlay({
|
|
14
|
+
onSingleTap,
|
|
15
|
+
onDoubleTapLeft,
|
|
16
|
+
onDoubleTapRight,
|
|
17
|
+
onLongPress,
|
|
18
|
+
children
|
|
19
|
+
}) {
|
|
20
|
+
const width = useRef(0);
|
|
21
|
+
const lastTap = useRef(0);
|
|
22
|
+
const singleTapTimer = useRef(null);
|
|
23
|
+
const onLayout = useCallback(e => {
|
|
24
|
+
width.current = e.nativeEvent.layout.width;
|
|
25
|
+
}, []);
|
|
26
|
+
const handlePress = useCallback(e => {
|
|
27
|
+
const now = Date.now();
|
|
28
|
+
const x = e.nativeEvent.locationX;
|
|
29
|
+
if (now - lastTap.current < DOUBLE_TAP_MS) {
|
|
30
|
+
lastTap.current = 0;
|
|
31
|
+
if (singleTapTimer.current) {
|
|
32
|
+
clearTimeout(singleTapTimer.current);
|
|
33
|
+
singleTapTimer.current = null;
|
|
34
|
+
}
|
|
35
|
+
if (x < width.current / 2) {
|
|
36
|
+
onDoubleTapLeft?.();
|
|
37
|
+
} else {
|
|
38
|
+
onDoubleTapRight?.();
|
|
39
|
+
}
|
|
40
|
+
return;
|
|
41
|
+
}
|
|
42
|
+
lastTap.current = now;
|
|
43
|
+
singleTapTimer.current = setTimeout(() => {
|
|
44
|
+
singleTapTimer.current = null;
|
|
45
|
+
onSingleTap?.();
|
|
46
|
+
}, DOUBLE_TAP_MS);
|
|
47
|
+
}, [onSingleTap, onDoubleTapLeft, onDoubleTapRight]);
|
|
48
|
+
return /*#__PURE__*/_jsx(Pressable, {
|
|
49
|
+
style: StyleSheet.absoluteFill,
|
|
50
|
+
onLayout: onLayout,
|
|
51
|
+
onPress: handlePress,
|
|
52
|
+
onLongPress: onLongPress,
|
|
53
|
+
children: children
|
|
54
|
+
});
|
|
55
|
+
}
|
|
56
|
+
//# sourceMappingURL=GestureOverlay.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useCallback","useRef","Pressable","StyleSheet","jsx","_jsx","DOUBLE_TAP_MS","GestureOverlay","onSingleTap","onDoubleTapLeft","onDoubleTapRight","onLongPress","children","width","lastTap","singleTapTimer","onLayout","e","current","nativeEvent","layout","handlePress","now","Date","x","locationX","clearTimeout","setTimeout","style","absoluteFill","onPress"],"sourceRoot":"../../../src","sources":["components/GestureOverlay.tsx"],"mappings":";;AAAA,SAASA,WAAW,EAAEC,MAAM,QAAgC,OAAO;AACnE,SACEC,SAAS,EACTC,UAAU,QAGL,cAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAStB,MAAMC,aAAa,GAAG,GAAG;;AAEzB;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,cAAcA,CAAC;EAC7BC,WAAW;EACXC,eAAe;EACfC,gBAAgB;EAChBC,WAAW;EACXC;AACmB,CAAC,EAAE;EACtB,MAAMC,KAAK,GAAGZ,MAAM,CAAC,CAAC,CAAC;EACvB,MAAMa,OAAO,GAAGb,MAAM,CAAC,CAAC,CAAC;EACzB,MAAMc,cAAc,GAAGd,MAAM,CAAuC,IAAI,CAAC;EAEzE,MAAMe,QAAQ,GAAGhB,WAAW,CAAEiB,CAAoB,IAAK;IACrDJ,KAAK,CAACK,OAAO,GAAGD,CAAC,CAACE,WAAW,CAACC,MAAM,CAACP,KAAK;EAC5C,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMQ,WAAW,GAAGrB,WAAW,CAC5BiB,CAAwB,IAAK;IAC5B,MAAMK,GAAG,GAAGC,IAAI,CAACD,GAAG,CAAC,CAAC;IACtB,MAAME,CAAC,GAAGP,CAAC,CAACE,WAAW,CAACM,SAAS;IAEjC,IAAIH,GAAG,GAAGR,OAAO,CAACI,OAAO,GAAGZ,aAAa,EAAE;MACzCQ,OAAO,CAACI,OAAO,GAAG,CAAC;MACnB,IAAIH,cAAc,CAACG,OAAO,EAAE;QAC1BQ,YAAY,CAACX,cAAc,CAACG,OAAO,CAAC;QACpCH,cAAc,CAACG,OAAO,GAAG,IAAI;MAC/B;MACA,IAAIM,CAAC,GAAGX,KAAK,CAACK,OAAO,GAAG,CAAC,EAAE;QACzBT,eAAe,GAAG,CAAC;MACrB,CAAC,MAAM;QACLC,gBAAgB,GAAG,CAAC;MACtB;MACA;IACF;IAEAI,OAAO,CAACI,OAAO,GAAGI,GAAG;IACrBP,cAAc,CAACG,OAAO,GAAGS,UAAU,CAAC,MAAM;MACxCZ,cAAc,CAACG,OAAO,GAAG,IAAI;MAC7BV,WAAW,GAAG,CAAC;IACjB,CAAC,EAAEF,aAAa,CAAC;EACnB,CAAC,EACD,CAACE,WAAW,EAAEC,eAAe,EAAEC,gBAAgB,CACjD,CAAC;EAED,oBACEL,IAAA,CAACH,SAAS;IACR0B,KAAK,EAAEzB,UAAU,CAAC0B,YAAa;IAC/Bb,QAAQ,EAAEA,QAAS;IACnBc,OAAO,EAAET,WAAY;IACrBV,WAAW,EAAEA,WAAY;IAAAC,QAAA,EAExBA;EAAQ,CACA,CAAC;AAEhB","ignoreList":[]}
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { Pressable, StyleSheet, Text, View } from 'react-native';
|
|
4
|
+
import { usePlayback } from "../hooks/usePlayback.js";
|
|
5
|
+
import { useVideoManager } from "../provider/VideoContext.js";
|
|
6
|
+
import { VideoSurface } from "./VideoSurface.js";
|
|
7
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
8
|
+
/**
|
|
9
|
+
* Docked mini player bar (Spotify style): thumbnail surface, title,
|
|
10
|
+
* play/pause and close. Attach it with `attach(surfaceId)` — typically when
|
|
11
|
+
* the user leaves the screen that owned playback.
|
|
12
|
+
*/
|
|
13
|
+
export function MiniPlayer({
|
|
14
|
+
surfaceId = '__au_mini__',
|
|
15
|
+
onPress,
|
|
16
|
+
onClose,
|
|
17
|
+
style,
|
|
18
|
+
...rest
|
|
19
|
+
}) {
|
|
20
|
+
const manager = useVideoManager();
|
|
21
|
+
const playing = usePlayback(s => s.playing);
|
|
22
|
+
const title = usePlayback(s => s.currentVideo?.title ?? '');
|
|
23
|
+
return /*#__PURE__*/_jsxs(View, {
|
|
24
|
+
style: [styles.bar, style],
|
|
25
|
+
...rest,
|
|
26
|
+
children: [/*#__PURE__*/_jsxs(Pressable, {
|
|
27
|
+
style: styles.body,
|
|
28
|
+
onPress: onPress,
|
|
29
|
+
children: [/*#__PURE__*/_jsx(VideoSurface, {
|
|
30
|
+
surfaceId: surfaceId,
|
|
31
|
+
style: styles.thumb
|
|
32
|
+
}), /*#__PURE__*/_jsx(Text, {
|
|
33
|
+
style: styles.title,
|
|
34
|
+
numberOfLines: 1,
|
|
35
|
+
children: title
|
|
36
|
+
})]
|
|
37
|
+
}), /*#__PURE__*/_jsx(Pressable, {
|
|
38
|
+
style: styles.button,
|
|
39
|
+
hitSlop: 8,
|
|
40
|
+
onPress: () => manager.toggle(),
|
|
41
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
42
|
+
style: styles.icon,
|
|
43
|
+
children: playing ? '❙❙' : '▶'
|
|
44
|
+
})
|
|
45
|
+
}), onClose ? /*#__PURE__*/_jsx(Pressable, {
|
|
46
|
+
style: styles.button,
|
|
47
|
+
hitSlop: 8,
|
|
48
|
+
onPress: onClose,
|
|
49
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
50
|
+
style: styles.icon,
|
|
51
|
+
children: "\u2715"
|
|
52
|
+
})
|
|
53
|
+
}) : null]
|
|
54
|
+
});
|
|
55
|
+
}
|
|
56
|
+
const styles = StyleSheet.create({
|
|
57
|
+
bar: {
|
|
58
|
+
flexDirection: 'row',
|
|
59
|
+
alignItems: 'center',
|
|
60
|
+
backgroundColor: '#1c1c1e',
|
|
61
|
+
height: 56,
|
|
62
|
+
paddingRight: 8
|
|
63
|
+
},
|
|
64
|
+
body: {
|
|
65
|
+
flex: 1,
|
|
66
|
+
flexDirection: 'row',
|
|
67
|
+
alignItems: 'center',
|
|
68
|
+
gap: 10
|
|
69
|
+
},
|
|
70
|
+
thumb: {
|
|
71
|
+
width: 56 * (16 / 9),
|
|
72
|
+
height: 56,
|
|
73
|
+
backgroundColor: '#000'
|
|
74
|
+
},
|
|
75
|
+
title: {
|
|
76
|
+
flex: 1,
|
|
77
|
+
color: '#fff',
|
|
78
|
+
fontSize: 14
|
|
79
|
+
},
|
|
80
|
+
button: {
|
|
81
|
+
paddingHorizontal: 10,
|
|
82
|
+
paddingVertical: 8
|
|
83
|
+
},
|
|
84
|
+
icon: {
|
|
85
|
+
color: '#fff',
|
|
86
|
+
fontSize: 16
|
|
87
|
+
}
|
|
88
|
+
});
|
|
89
|
+
//# sourceMappingURL=MiniPlayer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Pressable","StyleSheet","Text","View","usePlayback","useVideoManager","VideoSurface","jsx","_jsx","jsxs","_jsxs","MiniPlayer","surfaceId","onPress","onClose","style","rest","manager","playing","s","title","currentVideo","styles","bar","children","body","thumb","numberOfLines","button","hitSlop","toggle","icon","create","flexDirection","alignItems","backgroundColor","height","paddingRight","flex","gap","width","color","fontSize","paddingHorizontal","paddingVertical"],"sourceRoot":"../../../src","sources":["components/MiniPlayer.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,191 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
4
|
+
import { Pressable, StyleSheet, Text, View } from 'react-native';
|
|
5
|
+
import { useVideoManager } from "../provider/VideoContext.js";
|
|
6
|
+
import { usePlayback } from "../hooks/usePlayback.js";
|
|
7
|
+
import { formatTime } from "../utils/formatTime.js";
|
|
8
|
+
import { GestureOverlay } from "./GestureOverlay.js";
|
|
9
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
|
+
/**
|
|
11
|
+
* Minimal built-in chrome: play/pause, seek bar, time, mute and fullscreen
|
|
12
|
+
* toggles, with tap-to-show / double-tap-to-seek gestures. Apps wanting a
|
|
13
|
+
* custom design can ignore this and build on usePlayback()/useVideo().
|
|
14
|
+
*/
|
|
15
|
+
export function VideoControls({
|
|
16
|
+
doubleTapSeek = 10,
|
|
17
|
+
hideAfter = 3000,
|
|
18
|
+
showFullscreenButton = true,
|
|
19
|
+
onClose
|
|
20
|
+
}) {
|
|
21
|
+
const manager = useVideoManager();
|
|
22
|
+
const playing = usePlayback(s => s.playing);
|
|
23
|
+
const buffering = usePlayback(s => s.buffering);
|
|
24
|
+
const position = usePlayback(s => s.position);
|
|
25
|
+
const duration = usePlayback(s => s.duration);
|
|
26
|
+
const muted = usePlayback(s => s.muted);
|
|
27
|
+
const fullscreen = usePlayback(s => s.fullscreen);
|
|
28
|
+
const [visible, setVisible] = useState(true);
|
|
29
|
+
const hideTimer = useRef(null);
|
|
30
|
+
const trackWidth = useRef(0);
|
|
31
|
+
const scheduleHide = useCallback(() => {
|
|
32
|
+
if (hideTimer.current) {
|
|
33
|
+
clearTimeout(hideTimer.current);
|
|
34
|
+
}
|
|
35
|
+
hideTimer.current = setTimeout(() => setVisible(false), hideAfter);
|
|
36
|
+
}, [hideAfter]);
|
|
37
|
+
useEffect(() => {
|
|
38
|
+
if (visible && playing) {
|
|
39
|
+
scheduleHide();
|
|
40
|
+
}
|
|
41
|
+
return () => {
|
|
42
|
+
if (hideTimer.current) {
|
|
43
|
+
clearTimeout(hideTimer.current);
|
|
44
|
+
}
|
|
45
|
+
};
|
|
46
|
+
}, [visible, playing, scheduleHide]);
|
|
47
|
+
const toggleVisible = useCallback(() => setVisible(v => !v), []);
|
|
48
|
+
const onTrackLayout = useCallback(e => {
|
|
49
|
+
trackWidth.current = e.nativeEvent.layout.width;
|
|
50
|
+
}, []);
|
|
51
|
+
const onTrackPress = useCallback(e => {
|
|
52
|
+
if (trackWidth.current > 0 && duration > 0) {
|
|
53
|
+
const ratio = e.nativeEvent.locationX / trackWidth.current;
|
|
54
|
+
manager.seek(ratio * duration);
|
|
55
|
+
}
|
|
56
|
+
scheduleHide();
|
|
57
|
+
}, [manager, duration, scheduleHide]);
|
|
58
|
+
const progress = duration > 0 ? Math.min(position / duration, 1) : 0;
|
|
59
|
+
return /*#__PURE__*/_jsxs(View, {
|
|
60
|
+
style: StyleSheet.absoluteFill,
|
|
61
|
+
pointerEvents: "box-none",
|
|
62
|
+
children: [/*#__PURE__*/_jsx(GestureOverlay, {
|
|
63
|
+
onSingleTap: toggleVisible,
|
|
64
|
+
onDoubleTapLeft: () => manager.seekBy(-doubleTapSeek),
|
|
65
|
+
onDoubleTapRight: () => manager.seekBy(doubleTapSeek)
|
|
66
|
+
}), visible ? /*#__PURE__*/_jsxs(View, {
|
|
67
|
+
style: styles.chrome,
|
|
68
|
+
pointerEvents: "box-none",
|
|
69
|
+
children: [/*#__PURE__*/_jsxs(View, {
|
|
70
|
+
style: styles.topRow,
|
|
71
|
+
children: [onClose ? /*#__PURE__*/_jsx(Pressable, {
|
|
72
|
+
style: styles.button,
|
|
73
|
+
onPress: onClose,
|
|
74
|
+
hitSlop: 8,
|
|
75
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
76
|
+
style: styles.icon,
|
|
77
|
+
children: "\u2715"
|
|
78
|
+
})
|
|
79
|
+
}) : /*#__PURE__*/_jsx(View, {}), /*#__PURE__*/_jsx(Pressable, {
|
|
80
|
+
style: styles.button,
|
|
81
|
+
onPress: () => muted ? manager.unmute() : manager.mute(),
|
|
82
|
+
hitSlop: 8,
|
|
83
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
84
|
+
style: styles.icon,
|
|
85
|
+
children: muted ? '🔇' : '🔊'
|
|
86
|
+
})
|
|
87
|
+
})]
|
|
88
|
+
}), /*#__PURE__*/_jsx(Pressable, {
|
|
89
|
+
style: styles.playButton,
|
|
90
|
+
onPress: () => {
|
|
91
|
+
manager.toggle();
|
|
92
|
+
scheduleHide();
|
|
93
|
+
},
|
|
94
|
+
hitSlop: 16,
|
|
95
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
96
|
+
style: styles.playIcon,
|
|
97
|
+
children: buffering ? '…' : playing ? '❙❙' : '▶'
|
|
98
|
+
})
|
|
99
|
+
}), /*#__PURE__*/_jsxs(View, {
|
|
100
|
+
style: styles.bottomRow,
|
|
101
|
+
children: [/*#__PURE__*/_jsx(Text, {
|
|
102
|
+
style: styles.time,
|
|
103
|
+
children: formatTime(position)
|
|
104
|
+
}), /*#__PURE__*/_jsxs(Pressable, {
|
|
105
|
+
style: styles.track,
|
|
106
|
+
onLayout: onTrackLayout,
|
|
107
|
+
onPress: onTrackPress,
|
|
108
|
+
children: [/*#__PURE__*/_jsx(View, {
|
|
109
|
+
style: styles.trackBg
|
|
110
|
+
}), /*#__PURE__*/_jsx(View, {
|
|
111
|
+
style: [styles.trackFill, {
|
|
112
|
+
width: `${progress * 100}%`
|
|
113
|
+
}]
|
|
114
|
+
})]
|
|
115
|
+
}), /*#__PURE__*/_jsx(Text, {
|
|
116
|
+
style: styles.time,
|
|
117
|
+
children: formatTime(duration)
|
|
118
|
+
}), showFullscreenButton ? /*#__PURE__*/_jsx(Pressable, {
|
|
119
|
+
style: styles.button,
|
|
120
|
+
onPress: () => manager.toggleFullscreen(),
|
|
121
|
+
hitSlop: 8,
|
|
122
|
+
children: /*#__PURE__*/_jsx(Text, {
|
|
123
|
+
style: styles.icon,
|
|
124
|
+
children: fullscreen ? '⤡' : '⤢'
|
|
125
|
+
})
|
|
126
|
+
}) : null]
|
|
127
|
+
})]
|
|
128
|
+
}) : null]
|
|
129
|
+
});
|
|
130
|
+
}
|
|
131
|
+
const styles = StyleSheet.create({
|
|
132
|
+
chrome: {
|
|
133
|
+
position: 'absolute',
|
|
134
|
+
top: 0,
|
|
135
|
+
left: 0,
|
|
136
|
+
right: 0,
|
|
137
|
+
bottom: 0,
|
|
138
|
+
backgroundColor: 'rgba(0,0,0,0.35)',
|
|
139
|
+
justifyContent: 'space-between'
|
|
140
|
+
},
|
|
141
|
+
topRow: {
|
|
142
|
+
flexDirection: 'row',
|
|
143
|
+
justifyContent: 'space-between',
|
|
144
|
+
padding: 12
|
|
145
|
+
},
|
|
146
|
+
playButton: {
|
|
147
|
+
alignSelf: 'center'
|
|
148
|
+
},
|
|
149
|
+
playIcon: {
|
|
150
|
+
color: '#fff',
|
|
151
|
+
fontSize: 34
|
|
152
|
+
},
|
|
153
|
+
bottomRow: {
|
|
154
|
+
flexDirection: 'row',
|
|
155
|
+
alignItems: 'center',
|
|
156
|
+
paddingHorizontal: 12,
|
|
157
|
+
paddingBottom: 12,
|
|
158
|
+
gap: 8
|
|
159
|
+
},
|
|
160
|
+
time: {
|
|
161
|
+
color: '#fff',
|
|
162
|
+
fontSize: 12,
|
|
163
|
+
fontVariant: ['tabular-nums']
|
|
164
|
+
},
|
|
165
|
+
track: {
|
|
166
|
+
flex: 1,
|
|
167
|
+
height: 24,
|
|
168
|
+
justifyContent: 'center'
|
|
169
|
+
},
|
|
170
|
+
trackBg: {
|
|
171
|
+
position: 'absolute',
|
|
172
|
+
left: 0,
|
|
173
|
+
right: 0,
|
|
174
|
+
height: 3,
|
|
175
|
+
borderRadius: 1.5,
|
|
176
|
+
backgroundColor: 'rgba(255,255,255,0.35)'
|
|
177
|
+
},
|
|
178
|
+
trackFill: {
|
|
179
|
+
height: 3,
|
|
180
|
+
borderRadius: 1.5,
|
|
181
|
+
backgroundColor: '#fff'
|
|
182
|
+
},
|
|
183
|
+
button: {
|
|
184
|
+
padding: 4
|
|
185
|
+
},
|
|
186
|
+
icon: {
|
|
187
|
+
color: '#fff',
|
|
188
|
+
fontSize: 18
|
|
189
|
+
}
|
|
190
|
+
});
|
|
191
|
+
//# sourceMappingURL=VideoControls.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useCallback","useEffect","useRef","useState","Pressable","StyleSheet","Text","View","useVideoManager","usePlayback","formatTime","GestureOverlay","jsx","_jsx","jsxs","_jsxs","VideoControls","doubleTapSeek","hideAfter","showFullscreenButton","onClose","manager","playing","s","buffering","position","duration","muted","fullscreen","visible","setVisible","hideTimer","trackWidth","scheduleHide","current","clearTimeout","setTimeout","toggleVisible","v","onTrackLayout","e","nativeEvent","layout","width","onTrackPress","ratio","locationX","seek","progress","Math","min","style","absoluteFill","pointerEvents","children","onSingleTap","onDoubleTapLeft","seekBy","onDoubleTapRight","styles","chrome","topRow","button","onPress","hitSlop","icon","unmute","mute","playButton","toggle","playIcon","bottomRow","time","track","onLayout","trackBg","trackFill","toggleFullscreen","create","top","left","right","bottom","backgroundColor","justifyContent","flexDirection","padding","alignSelf","color","fontSize","alignItems","paddingHorizontal","paddingBottom","gap","fontVariant","flex","height","borderRadius"],"sourceRoot":"../../../src","sources":["components/VideoControls.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,65 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useEffect } from 'react';
|
|
4
|
+
import { StyleSheet, View } from 'react-native';
|
|
5
|
+
import { useVideoManager } from "../provider/VideoContext.js";
|
|
6
|
+
import { VideoControls } from "./VideoControls.js";
|
|
7
|
+
import { VideoSurface } from "./VideoSurface.js";
|
|
8
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
9
|
+
/**
|
|
10
|
+
* Convenience all-in-one player: `setSource` (same-video handoff aware) +
|
|
11
|
+
* `attach` + surface + optional controls. Rendering two VideoPlayers with
|
|
12
|
+
* the same source id moves the ONE engine — it never creates a second one.
|
|
13
|
+
*
|
|
14
|
+
* ```tsx
|
|
15
|
+
* <VideoPlayer source={{ id: '123', uri }} style={{ aspectRatio: 16 / 9 }} />
|
|
16
|
+
* ```
|
|
17
|
+
*/
|
|
18
|
+
export function VideoPlayer({
|
|
19
|
+
source,
|
|
20
|
+
autoplay = true,
|
|
21
|
+
surfaceId,
|
|
22
|
+
controls = true,
|
|
23
|
+
resizeMode,
|
|
24
|
+
style,
|
|
25
|
+
...rest
|
|
26
|
+
}) {
|
|
27
|
+
const manager = useVideoManager();
|
|
28
|
+
const id = surfaceId ?? `player:${source.id}`;
|
|
29
|
+
useEffect(() => {
|
|
30
|
+
manager.setSource(source, {
|
|
31
|
+
autoplay,
|
|
32
|
+
surfaceId: id
|
|
33
|
+
});
|
|
34
|
+
// Attach on mount / when the video identity changes. Other source
|
|
35
|
+
// fields (title, headers) don't retrigger: identity is source.id.
|
|
36
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
37
|
+
}, [manager, source.id, id]);
|
|
38
|
+
useEffect(() => {
|
|
39
|
+
if (resizeMode) {
|
|
40
|
+
manager.setResizeMode(resizeMode);
|
|
41
|
+
}
|
|
42
|
+
}, [manager, resizeMode]);
|
|
43
|
+
return /*#__PURE__*/_jsxs(View, {
|
|
44
|
+
style: [styles.container, style],
|
|
45
|
+
...rest,
|
|
46
|
+
children: [/*#__PURE__*/_jsx(VideoSurface, {
|
|
47
|
+
surfaceId: id,
|
|
48
|
+
style: styles.surface
|
|
49
|
+
}), controls ? /*#__PURE__*/_jsx(VideoControls, {}) : null]
|
|
50
|
+
});
|
|
51
|
+
}
|
|
52
|
+
const styles = StyleSheet.create({
|
|
53
|
+
container: {
|
|
54
|
+
backgroundColor: '#000',
|
|
55
|
+
overflow: 'hidden'
|
|
56
|
+
},
|
|
57
|
+
surface: {
|
|
58
|
+
position: 'absolute',
|
|
59
|
+
top: 0,
|
|
60
|
+
left: 0,
|
|
61
|
+
right: 0,
|
|
62
|
+
bottom: 0
|
|
63
|
+
}
|
|
64
|
+
});
|
|
65
|
+
//# sourceMappingURL=VideoPlayer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useEffect","StyleSheet","View","useVideoManager","VideoControls","VideoSurface","jsx","_jsx","jsxs","_jsxs","VideoPlayer","source","autoplay","surfaceId","controls","resizeMode","style","rest","manager","id","setSource","setResizeMode","styles","container","children","surface","create","backgroundColor","overflow","position","top","left","right","bottom"],"sourceRoot":"../../../src","sources":["components/VideoPlayer.tsx"],"mappings":";;AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,SAASC,UAAU,EAAEC,IAAI,QAAwB,cAAc;AAC/D,SAASC,eAAe,QAAQ,6BAA0B;AAE1D,SAASC,aAAa,QAAQ,oBAAiB;AAC/C,SAASC,YAAY,QAAQ,mBAAgB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAiB9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,WAAWA,CAAC;EAC1BC,MAAM;EACNC,QAAQ,GAAG,IAAI;EACfC,SAAS;EACTC,QAAQ,GAAG,IAAI;EACfC,UAAU;EACVC,KAAK;EACL,GAAGC;AACa,CAAC,EAAE;EACnB,MAAMC,OAAO,GAAGf,eAAe,CAAC,CAAC;EACjC,MAAMgB,EAAE,GAAGN,SAAS,IAAI,UAAUF,MAAM,CAACQ,EAAE,EAAE;EAE7CnB,SAAS,CAAC,MAAM;IACdkB,OAAO,CAACE,SAAS,CAACT,MAAM,EAAE;MAAEC,QAAQ;MAAEC,SAAS,EAAEM;IAAG,CAAC,CAAC;IACtD;IACA;IACA;EACF,CAAC,EAAE,CAACD,OAAO,EAAEP,MAAM,CAACQ,EAAE,EAAEA,EAAE,CAAC,CAAC;EAE5BnB,SAAS,CAAC,MAAM;IACd,IAAIe,UAAU,EAAE;MACdG,OAAO,CAACG,aAAa,CAACN,UAAU,CAAC;IACnC;EACF,CAAC,EAAE,CAACG,OAAO,EAAEH,UAAU,CAAC,CAAC;EAEzB,oBACEN,KAAA,CAACP,IAAI;IAACc,KAAK,EAAE,CAACM,MAAM,CAACC,SAAS,EAAEP,KAAK,CAAE;IAAA,GAAKC,IAAI;IAAAO,QAAA,gBAC9CjB,IAAA,CAACF,YAAY;MAACQ,SAAS,EAAEM,EAAG;MAACH,KAAK,EAAEM,MAAM,CAACG;IAAQ,CAAE,CAAC,EACrDX,QAAQ,gBAAGP,IAAA,CAACH,aAAa,IAAE,CAAC,GAAG,IAAI;EAAA,CAChC,CAAC;AAEX;AAEA,MAAMkB,MAAM,GAAGrB,UAAU,CAACyB,MAAM,CAAC;EAC/BH,SAAS,EAAE;IACTI,eAAe,EAAE,MAAM;IACvBC,QAAQ,EAAE;EACZ,CAAC;EACDH,OAAO,EAAE;IACPI,QAAQ,EAAE,UAAU;IACpBC,GAAG,EAAE,CAAC;IACNC,IAAI,EAAE,CAAC;IACPC,KAAK,EAAE,CAAC;IACRC,MAAM,EAAE;EACV;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { useEffect } from 'react';
|
|
4
|
+
import AuVideoSurfaceNativeComponent from '../AuVideoSurfaceNativeComponent';
|
|
5
|
+
import { useVideoManager } from "../provider/VideoContext.js";
|
|
6
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
+
/**
|
|
8
|
+
* A dumb rendering surface. It never creates a player — it only marks a
|
|
9
|
+
* spot where the singleton engine can render. Mount as many as you like;
|
|
10
|
+
* the player shows in at most one at a time.
|
|
11
|
+
*
|
|
12
|
+
* ```tsx
|
|
13
|
+
* <VideoSurface surfaceId="feed" style={{ aspectRatio: 16 / 9 }} />
|
|
14
|
+
* ```
|
|
15
|
+
*/
|
|
16
|
+
export function VideoSurface({
|
|
17
|
+
surfaceId,
|
|
18
|
+
autoAttach = false,
|
|
19
|
+
...rest
|
|
20
|
+
}) {
|
|
21
|
+
const manager = useVideoManager();
|
|
22
|
+
useEffect(() => {
|
|
23
|
+
if (autoAttach) {
|
|
24
|
+
manager.attach(surfaceId);
|
|
25
|
+
}
|
|
26
|
+
return () => {
|
|
27
|
+
manager.handleSurfaceUnmount(surfaceId);
|
|
28
|
+
};
|
|
29
|
+
}, [manager, surfaceId, autoAttach]);
|
|
30
|
+
return /*#__PURE__*/_jsx(AuVideoSurfaceNativeComponent, {
|
|
31
|
+
surfaceId: surfaceId,
|
|
32
|
+
...rest
|
|
33
|
+
});
|
|
34
|
+
}
|
|
35
|
+
//# sourceMappingURL=VideoSurface.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["useEffect","AuVideoSurfaceNativeComponent","useVideoManager","jsx","_jsx","VideoSurface","surfaceId","autoAttach","rest","manager","attach","handleSurfaceUnmount"],"sourceRoot":"../../../src","sources":["components/VideoSurface.tsx"],"mappings":";;AAAA,SAASA,SAAS,QAAQ,OAAO;AAEjC,OAAOC,6BAA6B,MAAM,kCAAkC;AAC5E,SAASC,eAAe,QAAQ,6BAA0B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAS3D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,YAAYA,CAAC;EAC3BC,SAAS;EACTC,UAAU,GAAG,KAAK;EAClB,GAAGC;AACc,CAAC,EAAE;EACpB,MAAMC,OAAO,GAAGP,eAAe,CAAC,CAAC;EAEjCF,SAAS,CAAC,MAAM;IACd,IAAIO,UAAU,EAAE;MACdE,OAAO,CAACC,MAAM,CAACJ,SAAS,CAAC;IAC3B;IACA,OAAO,MAAM;MACXG,OAAO,CAACE,oBAAoB,CAACL,SAAS,CAAC;IACzC,CAAC;EACH,CAAC,EAAE,CAACG,OAAO,EAAEH,SAAS,EAAEC,UAAU,CAAC,CAAC;EAEpC,oBAAOH,IAAA,CAACH,6BAA6B;IAACK,SAAS,EAAEA,SAAU;IAAA,GAAKE;EAAI,CAAG,CAAC;AAC1E","ignoreList":[]}
|