tool-shack 0.0.2 → 0.0.6

package/src/dom/addEventListener.ts

@@ -1,3 +1,10 @@
+/**
+ * Add event listener(s) to one or more Node elements
+ *
+ * @param element One or multiple Node element(s) to set listener(s) for
+ * @param listeners List of event types and related callback(s)
+ * @returns void
+ */
 export const addEventListener = (
   element: HTMLElement | HTMLElement[] | NodeListOf<HTMLElement> | HTMLCollectionOf<HTMLElement>,
   listeners: Record<string, EventListenerOrEventListenerObject | EventListenerOrEventListenerObject[]>

package/src/dom/appendAfter.ts

@@ -0,0 +1,9 @@
+/**
+ * Append given node after reference node in the DOM
+ *
+ * @param newNode New node element to be appended
+ * @param referenceNode Reference node element
+ * @returns Result of the action
+ */
+export const appendAfter = (newNode: HTMLElement, referenceNode: HTMLElement): boolean =>
+  !!referenceNode.parentElement?.insertBefore(newNode, referenceNode.nextSibling);

package/src/dom/appendBefore.ts

@@ -0,0 +1,9 @@
+/**
+ * Append given node before reference node in the DOM
+ *
+ * @param newNode New node element to be appended
+ * @param referenceNode Reference node element
+ * @returns Result of the action
+ */
+export const appendBefore = (newNode: HTMLElement, referenceNode: HTMLElement): boolean =>
+  !!referenceNode.parentElement?.insertBefore(newNode, referenceNode);

package/src/dom/createElement.ts

@@ -1,13 +1,28 @@
 import { IExtendingElementProps } from './interfaces/createElement';
 
-export const createElement = <T = HTMLElement> (tagName: string, props?: Partial<T> & IExtendingElementProps): T => {
+/**
+ * Method for creating Node element and assigning multiple parameters, event listeners & children in one method call
+ *
+ * @param tagName Node tag name
+ * @param props List of attributes, event listeners or/and children to assign to the newly created element
+ * @returns Resulting Node element
+ */
+export const createElement = <T = HTMLElement> (tagName: string, props?: Partial<Omit<T, 'children'>> & IExtendingElementProps): T => {
   const element: HTMLElement = document.createElement(tagName);
 
   if (props) {
     for (let key in props) {
-      if (key==='children') {
+      const value = (props as any)[key];
+
+      if (key === 'role') {
+        element.setAttribute(key, value);
+      } else if (key === 'aria') {
+        for (let ariaKey in props.aria!) {
+          element.setAttribute(`aria-${ariaKey}`, value[ariaKey]);
+        }
+      } else if (key === 'children') {
         props.children!.forEach((child: HTMLElement) => element.appendChild(child));
-      } else if (key==='listeners') {
+      } else if (key === 'listeners') {
         for (let eventName in props.listeners!) {
           const functionList = (
             props.listeners![eventName] instanceof Array ? props.listeners![eventName] : [props.listeners![eventName]]
@@ -16,7 +31,7 @@ export const createElement = <T = HTMLElement> (tagName: string, props?: Partial
           functionList.forEach((fn: EventListenerOrEventListenerObject) => element.addEventListener(eventName, fn));
         }
       } else {
-        (element as any)[key] = (props as any)[key];
+        (element as any)[key] = value;
       }
     }
   }

package/src/dom/fireEvent.ts

@@ -0,0 +1,8 @@
+/**
+ * Manually fire event on Node element
+ *
+ * @param element Node element on which should be fired event
+ * @param eventType Type name of event that should be fired
+ * @returns Result of the action
+ */
+export const fireEvent = (element: HTMLElement, eventType: string): boolean => element.dispatchEvent(new Event(eventType));

package/src/dom/index.ts

@@ -1,3 +1,8 @@
+export * from './interfaces';
+
 export * from './addAsyncEventListener';
 export * from './addEventListener';
+export * from './appendAfter';
+export * from './appendBefore';
 export * from './createElement';
+export * from './fireEvent';

package/src/dom/interfaces/createElement.ts

@@ -1,4 +1,10 @@
+export type TAriaLabelKey = 'atomic' | 'busy' | 'controls' | 'current' | 'describedby' | 'details' | 'disables' |
+  'dropeffect' | 'errormessage' | 'expanded' | 'flowto' | 'grabbed' | 'haspopup' | 'hidden' | 'invalid' |
+  'keyshortcuts' | 'label' | 'labelledby' | 'live' | 'modal' | 'owns' | 'relevant' | 'roledescription';
+
 export interface IExtendingElementProps {
   children?: HTMLElement[];
   listeners?: Record<string, EventListenerOrEventListenerObject | EventListenerOrEventListenerObject[]>;
+  role?: string;
+  aria?: Partial<Record<TAriaLabelKey, string>>;
 }

package/src/dom/interfaces/index.ts

@@ -0,0 +1 @@
+export * from './createElement';

package/src/index.ts

@@ -1,3 +1,5 @@
 export * from './browser';
+export * from './dateTime';
 export * from './dom';
 export * from './schedule'
+export * from './string'

package/src/schedule/runAsync.ts

@@ -1,3 +1,9 @@
+/**
+ * Run function in asynchronously in Worker
+ *
+ * @param fn Function to be run asynchronously
+ * @returns Promise of expected result
+ */
 export const runAsync = <T> (fn: () => any): Promise<T> => {
   const worker = new Worker(
     URL.createObjectURL(new Blob([`postMessage((${fn})());`])),

package/src/string/escapeHTML.ts

@@ -0,0 +1,12 @@
+/**
+ * Escape special HTML related characters from string
+ *
+ * @param html String containing HTML related characters
+ * @returns Safe string with escaped HTML related characters
+ */
+export const escapeHTML = (html: string): string => {
+  const tempDiv = document.createElement('div');
+  tempDiv.innerText = html;
+
+  return tempDiv.innerHTML;
+}

package/src/string/index.ts

@@ -0,0 +1 @@
+export * from './escapeHTML';

package/tsconfig.json

@@ -13,12 +13,7 @@
     "baseUrl": ".",
     "declaration": true,
     "outDir": "./dist",
-    "lib": [
-      "dom",
-      "es2018"
-    ],
+    "lib": ["dom", "es2021"]
   },
-  "include": [
-    "src/**/*.ts"
-  ]
+  "include": ["src/**/*.ts"]
 }