@devix-technologies/react-gjirafa-vp-player 1.0.8 → 1.0.10

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.
Files changed (40) hide show
  1. package/dist/App.d.ts +2 -0
  2. package/dist/components/Feedback.d.ts +25 -0
  3. package/dist/components/VPPlayer/index.d.ts +2 -0
  4. package/dist/components/VPPlayer/ui/index.d.ts +1 -0
  5. package/dist/components/VPPlayer/ui/styled.d.ts +42 -0
  6. package/dist/config/index.d.ts +1 -0
  7. package/dist/config/vpPlayerConfig.d.ts +9 -0
  8. package/dist/constants/configs.d.ts +22 -0
  9. package/dist/constants/index.d.ts +1 -0
  10. package/dist/constants/storybook.d.ts +11 -0
  11. package/dist/constants/styles.d.ts +11 -0
  12. package/dist/constants/urls.d.ts +18 -0
  13. package/dist/constants/vpPlayer.d.ts +29 -0
  14. package/dist/contexts/VPPlayerContext.d.ts +53 -0
  15. package/dist/contexts/index.d.ts +1 -0
  16. package/dist/features/VPPlayer.d.ts +27 -0
  17. package/dist/features/stories/ads/Ads.stories.d.ts +20 -0
  18. package/dist/features/stories/context/Context.stories.d.ts +10 -0
  19. package/dist/features/stories/index.d.ts +3 -0
  20. package/dist/features/stories/playback/Playback.stories.d.ts +33 -0
  21. package/dist/fixtures/index.d.ts +1 -0
  22. package/dist/fixtures/playlist.d.ts +11 -0
  23. package/dist/hooks/index.d.ts +3 -0
  24. package/dist/hooks/useVPPlayerLogic.d.ts +22 -0
  25. package/dist/hooks/useVPPlayerScript.d.ts +13 -0
  26. package/dist/hooks/useVideoData.d.ts +21 -0
  27. package/dist/index.d.ts +9 -0
  28. package/dist/interfaces/config.d.ts +311 -0
  29. package/dist/interfaces/index.d.ts +3 -0
  30. package/dist/interfaces/instance.d.ts +73 -0
  31. package/dist/interfaces/props.d.ts +54 -0
  32. package/dist/main.d.ts +1 -0
  33. package/dist/react-gjirafa-vp-player.es.js +386 -377
  34. package/dist/react-gjirafa-vp-player.umd.js +6 -6
  35. package/dist/types/api.types.d.ts +50 -0
  36. package/dist/types/index.d.ts +1 -0
  37. package/dist/utils/index.d.ts +2 -0
  38. package/dist/utils/vpPlayerConfigBuilder.d.ts +30 -0
  39. package/dist/utils/vpPlayerUtils.d.ts +8 -0
  40. package/package.json +1 -1
