@vouchfor/embeds 2.0.18 → 3.0.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vouchfor/embeds",
-  "version": "2.0.18",
+  "version": "3.0.0",
   "license": "MIT",
   "author": "Aaron Williams",
   "main": "dist/es/embeds.js",
@@ -46,8 +46,8 @@
   "dependencies": {
     "@a11y/focus-trap": "^1.0.5",
     "@lit/task": "^1.0.0",
-    "@vouchfor/canvas-video": "^8.0.4",
-    "@vouchfor/media-player": "^3.0.18",
+    "@vouchfor/canvas-video": "^8.2.0",
+    "@vouchfor/media-player": "^4.0.0",
     "uuid": "^9.0.1"
   },
   "peerDependencies": {
@@ -66,7 +66,7 @@
     "@types/mocha": "^10.0.6",
     "@vouchfor/eslint-config": "^1.0.1",
     "@vouchfor/prettier-config": "^1.0.1",
-    "@vouchfor/video-utils": "^1.0.9",
+    "@vouchfor/video-utils": "^1.2.0",
     "@web/dev-server-esbuild": "^1.0.2",
     "@web/test-runner": "^0.18.1",
     "@web/test-runner-browserstack": "^0.7.1",

package/src/components/PlayerEmbed/index.ts

@@ -5,6 +5,7 @@ import { createRef, ref } from 'lit/directives/ref.js';
 
 import type { Scene, Scenes, TemplateInstance } from '@vouchfor/canvas-video';
 import type { MediaPlayer, MediaPlayerProps } from '@vouchfor/media-player';
+import type { PropertyValueMap } from 'lit';
 import type { Environment } from '~/utils/env';
 
 import { EventForwardController } from './controllers/event-forwarder';
@@ -64,10 +65,12 @@ class PlayerEmbed extends LitElement {
     'playing',
     'ratechange',
     'scenechange',
+    'scenesupdate',
     'seeking',
     'seeked',
     'timeupdate',
     'volumechange',
+    'processing',
     'waiting',
 
     'video:loadeddata',
@@ -220,6 +223,13 @@ class PlayerEmbed extends LitElement {
     return null;
   }
 
+  protected willUpdate(changedProperties: PropertyValueMap<PlayerEmbedProps>) {
+    // If the vouch this embed is pointing to changes then reset the player
+    if (changedProperties.has('vouchId') && this.vouchId !== changedProperties.get('vouchId')) {
+      this.reset(0, false);
+    }
+  }
+
   render() {
     return html`
       ${this._renderStyles()}