feat(packages): add mux-audio element and react component (#1259)

packages/html/src/cdn/media/mux-audio.ts

@@ -0,0 +1 @@
+import '../../define/media/mux-audio';

packages/html/src/define/media/mux-audio.ts

@@ -0,0 +1,14 @@
+import { MuxAudio } from '../../media/mux-audio';
+import { safeDefine } from '../safe-define';
+
+export class MuxAudioElement extends MuxAudio {
+  static readonly tagName = 'mux-audio';
+}
+
+safeDefine(MuxAudioElement);
+
+declare global {
+  interface HTMLElementTagNameMap {
+    [MuxAudioElement.tagName]: MuxAudioElement;
+  }
+}

packages/html/src/media/mux-audio/index.ts

@@ -0,0 +1,18 @@
+import { MuxCustomAudio, MuxMediaDelegate } from '@videojs/core/dom/media/mux';
+import { MediaAttachMixin } from '../../store/media-attach-mixin';
+import { MediaPropsMixin } from '../../utils/media-props-mixin';
+
+export class MuxAudio extends MediaPropsMixin(MediaAttachMixin(MuxCustomAudio), MuxMediaDelegate) {
+  constructor() {
+    super();
+    this.attach(this.target);
+  }
+
+  disconnectedCallback(): void {
+    super.disconnectedCallback?.();
+
+    if (!this.hasAttribute('keep-alive')) {
+      this.destroy();
+    }
+  }
+}