Feat(Core): Audio support

Implements support for the `<audio>` tag using the `Goatee.Audio()` class.

Author: codegoat-dev

CHANGELOG.md

@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.2.6] - 2025-04-09
+
+### Added
+
+- Adds support for the "<audio>" tag using the "Goatee.Audio()" class.
+
 ## [0.2.5] - 2025-04-09
 
 ### Fixed

src/Goatee.js

@@ -12,6 +12,7 @@ import { Script } from "./core/Script.js";
 import { Head } from "./core/Head.js";
 import { Body } from "./core/Body.js";
 import { Image } from "./core/Image.js";
+import { Audio } from "./core/Audio.js";
 import { Heading } from "./core/Heading.js";
 import { Separator } from "./core/Separator.js";
 import { Text } from "./core/Text.js";
@@ -36,6 +37,7 @@ export class Goatee {
     this.Head = Head;
     this.Body = Body;
     this.Image = Image;
+    this.Audio = Audio;
     this.Heading = Heading;
     this.Separator = Separator;
     this.Text = Text;

src/core/Audio.js

@@ -0,0 +1,41 @@
+import { Element } from "./Element.js";
+
+export class Audio extends Element {
+  constructor({
+    src,
+    type = null,
+    controls = true,
+    autoplay = false,
+    loop = false,
+    muted = false,
+    preload = "metadata",
+    sources = null // Optional array of { src, type }
+  }) {
+    super();
+    this.src = src;
+    this.type = type;
+    this.controls = controls;
+    this.autoplay = autoplay;
+    this.loop = loop;
+    this.muted = muted;
+    this.preload = preload;
+    this.sources = sources;
+  }
+
+  render() {
+    let attrs = `preload="${this.preload}"`;
+    if (this.controls) attrs += ` controls`;
+    if (this.autoplay) attrs += ` autoplay`;
+    if (this.loop) attrs += ` loop`;
+    if (this.muted) attrs += ` muted`;
+
+    if (this.sources && Array.isArray(this.sources)) {
+      const sourceTags = this.sources
+        .map(src => `<source src="${src.src}"${src.type ? ` type="${src.type}"` : ""}>`)
+        .join("\n");
+      return `<audio ${attrs}>\n${sourceTags}\n</audio>`;
+    }
+
+    return `<audio src="${this.src}"${this.type ? ` type="${this.type}"` : ""} ${attrs}></audio>`;
+  }
+}