From 05b9dd9e427b3447705320665d352b6e244ae11f Mon Sep 17 00:00:00 2001
From: Liam Potter <radioactivity@gmail.com>
Date: Fri, 21 Jul 2023 14:18:40 +0100
Subject: [PATCH 1/2] Let Hls.js initialize then wait 1 tick for other
 attributes. (#34)

---
 hls-video-element.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/hls-video-element.js b/hls-video-element.js
index f6021fd..361884b 100644
--- a/hls-video-element.js
+++ b/hls-video-element.js
@@ -28,8 +28,7 @@ class HLSVideoElement extends CustomVideoElement {
       return;
     }
 
-    // Wait 1 tick to allow other attributes to be set.
-    await Promise.resolve();
+  
 
     if (Hls.isSupported()) {
 
@@ -38,8 +37,10 @@ class HLSVideoElement extends CustomVideoElement {
         liveDurationInfinity: true
       });
 
-      // Set up preload
+      // Wait 1 tick to allow other attributes to be set.
+      await Promise.resolve();
 
+      // Set up preload
       switch (this.nativeEl.preload) {
         case 'none': {
           // when preload is none, load the source on first play

From da8ab55daaaf1ce4d66a680964de6420bc3a470b Mon Sep 17 00:00:00 2001
From: Liam Potter <liam@liampotter.co.uk>
Date: Fri, 21 Jul 2023 15:19:53 +0100
Subject: [PATCH 2/2] Add Types (#33)

* Added types

* use native js private method to type destroy
---
 hls-video-element.d.ts | 32 ++++++++++++++++++++++++++++++++
 package.json           |  1 +
 2 files changed, 33 insertions(+)
 create mode 100644 hls-video-element.d.ts

diff --git a/hls-video-element.d.ts b/hls-video-element.d.ts
new file mode 100644
index 0000000..fa082ad
--- /dev/null
+++ b/hls-video-element.d.ts
@@ -0,0 +1,32 @@
+import { CustomVideoElement } from 'custom-media-element';
+import Hls from 'hls.js';
+
+declare class HLSVideoElement extends CustomVideoElement {
+  /**
+   * The current instance of the HLS.js library.
+   *
+   * @example
+   * ```js
+   * const video = document.querySelector('hls-video');
+   * video.api.on(Hls.Events.MANIFEST_PARSED, () => {});
+   * ```
+   */
+  api: Hls | null;
+
+  /**
+   * Fires when attributes are changed on the custom element.
+   */
+  attributeChangedCallback(attrName: string, oldValue: any, newValue: any): void;
+
+  /**
+   * Loads the HLS.js instance and attach it to the video element.
+   */
+  load(): Promise<void>;
+
+  /**
+   * Unloads the HLS.js instance and detaches it from the video element.
+   */
+  #destroy(): void;
+}
+
+export default HLSVideoElement;
diff --git a/package.json b/package.json
index b3c3d38..c401cd7 100644
--- a/package.json
+++ b/package.json
@@ -4,6 +4,7 @@
   "description": "Custom element (web component) for playing video using the HTTP Live Streaming (HLS) format. Uses HLS.js.",
   "type": "module",
   "main": "hls-video-element.js",
+  "types": "hls-video-element.d.ts",
   "files": [],
   "scripts": {
     "lint": "npx eslint *.js -c ./node_modules/wet-run/.eslintrc.json",