@devix-technologies/react-gjirafa-vp-player 1.0.31-beta.5 → 1.0.31-beta.8

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 (5) hide show
  1. package/README.md +33 -18
  2. package/dist/index.d.ts +550 -87
  3. package/dist/react-gjirafa-vp-player.es.js +913 -899
  4. package/dist/react-gjirafa-vp-player.umd.js +8 -8
  5. package/package.json +1 -1
package/README.md CHANGED
@@ -157,24 +157,39 @@ The player fills its container (100% width/height). Control sizing with a wrappe
157
157
 
158
158
  ### Event Callbacks
159
159
 
160
- | Prop | Description |
161
- |------|-------------|
162
- | `onReady` | Player initialized |
163
- | `onPlay` | Playback started |
164
- | `onPause` | Playback paused |
165
- | `onResume` | Playback resumed |
166
- | `onComplete` | Video completed |
167
- | `onError` | Error occurred |
168
- | `onVideoStarted` | Video metadata available |
169
- | `onTimeUpdate` | Continuous time updates |
170
- | `onQuartile25` | 25% watched |
171
- | `onQuartile50` | 50% watched |
172
- | `onQuartile75` | 75% watched |
173
- | `onNext` | Next video in playlist |
174
- | `onPrevious` | Previous video |
175
- | `onProgress10s` | Every 10 seconds |
176
- | `onProgress20s` | 20 second milestone |
177
- | `onClose` | Reels overlay closed |
160
+ | Prop | Horizontal | Vertical | Description |
161
+ |------|:----------:|:--------:|-------------|
162
+ | `onReady` | ✓ | ✓ | Player initialized |
163
+ | `onPlay` | ✓ | ✓ | Playback started |
164
+ | `onPause` | ✓ | ✓ | Playback paused |
165
+ | `onComplete` | ✓ | ✗ | Video completed (horizontal only) |
166
+ | `onError` | ✓ | ✓ | Error occurred |
167
+ | `onVideoStarted` | ✓ | ✓ | Video metadata available (returns `CurrentVideoData`) |
168
+ | `onTimeUpdate` | ✓ | ✓ | Continuous time updates (returns seconds) |
169
+ | `onQuartile25` | ✓ | ✓ | 25% watched |
170
+ | `onQuartile50` | ✓ | ✓ | 50% watched |
171
+ | `onQuartile75` | ✓ | ✓ | 75% watched |
172
+ | `onNext` | ✓ | ✓ | Next video in playlist |
173
+ | `onPrevious` | ✗ | ✓ | Previous video (vertical only) |
174
+ | `onProgress10s` | ✓ | ✓ | Every ~10 seconds (returns seconds) |
175
+ | `onProgress20s` | ✓ | ✓ | 20 second milestone (returns seconds) |
176
+ | `onClose` | - | - | Reels overlay closed |
177
+
178
+ #### Event Implementation Notes
179
+
180
+ **Horizontal Player** uses standard VP Player SDK events:
181
+ - `ready`, `play`, `pause`, `complete`, `video-started`, `video-state`, `time`, `playlistItem`, `error`
182
+ - Quartiles: `analytics-25%-completed`, `analytics-50%-completed`, `analytics-75%-completed`
183
+
184
+ **Vertical Player** uses VP Vertical Player SDK events (different naming):
185
+ - `vp-ready`, `playing`, `pause`, `vp-video-started`, `vp-video-state`, `vp-time`, `vp-video-switch`, `error`
186
+ - Quartiles: `analytics-25%-completed`, `analytics-50%-completed`, `analytics-75%-completed`
187
+ - Direction detection: Uses `player._switchDirection` property (via `queueMicrotask`) to differentiate `onNext` vs `onPrevious`
188
+
189
+ **Key Differences:**
190
+ - `onComplete` - Only available on horizontal player (vertical auto-advances)
191
+ - `onPrevious` - Only available on vertical player (horizontal has no direction detection)
192
+ - `onNext` on horizontal fires for ANY playlist change (next button, auto-advance after complete)
178
193
 
179
194
  ## URL Helpers
180
195