From 8206d082ce1a35ce01d24a61202ff4047c348138 Mon Sep 17 00:00:00 2001
From: ThinLiquid <thnlqd@gmail.com>
Date: Sun, 21 Jan 2024 01:31:43 +0000
Subject: [PATCH] added `prepend`, `prependTo`, and `prependMany`

---
 src/html.ts | 43 +++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 43 insertions(+)

diff --git a/src/html.ts b/src/html.ts
index 3931a0e..588ba38 100644
--- a/src/html.ts
+++ b/src/html.ts
@@ -172,6 +172,21 @@ export default class Html {
     }
     return this;
   }
+  /**
+   * Append this element to another element. Uses `appendChild()` on the parent.
+   * @param parent Element to append to. HTMLElement, Html, and string (as querySelector) are supported.
+   * @returns Html
+   */
+  prependTo(parent: HTMLElement | Html | string): Html {
+    if (parent instanceof HTMLElement) {
+      parent.prepend(this.elm);
+    } else if (parent instanceof Html) {
+      parent.elm.prepend(this.elm);
+    } else if (typeof parent === "string") {
+      document.querySelector(parent)?.prepend(this.elm);
+    }
+    return this;
+  }
   /**
    * Append an element. Typically used as a `.append(new Html(...))` call.
    * @param elem The element to append.
@@ -189,6 +204,23 @@ export default class Html {
     }
     return this;
   }
+  /**
+   * Prepend an element. Typically used as a `.prepend(new Html(...))` call.
+   * @param elem The element to prepend.
+   * @returns Html
+   */
+  prepend(elem: string | HTMLElement | Html): Html {
+    if (elem instanceof HTMLElement) {
+      this.elm.prepend(elem);
+    } else if (elem instanceof Html) {
+      this.elm.prepend(elem.elm);
+    } else if (typeof elem === "string") {
+      const newElem = document.createElement(elem);
+      this.elm.prepend(newElem);
+      return new Html(newElem.tagName);
+    }
+    return this;
+  }
   /**
    * Append multiple elements. Typically used as a `.appendMany(new Html(...), new Html(...)` call.
    * @param elements The elements to append.
@@ -200,6 +232,17 @@ export default class Html {
     }
     return this;
   }
+  /**
+   * Prepend multiple elements. Typically used as a `.prependMany(new Html(...), new Html(...)` call.
+   * @param elements The elements to prepend.
+   * @returns Html
+   */
+  prependMany(...elements: any[]): Html {
+    for (const elem of elements) {
+      this.prepend(elem);
+    }
+    return this;
+  }
   /**
    * Clear the innerHTML of the element.
    * @returns Html