@@ -0,0 +1,311 @@
1
+ /**
2
+ * Interface describing the advertising configuration options for the VP Player.
3
+ *
4
+ * @interface
5
+ * @see {@link https://vp.gjirafa.tech/documentation/docs/web-player/setup-the-player/advertising}
6
+ */
7
+ export interface VPPlayerAdsConfig {
8
+ skipAd?: {
9
+ state: boolean;
10
+ skipFrom: number;
11
+ };
12
+ vmap?: string;
13
+ VPAIDmode?: string;
14
+ enableProgrammability?: boolean;
15
+ functions?: Array<{
16
+ isDynamicKey: boolean;
17
+ isDynamicValue: boolean;
18
+ key: string;
19
+ order: number;
20
+ value: string;
21
+ }>;
22
+ bidding?: boolean;
23
+ afterMidrollBacktrack?: {
24
+ state: boolean;
25
+ seconds: number;
26
+ };
27
+ adBreaks?: Array<{
28
+ adTagUrl: string[];
29
+ breakType?: 'preroll' | 'midroll' | 'postroll';
30
+ breakTimingType?: 'time' | 'percentage' | 'playlist';
31
+ breakTimingValue?: number;
32
+ schedule?: {
33
+ type?: 'CUSTOM' | 'RECURRING';
34
+ ranges?: Array<{
35
+ startTime?: number;
36
+ endTime?: number;
37
+ count?: number;
38
+ breaks?: number[];
39
+ }>;
40
+ algorithm?: 'PASSIVE' | 'AGGRESSIVE' | 'SIMILAR_DISTANCE' | 'CUSTOM';
41
+ protectFirst?: number;
42
+ protectLast?: number;
43
+ occurEvery?: number;
44
+ liveCount?: number;
45
+ };
46
+ }>;
47
+ bidders?: Array<{
48
+ name: string;
49
+ params?: Array<{
50
+ paramName?: string;
51
+ paramType?: string;
52
+ paramValue?: string;
53
+ }>;
54
+ }>;
55
+ adsRequireInteraction?: boolean;
56
+ }
57
+ /**
58
+ * Interface defining the configuration options for the VP Player.
59
+ *
60
+ * @interface
61
+ * @see {@link https://vp.gjirafa.tech/documentation/docs/web-player/setup-the-player/configuration}
62
+ * @see {@link https://vp.gjirafa.tech/documentation/docs/web-player/setup-the-player/playing}
63
+ * @see {@link https://vp.gjirafa.tech/documentation/docs/web-player/setup-the-player/advertising}
64
+ * @see {@link https://vp.gjirafa.tech/documentation/docs/web-player/setup-the-player/styling}
65
+ * @see {@link https://vp.gjirafa.tech/documentation/docs/web-player/setup-the-player/localization}
66
+ * @see {@link https://vp.gjirafa.tech/documentation/docs/web-player/setup-the-player/full-configuration}
67
+ */
68
+ export interface VPPlayerConfig {
69
+ projectId?: string;
70
+ video: {
71
+ ads?: VPPlayerAdsConfig;
72
+ advertising?: boolean;
73
+ file?: string;
74
+ title?: string;
75
+ description?: string;
76
+ publishDate?: string;
77
+ duration?: number;
78
+ thumbnail?: string;
79
+ filmstrip?: string;
80
+ author?: string;
81
+ source?: string;
82
+ tags?: string[];
83
+ tracks?: Array<{
84
+ file: string;
85
+ label: string;
86
+ kind: string;
87
+ default?: boolean;
88
+ }>;
89
+ playlist?: {
90
+ state: boolean;
91
+ playlistVideoIndex: number;
92
+ videos: Array<{
93
+ videoId: string;
94
+ title: string;
95
+ thumbnailUrl?: string;
96
+ duration?: number;
97
+ file?: string;
98
+ }>;
99
+ };
100
+ };
101
+ config: {
102
+ adAnnouncement?: {
103
+ state?: boolean;
104
+ timeBeforeAd?: number;
105
+ };
106
+ autostartOnLoad?: {
107
+ state?: boolean;
108
+ onMobile?: boolean;
109
+ onData?: boolean;
110
+ };
111
+ adsRequireInteraction?: boolean;
112
+ autoplay?: boolean;
113
+ pauseOtherVideos?: boolean;
114
+ focusOnAutostart?: boolean;
115
+ muted?: boolean;
116
+ loop?: boolean;
117
+ size?: {
118
+ sizeType?: string;
119
+ aspectRatio?: string;
120
+ width?: number | string;
121
+ height?: number | string;
122
+ };
123
+ showRelatedOnPause?: {
124
+ state?: boolean;
125
+ onMobile?: boolean;
126
+ from?: number;
127
+ };
128
+ float?: {
129
+ state: boolean;
130
+ onMobile: boolean;
131
+ position: string;
132
+ dismissible: boolean;
133
+ requiresInteraction: boolean;
134
+ toVideoThreshold: number;
135
+ toFloatThreshold: number;
136
+ style: {
137
+ width: number;
138
+ border: string;
139
+ };
140
+ };
141
+ controls?: {
142
+ theaterButton?: boolean;
143
+ settingsButton?: boolean;
144
+ chromecastButton?: boolean;
145
+ nextButton?: boolean;
146
+ fullscreenButton?: boolean;
147
+ airplayButton?: boolean;
148
+ bigPlayButton?: boolean;
149
+ autopausePlayButton?: boolean;
150
+ pictureInPictureButton?: boolean;
151
+ relatedButton?: boolean;
152
+ volumeButton?: boolean;
153
+ shareButton?: boolean;
154
+ subtitlesButton?: boolean;
155
+ showCaptions?: boolean;
156
+ };
157
+ logo?: {
158
+ state?: boolean;
159
+ file?: string;
160
+ position?: string;
161
+ defaultOpacity?: number;
162
+ inactiveOpacity?: number;
163
+ onClickURL?: string;
164
+ };
165
+ skin?: {
166
+ controlBar?: {
167
+ background?: string;
168
+ spread?: "solid" | "gradient";
169
+ gradientMidPoint?: number;
170
+ text?: string;
171
+ icons?: {
172
+ default?: string;
173
+ hover?: string;
174
+ };
175
+ timeslider?: {
176
+ progress?: string;
177
+ rail?: string;
178
+ buffer?: string;
179
+ dragger?: string;
180
+ };
181
+ timesliderOnAd?: {
182
+ progress?: string;
183
+ rail?: string;
184
+ buffer?: string;
185
+ dragger?: string;
186
+ };
187
+ volume?: {
188
+ dragger?: string;
189
+ progress?: string;
190
+ rail?: string;
191
+ notifier?: string;
192
+ };
193
+ };
194
+ menus?: {
195
+ background?: {
196
+ default?: string;
197
+ hover?: string;
198
+ };
199
+ links?: {
200
+ default?: string;
201
+ hover?: string;
202
+ };
203
+ autoplay?: {
204
+ autoplayOn?: string;
205
+ autoplayOff?: string;
206
+ };
207
+ };
208
+ nextVideo?: {
209
+ background?: string;
210
+ text?: string;
211
+ timeslider?: {
212
+ rail?: string;
213
+ progress?: string;
214
+ };
215
+ icons?: {
216
+ play?: {
217
+ default?: string;
218
+ hover?: string;
219
+ };
220
+ close?: string;
221
+ };
222
+ };
223
+ playlist?: {
224
+ background?: string;
225
+ text?: string;
226
+ icons?: {
227
+ arrows?: {
228
+ active?: string;
229
+ inactive?: string;
230
+ };
231
+ close?: string;
232
+ };
233
+ card?: {
234
+ background?: string;
235
+ title?: string;
236
+ duration?: {
237
+ text?: string;
238
+ background?: string;
239
+ };
240
+ icons?: {
241
+ play?: {
242
+ default?: string;
243
+ hover?: string;
244
+ };
245
+ };
246
+ };
247
+ };
248
+ };
249
+ lang?: {
250
+ locale?: string;
251
+ controls?: {
252
+ play?: string;
253
+ pause?: string;
254
+ next?: string;
255
+ replay?: string;
256
+ volume?: string;
257
+ mute?: string;
258
+ unmute?: string;
259
+ settings?: string;
260
+ theater?: string;
261
+ fullscreen?: string;
262
+ chromecast?: string;
263
+ airplay?: string;
264
+ pictureInPicture?: string;
265
+ related?: string;
266
+ skipIntro?: string;
267
+ skipAd?: string;
268
+ playlistTitle?: string;
269
+ upNext?: string;
270
+ live?: string;
271
+ continueAfterPause?: string;
272
+ };
273
+ settings?: {
274
+ quality?: string;
275
+ subtitles?: string;
276
+ autoplay?: string;
277
+ playbackRate?: string;
278
+ auto?: string;
279
+ off?: string;
280
+ normal?: string;
281
+ share?: string;
282
+ };
283
+ ads?: {
284
+ ad?: string;
285
+ skip?: string;
286
+ skipIn?: string;
287
+ visit?: string;
288
+ info?: string;
289
+ simultaneousAds?: string;
290
+ adAnnouncement?: string;
291
+ };
292
+ messages?: {
293
+ playbackErrorTitle?: string;
294
+ playbackErrorDescription?: string;
295
+ geoBlockedTitle?: string;
296
+ geoBlockedDescription?: string;
297
+ streamInterruptedTitle?: string;
298
+ streamInterruptedDescription?: string;
299
+ };
300
+ };
301
+ ads?: VPPlayerAdsConfig;
302
+ };
303
+ }
304
+ /**
305
+ * Default configuration object for the VP Player.
306
+ *
307
+ * @constant
308
+ * @type {VPPlayerConfig}
309
+ * @see {@link https://vp.gjirafa.tech/documentation/docs/web-player/setup-the-player/configuration}
310
+ */
311
+ export declare const defaultVPPlayerConfig: VPPlayerConfig;
@@ -0,0 +1,3 @@
1
+ export * from "./props";
2
+ export * from "./instance";
3
+ export * from "./config";
@@ -0,0 +1,73 @@
1
+ import { VPPlayerConfig } from "./config";
2
+ /**
3
+ * Interface representing an instance of the VP Player.
4
+ * Based on VP Player API Reference: https://vp.gjirafa.tech/documentation/docs/web-player/api-reference
5
+ * And VP Vertical Player API Reference: https://vp.gjirafa.tech/documentation/docs/vertical-player/api-reference
6
+ *
7
+ * @interface
8
+ */
9
+ export interface VPPlayerInstance {
10
+ setup: (config: VPPlayerConfig) => void;
11
+ destroy?: () => void;
12
+ play?: () => void;
13
+ pause?: () => void;
14
+ forward?: () => void;
15
+ rewind?: () => void;
16
+ replay?: () => void;
17
+ seek?: (position: number) => void;
18
+ mute?: () => void;
19
+ unmute?: () => void;
20
+ enterFullScreen?: () => void;
21
+ exitFullScreen?: () => void;
22
+ enterFullscreen?: () => void;
23
+ exitFullscreen?: () => void;
24
+ enterPictureInPicture?: () => void;
25
+ exitPictureInPicture?: () => void;
26
+ floating?: () => void;
27
+ isFloating?: () => boolean;
28
+ getFloatStyle?: () => unknown;
29
+ setFloatingHlsLevels?: (levels: unknown) => void;
30
+ floatingStateCounter?: number;
31
+ nextVideo?: () => void;
32
+ previousVideo?: () => void;
33
+ switchToIndex?: (index: number) => void;
34
+ switch?: (video: unknown) => void;
35
+ playNewVideo?: (video: unknown) => void;
36
+ togglePlay?: () => void;
37
+ toggleMute?: () => void;
38
+ isMuted?: () => boolean;
39
+ isPlaying?: () => boolean;
40
+ isPaused?: () => boolean;
41
+ isFullscreen?: () => boolean;
42
+ isEnded?: () => boolean;
43
+ isFocused?: () => boolean;
44
+ getPosition?: () => number;
45
+ getBuffered?: () => number;
46
+ getVolume?: () => number;
47
+ getContainer?: () => HTMLElement;
48
+ getDuration?: () => number;
49
+ getQualityLevels?: () => unknown[];
50
+ getCurrentQuality?: () => number;
51
+ checkViewability?: () => boolean;
52
+ setConfig?: (config: unknown) => void;
53
+ setVideo?: (video: unknown) => void;
54
+ setPlaylist?: (playlist: unknown) => void;
55
+ setVolume?: (volume: number) => void;
56
+ setCurrentQuality?: (index: number) => void;
57
+ setLevelToAuto?: () => void;
58
+ setCuePoint?: (cue: number, callback: () => void) => void;
59
+ on?: (event: string, callback: (data?: unknown) => void) => void;
60
+ off?: (event: string, callback?: (data?: unknown) => void) => void;
61
+ videoIndex?: number;
62
+ playlist?: {
63
+ state: boolean;
64
+ playlistId: string;
65
+ playlistVideoIndex: number;
66
+ videos: unknown[];
67
+ };
68
+ multipleVideos?: Map<number, unknown>;
69
+ firstInList?: boolean;
70
+ lastInList?: boolean;
71
+ setupComplete?: boolean;
72
+ initialized?: boolean;
73
+ }
@@ -0,0 +1,54 @@
1
+ import { VPPlayerConfig } from "./config";
2
+ /**
3
+ * Interface defining the parameters for configuring the VP Player instance.
4
+ *
5
+ * @interface
6
+ */
7
+ export interface PlayerParams {
8
+ playerId?: string;
9
+ videoId?: string;
10
+ projectId?: string;
11
+ videoUrl?: string;
12
+ playlistId?: string;
13
+ scriptUrl?: string;
14
+ version?: string | null;
15
+ config?: Partial<VPPlayerConfig>;
16
+ thumbnailUrl?: string;
17
+ isReels?: boolean;
18
+ hiddenClasses?: string[];
19
+ apiKey?: string;
20
+ className?: string;
21
+ }
22
+ /**
23
+ * Interface for the VP Player context, providing methods and state for controlling the player.
24
+ *
25
+ * @interface
26
+ */
27
+ export interface VPPlayerContextType {
28
+ showPlayer: (params: PlayerParams) => void;
29
+ hidePlayer: () => void;
30
+ isPlayerVisible: boolean;
31
+ playerParams: PlayerParams | null;
32
+ }
33
+ /**
34
+ * Interface defining the properties for the VP Player component.
35
+ *
36
+ * @interface
37
+ */
38
+ export interface VPPlayerProps {
39
+ playerId: string;
40
+ videoId?: string;
41
+ projectId?: string;
42
+ videoUrl?: string;
43
+ playlistId?: string;
44
+ scriptUrl?: string;
45
+ version?: string | null;
46
+ config?: Partial<VPPlayerConfig>;
47
+ isReels?: boolean;
48
+ thumbnailUrl?: string;
49
+ onClose?: () => void;
50
+ hiddenClasses?: string[];
51
+ apiKey?: string;
52
+ isPlayerVisible?: boolean;
53
+ className?: string;
54
+ }
package/dist/main.d.ts ADDED
@@ -0,0 +1 @@
1
+ import "./index.css";