export more public APIs to customize UI

src/Controller.svelte

@@ -31,6 +31,9 @@
   }
   let timer: number | null = null;
   let playerState: 'playing' | 'paused' | 'live';
+  $: {
+    dispatch('ui-update-player-state', { payload: playerState });
+  }
   let speedState: 'normal' | 'skipping';
   let progress: HTMLElement;
   let step: HTMLElement;

src/Player.svelte

@@ -73,6 +73,7 @@
     switch (event) {
       case 'ui-update-current-time':
       case 'ui-update-progress':
+      case 'ui-update-player-state':
         controller.$on(event, ({ detail }) => handler(detail));
       default:
         break;
@@ -82,6 +83,8 @@
   export const addEvent = (event: eventWithTime) => {
     replayer.addEvent(event);
   };
+  export const getMetaData = () => replayer.getMetaData();
+  export const getReplayer = () => replayer;
 
   // by pass controller methods as public API
   export const toggle = () => {