tool-shack 0.0.23 → 0.0.25

package/dist/browser/preferColorScheme.d.ts

@@ -15,4 +15,4 @@ export declare const preferDarkColorScheme: () => boolean;
  *
  * @returns String indicating prefered light color scheme ('light') or dark color scheme ('dark')
  */
-export declare const preferColorScheme: () => 'light' | 'dark';
+export declare const preferColorScheme: () => "light" | "dark";

package/dist/dom/createElement.d.ts

@@ -6,4 +6,4 @@ import { IExtendingElementProps } from './interfaces/createElement.js';
  * @param props List of attributes, event listeners or/and children to assign to the newly created element
  * @returns Resulting Node element
  */
-export declare const createElement: <T = HTMLElement>(tagName: string, props?: (Partial<Omit<T, "style" | "children" | "dataset">> & IExtendingElementProps) | undefined) => T;
+export declare const createElement: <T = HTMLElement>(tagName: string, props?: Partial<Omit<T, "children" | "dataset" | "style">> & IExtendingElementProps) => T;

package/dist/dom/createElement.js

@@ -14,17 +14,26 @@ export const createElement = (tagName, props) => {
                 element.setAttribute(key, value);
             }
             else if (key === 'aria') {
-                for (let ariaKey in props.aria) {
-                    element.setAttribute(`aria-${ariaKey}`, value[ariaKey]);
+                for (const [ariaKey, ariaValue] of Object.entries(props.aria)) {
+                    element.setAttribute(`aria-${ariaKey}`, ariaValue);
                 }
             }
-            else if (key === 'style') {
-                for (let styleKey in props.style) {
-                    element.style[styleKey] = value[styleKey];
+            else if (props.style) {
+                for (const [styleKey, styleValue] of Object.entries(props.style)) {
+                    element.style[styleKey] = styleValue;
                 }
             }
             else if (key === 'children') {
-                props.children.forEach((child) => element.appendChild(child));
+                const fragment = document.createDocumentFragment();
+                for (const child of props.children) {
+                    if (typeof child === 'string') {
+                        fragment.appendChild(document.createTextNode(child));
+                    }
+                    else {
+                        fragment.appendChild(child);
+                    }
+                }
+                element.appendChild(fragment);
             }
             else if (key === 'listeners') {
                 for (let eventName in props.listeners) {
@@ -35,9 +44,7 @@ export const createElement = (tagName, props) => {
                 }
             }
             else if (key === 'dataset') {
-                for (let datasetKey in props.dataset) {
-                    element.dataset[datasetKey] = props.dataset[datasetKey];
-                }
+                Object.assign(element.dataset, props.dataset);
             }
             else {
                 element[key] = value;

package/dist/dom/interfaces/createElement.d.ts

@@ -1,6 +1,6 @@
 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[];
+    children?: (HTMLElement | string)[];
     listeners?: Record<string, EventListenerOrEventListenerObject | EventListenerOrEventListenerObject[]>;
     role?: string;
     aria?: Partial<Record<TAriaLabelKey, string>>;

package/package.json

@@ -1,49 +1,49 @@
-{
-  "name": "tool-shack",
-  "version": "0.0.23",
-  "description": "Collection of usefull functions to ease work",
-  "author": {
-    "name": "David Myška",
-    "url": "https://www.davidmyska.com/"
-  },
-  "license": "MIT",
-  "bugs": {
-    "url": "https://github.com/miskith/tool-shack/issues"
-  },
-  "homepage": "https://www.davidmyska.com/tool-shack/",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/miskith/tool-shack.git"
-  },
-  "type": "module",
-  "module": "dist/index.js",
-  "main": "dist/index.js",
-  "exports": {
-    "./package.json": {
-      "default": "./package.json"
-    },
-    ".": {
-      "types": "./dist/index.d.ts",
-      "default": "./dist/index.js"
-    }
-  },
-  "files": [
-    "dist/**/*.js",
-    "dist/**/*.d.ts",
-    "src/**/*.ts"
-  ],
-  "sideEffects": false,
-  "scripts": {
-    "build": "rm -rf dist && tsc -b .",
-    "format": "pretty-quick",
-    "generate-docs": "rm -rf docs && typedoc --name \"Tool-Shack\" --readme README.md src/*/index.ts",
-    "prepare": "husky install"
-  },
-  "devDependencies": {
-    "husky": "^8.0.3",
-    "prettier": "^2.8.8",
-    "pretty-quick": "^3.1.3",
-    "typedoc": "^0.24.8",
-    "typescript": "^5.1.3"
-  }
-}
+{
+  "name": "tool-shack",
+  "version": "0.0.25",
+  "description": "Collection of usefull functions to ease work",
+  "author": {
+    "name": "David Myška",
+    "url": "https://www.davidmyska.com/"
+  },
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/miskith/tool-shack/issues"
+  },
+  "homepage": "https://www.davidmyska.com/tool-shack/",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/miskith/tool-shack.git"
+  },
+  "type": "module",
+  "module": "dist/index.js",
+  "main": "dist/index.js",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./dist/index.d.ts",
+      "default": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist/**/*.js",
+    "dist/**/*.d.ts",
+    "src/**/*.ts"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "build": "rm -rf dist && tsc -b .",
+    "format": "pretty-quick",
+    "generate-docs": "rm -rf docs && typedoc --name \"Tool-Shack\" --readme README.md src/*/index.ts",
+    "prepare": "husky"
+  },
+  "devDependencies": {
+    "husky": "^9.1.7",
+    "prettier": "^3.3.3",
+    "pretty-quick": "^4.0.0",
+    "typedoc": "^0.26.11",
+    "typescript": "^5.6.3"
+  }
+}

package/src/dom/createElement.ts

@@ -1,55 +1,61 @@
-import { IExtendingElementProps } from './interfaces/createElement.js';
-
-/**
- * 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' | 'dataset' | 'style'>> & IExtendingElementProps,
-): T => {
-  const element: HTMLElement = document.createElement(tagName);
-
-  if (props) {
-    for (let key in props) {
-      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 === 'style') {
-        for (let styleKey in props.style!) {
-          (element.style as any)[styleKey] = value[styleKey];
-        }
-      } else if (key === 'children') {
-        props.children!.forEach((child: HTMLElement) => element.appendChild(child));
-      } else if (key === 'listeners') {
-        for (let eventName in props.listeners!) {
-          const functionList = (
-            props.listeners![eventName] instanceof Array
-              ? props.listeners![eventName]
-              : [props.listeners![eventName]]
-          ) as EventListenerOrEventListenerObject[];
-
-          functionList.forEach((fn: EventListenerOrEventListenerObject) =>
-            element.addEventListener(eventName, fn),
-          );
-        }
-      } else if (key === 'dataset') {
-        for (let datasetKey in props.dataset) {
-          element.dataset[datasetKey] = props.dataset[datasetKey];
-        }
-      } else {
-        (element as any)[key] = value;
-      }
-    }
-  }
-
-  return element as unknown as T;
-};
+import { IExtendingElementProps } from './interfaces/createElement.js';
+
+/**
+ * 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' | 'dataset' | 'style'>> & IExtendingElementProps,
+): T => {
+  const element: HTMLElement = document.createElement(tagName);
+
+  if (props) {
+    for (let key in props) {
+      const value = (props as any)[key];
+
+      if (key === 'role') {
+        element.setAttribute(key, value);
+      } else if (key === 'aria') {
+        for (const [ariaKey, ariaValue] of Object.entries(props.aria!)) {
+          element.setAttribute(`aria-${ariaKey}`, ariaValue);
+        }
+      } else if (props.style) {
+        for (const [styleKey, styleValue] of Object.entries(props.style)) {
+          (element.style as any)[styleKey] = styleValue;
+        }
+      } else if (key === 'children') {
+        const fragment = document.createDocumentFragment();
+        for (const child of props.children!) {
+          if (typeof child === 'string') {
+            fragment.appendChild(document.createTextNode(child));
+          } else {
+            fragment.appendChild(child);
+          }
+        }
+        element.appendChild(fragment);
+      } else if (key === 'listeners') {
+        for (let eventName in props.listeners!) {
+          const functionList = (
+            props.listeners![eventName] instanceof Array
+              ? props.listeners![eventName]
+              : [props.listeners![eventName]]
+          ) as EventListenerOrEventListenerObject[];
+
+          functionList.forEach((fn: EventListenerOrEventListenerObject) =>
+            element.addEventListener(eventName, fn),
+          );
+        }
+      } else if (key === 'dataset') {
+        Object.assign(element.dataset, props.dataset);
+      } else {
+        (element as any)[key] = value;
+      }
+    }
+  }
+
+  return element as unknown as T;
+};

package/src/dom/interfaces/createElement.ts

@@ -1,36 +1,36 @@
-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>>;
-  dataset?: Record<string, string>;
-  style?: Record<string, string | number>;
-}
+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 | string)[];
+  listeners?: Record<
+    string,
+    EventListenerOrEventListenerObject | EventListenerOrEventListenerObject[]
+  >;
+  role?: string;
+  aria?: Partial<Record<TAriaLabelKey, string>>;
+  dataset?: Record<string, string>;
+  style?: Record<string, string | number>;
+}