v1.2.3

patelka2211 · Jul 5, 2023 · b01bfb4 · b01bfb4
1 parent 231fbbe
commit b01bfb4
Show file tree

Hide file tree

Showing 27 changed files with 316 additions and 253 deletions.
diff --git a/Dominar.js b/Dominar.js
diff --git a/README.md b/README.md
@@ -13,22 +13,22 @@ Visit [https://patelka2211.github.io/dominar/](https://patelka2211.github.io/dom
 ## Installation
 
 [![npm (scoped)](https://img.shields.io/npm/v/@patelka2211/dominar)](https://www.npmjs.com/package/@patelka2211/dominar)
-[![npm bundle size (scoped)](https://img.shields.io/bundlephobia/min/@patelka2211/dominar)](https://bundlephobia.com/package/@patelka2211/[email protected].2)
+[![npm bundle size (scoped)](https://img.shields.io/bundlephobia/min/@patelka2211/dominar)](https://bundlephobia.com/package/@patelka2211/[email protected].3)
 [![npm](https://img.shields.io/npm/dy/@patelka2211/dominar)](https://www.npmjs.com/package/@patelka2211/dominar)
-[![jsDelivr hits (npm scoped)](https://img.shields.io/jsdelivr/gh/hy/patelka2211/dominar)](https://cdn.jsdelivr.net/gh/patelka2211/[email protected].2/)
+[![jsDelivr hits (npm scoped)](https://img.shields.io/jsdelivr/gh/hy/patelka2211/dominar)](https://cdn.jsdelivr.net/gh/patelka2211/[email protected].3/)
 
 To install Dominar using npm, run the following command:
 
 ```sh
 npm i @patelka2211/dominar
 ```
 
-Alternatively, you can include [Dominar's IIFE file](https://cdn.jsdelivr.net/gh/patelka2211/[email protected].2/Dominar.js) in your website using a `<script>` tag:
+Alternatively, you can include [Dominar's IIFE file](https://cdn.jsdelivr.net/gh/patelka2211/[email protected].3/Dominar.js) in your website using a `<script>` tag:
 
 ```html
 <script
     async
-    src="https://cdn.jsdelivr.net/gh/patelka2211/[email protected].2/Dominar.js"
+    src="https://cdn.jsdelivr.net/gh/patelka2211/[email protected].3/Dominar.js"
 ></script>
 ```
 
@@ -91,12 +91,12 @@ addEventListeners(document.body, {
 
 ### When included as a `<script>` tag in a website.
 
-If the script tag is not already included in the `<head>` tag, please add the following script tag to include [Dominar's IIFE JavaScript](https://cdn.jsdelivr.net/gh/patelka2211/[email protected].2/Dominar.js) file.
+If the script tag is not already included in the `<head>` tag, please add the following script tag to include [Dominar's IIFE JavaScript](https://cdn.jsdelivr.net/gh/patelka2211/[email protected].3/Dominar.js) file.
 
 ```html
 <script
     async
-    src="https://cdn.jsdelivr.net/gh/patelka2211/[email protected].2/Dominar.js"
+    src="https://cdn.jsdelivr.net/gh/patelka2211/[email protected].3/Dominar.js"
 ></script>
 ```
 

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@patelka2211/dominar",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "description": "Dominar is a powerful library designed to make it easy for developers to manipulate the Document Object Model (DOM) and create dynamic HTML content. Dominar empowers you to take control of your web development projects like a pro. Unleash the power to dominate the DOM with Dominar.",
   "main": "index.js",
   "module": "index.js",
@@ -9,7 +9,7 @@
     "tsc-build": "tsc -p ./tsconfig.json",
     "rollup-esm": "rollup -c --environment format:esm",
     "rollup-iife": "rollup -c --environment format:iife",
-    "terser-esm": "terser ./index.js -c -m -o ./index.js",
+    "terser-esm": "terser ./index.js -c -m --toplevel -o ./index.js",
     "terser-iife": "terser ./Dominar.js -c -m -o ./Dominar.js",
     "build": "npm run tsc-build && npm run rollup-esm && npm run rollup-iife && npm run terser-esm && npm run terser-iife && rm -rf ./lib/",
     "test-build": "npm run tsc-build && npm run rollup-esm && tsc ./test/index.ts -t es6 && rollup ./test/index.js -o ./test/out.js && rm -rf ./lib/"

diff --git a/src/attributes.ts → src/attributes/setAttributes.ts b/src/attributes.ts → src/attributes/setAttributes.ts
@@ -1,12 +1,13 @@
-type DominarTagAttributes = { [attributeName: string]: string | number | true };
+import { DominarTagAttributes } from "./types";
+
 /**
  * Sets the attributes of an HTML element based on the provided object.
  *
  * @param {HTMLElement} element The HTML element to set the attributes on.
  * @param {Object} attributes An object containing the attribute names and values to set.
  * @returns {HTMLElement} The same HTML element with the updated attributes.
  */
-function setAttributes(
+export function setAttributes(
     element: HTMLElement,
     attributes: DominarTagAttributes
 ): HTMLElement {
@@ -26,5 +27,3 @@ function setAttributes(
     }
     return element;
 }
-
-export { DominarTagAttributes, setAttributes };
diff --git a/src/attributes/types.ts b/src/attributes/types.ts
@@ -0,0 +1,3 @@
+export type DominarTagAttributes = {
+    [attributeName: string]: string | number | true;
+};
diff --git a/src/children/insertChildren.ts b/src/children/insertChildren.ts
@@ -0,0 +1,42 @@
+import { isInstanceOfDominarTag } from "../tag/isInstanceOfDominarTag";
+import { isInstanceOfDominarTagList } from "../tagList/isInstanceOfDominarTagList";
+import { isInstanceOfParsedSVG } from "../svg-parser/isInstanceOfparsedSVG";
+import { parsedSVG } from "../svg-parser/parsedSVG";
+import { DominarTag } from "../tag/DominarTag";
+import { DominarTagChildren, childrenInsertType } from "../tag/types";
+import { DominarTagList } from "../tagList/DominarTagList";
+
+/**
+ * Inserts children into an HTML element.
+ * @param {HTMLElement} root The root HTML element where the children will be inserted.
+ * @param {DominarTagChildren} children The children to be inserted.
+ * @param {childrenInsertType} [insertType="append"] The type of insertion. Default is "append".
+ * @returns {HTMLElement} The modified root HTML element.
+ */
+export function insertChildren(
+    root: HTMLElement,
+    children: DominarTagChildren,
+    insertType: childrenInsertType = "append"
+): HTMLElement {
+    if (typeof children === "string" || typeof children === "number")
+        root[insertType](String(children));
+    else if (isInstanceOfDominarTag(children))
+        root[insertType]((children as DominarTag).renderedTag);
+    else if (isInstanceOfDominarTagList(children)) {
+        let renderedTagList = (children as DominarTagList).renderedTagList,
+            tagListLength = renderedTagList.length;
+        for (let index = 0; index < tagListLength; index++) {
+            root[insertType](
+                renderedTagList[
+                    insertType === "append" ? index : tagListLength - 1 - index
+                ]
+            );
+        }
+    } else if (
+        isInstanceOfParsedSVG(children) &&
+        (children as parsedSVG).svg !== null
+    )
+        root[insertType]((children as parsedSVG).svg as SVGSVGElement);
+    else if (children instanceof HTMLElement) root[insertType](children);
+    return root;
+}
diff --git a/src/eventListeners.ts b/src/eventListeners.ts
diff --git a/src/eventListeners/addEventListeners.ts b/src/eventListeners/addEventListeners.ts
@@ -0,0 +1,18 @@
+import { DominarTagEventListeners } from "./types";
+
+/**
+ * Adds the specified event listeners to an HTML element.
+ *
+ * @param {HTMLElement} element The HTML element to add event listeners to.
+ * @param {Object.<string, function>} eventListeners An object containing event listener functions keyed by event type.
+ * @returns {HTMLElement} The same HTML element with the added event listeners.
+ */
+export function addEventListeners(
+    element: HTMLElement,
+    eventListeners: DominarTagEventListeners
+): HTMLElement {
+    Object.entries(eventListeners).forEach(([type, listener]) => {
+        element.addEventListener(type, listener as (ev: Event) => void);
+    });
+    return element;
+}
diff --git a/src/eventListeners/removeEventListeners.ts b/src/eventListeners/removeEventListeners.ts
@@ -0,0 +1,18 @@
+import { DominarTagEventListeners } from "./types";
+
+/**
+ * Removes the specified event listeners from an HTML element.
+ *
+ * @param {HTMLElement} element The HTML element to remove event listeners from.
+ * @param {Object.<string, function>} eventListeners An object containing event listener functions keyed by event type.
+ * @returns {HTMLElement} The same HTML element with the added event listeners.
+ */
+export function removeEventListeners(
+    element: HTMLElement,
+    eventListeners: DominarTagEventListeners
+): HTMLElement {
+    Object.entries(eventListeners).forEach(([type, listener]) => {
+        element.removeEventListener(type, listener as (ev: Event) => void);
+    });
+    return element;
+}
diff --git a/src/eventListeners/types.ts b/src/eventListeners/types.ts
@@ -0,0 +1,3 @@
+export type DominarTagEventListeners = {
+    [K in keyof HTMLElementEventMap]?: (ev: HTMLElementEventMap[K]) => void;
+};
diff --git a/src/index.ts b/src/index.ts
@@ -1,5 +1,11 @@
-export { insertChildren, tag, tagList } from "./tags";
-export { render } from "./render";
-export { setAttributes } from "./attributes";
-export { addEventListeners, removeEventListeners } from "./eventListeners";
-export { SVGParser } from "./svgParser";
+export { setAttributes } from "./attributes/setAttributes";
+export { insertChildren } from "./children/insertChildren";
+export { addEventListeners } from "./eventListeners/addEventListeners";
+export { removeEventListeners } from "./eventListeners/removeEventListeners";
+export { isInstanceOfDominarTag } from "./tag/isInstanceOfDominarTag";
+export { isInstanceOfDominarTagList } from "./tagList/isInstanceOfDominarTagList";
+export { isInstanceOfParsedSVG } from "./svg-parser/isInstanceOfparsedSVG";
+export { render } from "./render/index";
+export { SVGParser } from "./svg-parser/index";
+export { tag } from "./tag/index";
+export { tagList } from "./tagList/index";
diff --git a/src/render.ts → src/render/index.ts b/src/render.ts → src/render/index.ts
@@ -1,8 +1,7 @@
-import { DominarTagChildren, insertChildren, childrenInsertType } from "./tags";
-type RenderOptions = {
-    clearBeforeRender?: boolean;
-    insertType?: childrenInsertType;
-};
+import { insertChildren } from "../children/insertChildren";
+import { DominarTagChildren } from "../tag/types";
+import { RenderOptions } from "./types";
+
 /**
  * Renders a DOM element or a list of elements to a specified HTML element.
  *
@@ -14,7 +13,7 @@ type RenderOptions = {
  * @returns {Promise<void>} A Promise that resolves when the rendering is complete.
  * @throws {Error} If the root parameter is null or undefined.
  */
-async function render(
+export async function render(
     root: HTMLElement,
     children: DominarTagChildren,
     options: RenderOptions = {
@@ -30,13 +29,11 @@ async function render(
         insertType = "append";
     }
 
-    if (insertType === undefined) insertType = "append";
+    if (!insertType) insertType = "append";
 
     if (insertType !== "append" && insertType !== "prepend")
         throw Error(
             `'insertType' in options can be 'append' or 'prepend' but not '${insertType}'.`
         );
     insertChildren(root, children, insertType);
 }
-
-export { render };
diff --git a/src/render/types.ts b/src/render/types.ts
@@ -0,0 +1,6 @@
+import { childrenInsertType } from "../tag/types";
+
+export type RenderOptions = {
+    clearBeforeRender?: boolean;
+    insertType?: childrenInsertType;
+};
diff --git a/src/svg-parser/index.ts b/src/svg-parser/index.ts
@@ -0,0 +1,13 @@
+import { parsedSVG } from "./parsedSVG";
+
+/**
+ * Parses an SVG string and returns a parsedSVG instance.
+ * @function
+ * @param {string} svgString The SVG string to be parsed.
+ * @returns {parsedSVG} The parsed SVG.
+ */
+export function SVGParser(svgString: string): parsedSVG {
+    return new parsedSVG(svgString);
+}
+
+// export { parsedSVG, SVGParser };