@playkit-js/transcript 3.5.30-canary.0-bdae263 → 3.5.30-canary.0-e5c3d3a

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@playkit-js/transcript",
-  "version": "3.5.30-canary.0-bdae263",
+  "version": "3.5.30-canary.0-e5c3d3a",
   "main": "dist/playkit-transcript.js",
   "license": "AGPL-3.0",
   "private": false,

package/src/components/search/search.tsx

@@ -1,11 +1,12 @@
 import {h, Component} from 'preact';
 import {InputField} from '@playkit-js/common/dist/components/input-field';
-import {core} from '@playkit-js/kaltura-player-js';
+import {core, ui} from '@playkit-js/kaltura-player-js';
 
 const {Utils} = core;
 const {withEventManager} = KalturaPlayer.ui.Event;
 const {TAB} = KalturaPlayer.ui.utils.KeyMap;
 const {withText, Text} = KalturaPlayer.ui.preacti18n;
+const {withPlayer} = ui.Components;
 
 const translates = ({activeSearchIndex, totalSearchResults}: SearchProps) => ({
   searchLabel: <Text id="transcript.search">Search in Transcript</Text>,
@@ -41,19 +42,23 @@ export interface SearchProps {
   searchResultsLabel?: string;
   eventManager?: any
   focusPluginButton: () => void;
+  player?: any;
 }
 
+@withPlayer
 @withEventManager
 class SearchComponent extends Component<SearchProps> {
   private _inputField: InputField | null = null;
 
   constructor(props: SearchProps) {
     super(props);
-    this.props.eventManager?.listen(document, 'keydown', this.handleKeydownEvent);
+    this.props.eventManager?.listen(this.props.player, this.props.player.Event.FIRST_PLAY, () => {
+      this.props.eventManager?.listen(document, 'keydown', this.handleKeydownEvent);
+    })
   }
 
   private handleKeydownEvent = (event: KeyboardEvent) => {
-    if (event.keyCode === TAB && event.shiftKey && this._inputField?.base?.contains(document.activeElement)){
+    if (event.keyCode === TAB && event.shiftKey && document.activeElement === this._inputField?.base?.childNodes[0]){
       event.preventDefault();
       this.props.focusPluginButton();
     }