@playkit-js/transcript 3.5.22 → 3.5.23-canary.0-f10827a

package/package.json

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

package/src/components/attach-placeholder/attach-placeholder.tsx

@@ -22,10 +22,10 @@ export const AttachPlaceholder = ({onAttach, onClose}: AttachPlaceholderProps) =
       </div>
       <div className={styles.attachContent}>
         <div className={styles.attachText}>
-          <Text id="transcript.attachTranscriptText">Transcript popped out</Text>
+          <Text id="transcript.attach_transcript_text">Transcript popped out</Text>
         </div>
         <Button type={ButtonType.primary} size={ButtonSize.medium} className={styles.attachButton} onClick={onAttach} testId="transcriptAttachButton">
-          <Text id="transcript.attachTranscriptButton">Bring it back</Text>
+          <Text id="transcript.attach_transcript_button">Bring it back</Text>
         </Button>
       </div>
     </div>

package/src/components/caption/caption.tsx

@@ -4,12 +4,15 @@ import {secondsToTime} from '../../utils';
 import {CuePointData} from '../../types';
 import * as styles from './caption.scss';
 
+const {withText, Text} = KalturaPlayer.ui.preacti18n;
+
 export interface CaptionProps {
   showTime: boolean;
   searchLength: number;
   scrollTo(el: HTMLElement): void;
   scrollToSearchMatch(el: HTMLElement): void;
   videoDuration: number;
+  captionLabel?: string;
 }
 
 interface ExtendedCaptionProps extends CaptionProps {
@@ -24,6 +27,11 @@ interface ExtendedCaptionProps extends CaptionProps {
   isAutoScrollEnabled: boolean;
 }
 
+const translates = {
+  captionLabel: <Text id="transcript.caption_label">Jump to this point in video</Text>
+};
+
+@withText(translates)
 export class Caption extends Component<ExtendedCaptionProps> {
   private _hotspotRef: HTMLElement | null = null;
 
@@ -107,7 +115,7 @@ export class Caption extends Component<ExtendedCaptionProps> {
     const captionA11yProps: Record<string, any> = {
       ariaCurrent: isHighlighted,
       tabIndex: 0,
-      ariaLabel: `${time}${showTime ? ' ' : ''}${caption.text}`,
+      ariaLabel: `${time}${showTime ? ' ' : ''}${caption.text} ${this.props.captionLabel}`,
       role: 'button'
     };
 

package/src/components/transcript/transcript.tsx

@@ -28,7 +28,7 @@ const translates = {
   errorTitle: <Text id="transcript.whoops">Whoops!</Text>,
   errorDescripton: <Text id="transcript.load_failed">Failed to load transcript</Text>,
   attachTranscript: <Text id="transcript.attach_transcript">Bring Transcript back</Text>,
-  detachTranscript: <Text id="transcript.detach_transcript">Popout Transcript</Text>
+  detachTranscript: <Text id="transcript.detach_transcript">Popout transcript</Text>
 };
 
 export interface TranscriptProps {

package/translations/en.i18n.json

@@ -17,11 +17,12 @@
       "skip_transcript": "Skip transcript",
       "smallScreenText": "To see the transcript, go to full screen",
       "smallScreenMobileText": "To see the transcript, rotate the phone",
-      "attachTranscriptText": "Transcript popped out",
-      "attachTranscriptButton": "Bring it back",
-      "attachTranscript": "Bring Transcript back",
-      "detachTranscript": "Popout Transcript",
-      "transcript": "Transcript"
+      "attach_transcript_text": "Transcript popped out",
+      "attach_transcript_button": "Bring it back",
+      "attach_transcript": "Bring Transcript back",
+      "detach_transcript": "Popout transcript",
+      "transcript": "Transcript",
+      "caption_label": "Jump to this point in video"
     }
   }
 }