@k37z3r/jbase 2.0.1 → 2.0.3

package/package.json

@@ -1,16 +1,18 @@
 {
     "name": "@k37z3r/jbase",
-    "version": "2.0.1",
+    "version": "2.0.3",
     "description": "A modern micro-framework for the web: jBase offers the familiar syntax of classic DOM libraries, but without their baggage. Fully typed, modular, and optimized for modern browser engines.",
     "private": false,
     "main": "./dist/index.cjs",
     "module": "./dist/index.mjs",
     "browser": "./dist/jbase.min.js",
-    "types": "dist/index.d.ts",
+    "types": "./dist/index.d.ts",
     "files": [
         "dist",
         "README.md",
-        "LICENSE"
+        "LICENSE",
+        "CHANGELOG.md",
+        "wiki"
     ],
     "scripts": {
         "build:ts": "tsc",
@@ -33,9 +35,11 @@
     },
     "license": "GPL-3.0-or-later",
     "dependencies": {
+        "jsdom": "^28.0.0",
         "tslib": "^2.8.1"
     },
     "devDependencies": {
+        "@types/jsdom": "^27.0.0",
         "@types/node": "^22.0.0",
         "esbuild": "^0.27.2",
         "typescript": "^5.3.3"
@@ -53,6 +57,12 @@
             "types": "./dist/index.d.ts",
             "import": "./dist/index.mjs",
             "require": "./dist/index.cjs"
-        }
+        },
+        "./server": {
+            "import": "./dist/server.js",
+            "types": "./dist/server.d.ts",  
+            "require": "./dist/server.js"
+        },
+        "./browser": "./dist/jbase.min.js"
     }
 }

package/wiki/CSS-Classes-&-Styles.md

@@ -0,0 +1,128 @@
+* [`css`](#usage-css)
+* [`addClass`](#usage-addClass) | [`removeClass`](#usage-removeClass) | [`toggleClass`](#usage-toggleClass) | [`hasClass`](#usage-hasClass)
+
+---
+
+## <a id="usage-css"></a>.css
+
+**Description**
+Get the value of a computed style property for the first element in the set of matched elements or set one or more CSS properties for every matched element.
+
+**Parameters**
+
+* `property` (String|Object): A CSS property name or an object of property-value pairs.
+* `value` (String|Number, optional): A value to set for the property.
+
+**Returns**
+
+* (String): The value of the property (if getter).
+* (jBase): Current instance (if setter).
+
+**Example**
+
+```javascript
+// Get value
+const color = $('.box').css('color');
+
+// Set single value
+$('.box').css('width', '500px');
+
+// Set multiple values
+$('.box').css({
+    'background-color': 'blue',
+    'font-size': '14px'
+});
+
+```
+
+---
+
+## <a id="usage-addClass"></a>.addClass
+
+**Description**
+Adds the specified class(es) to each element in the set of matched elements.
+
+**Parameters**
+
+* `className` (String): One or more class names to be added to the class attribute of each matched element.
+
+**Returns**
+
+* (jBase): Current instance.
+
+**Example**
+
+```javascript
+$('p').addClass('lead text-muted');
+
+```
+
+---
+
+## <a id="usage-removeClass"></a>.removeClass
+
+**Description**
+Remove a single class, multiple classes, or all classes from each element in the set of matched elements.
+
+**Parameters**
+
+* `className` (String): One or more class names to be removed.
+
+**Returns**
+
+* (jBase): Current instance.
+
+**Example**
+
+```javascript
+$('.active').removeClass('active');
+
+```
+
+---
+
+## <a id="usage-toggleClass"></a>.toggleClass
+
+**Description**
+Add or remove one or more classes from each element in the set of matched elements, depending on either the class's presence or the value of the state argument.
+
+**Parameters**
+
+* `className` (String): One or more class names to be toggled.
+
+**Returns**
+
+* (jBase): Current instance.
+
+**Example**
+
+```javascript
+$('.btn').click(function() {
+    $(this).toggleClass('btn-active');
+});
+
+```
+
+---
+
+## <a id="usage-hasClass"></a>.hasClass
+
+**Description**
+Determine whether any of the matched elements are assigned the given class.
+
+**Parameters**
+
+* `className` (String): The class name to search for.
+
+**Returns**
+
+* (Boolean): True if the class is present, false otherwise.
+
+**Example**
+
+```javascript
+if ($('#menu').hasClass('open')) {
+    $('#menu').slideUp();
+}
+
+```

package/wiki/DATA-Utilities-(Arrays).md

@@ -0,0 +1,332 @@
+* [`chunk`](#usage-chunk) | [`mergeArray`](#usage-mergeArray) | [`add`](#usage-add)
+* [`remove.at`](#usage-remove.at) | [`remove.first`](#usage-remove.first) | [`remove.last`](#usage-remove.last) | [`remove.byMatch`](#usage-remove.byMatch) | [`remove.all`](#usage-remove.all)
+* [`findAt`](#usage-find-at) | [`findFirst`](#usage-find-first) | [`findLast`](#usage-find-last) | [`findAll`](#usage-find-all) | [`findByMatch`](#usage-find-byMatch)
+
+---
+
+## <a id="usage-chunk"></a>.chunk
+
+**Description**
+Creates an array of elements split into groups the length of `size`.
+
+**Parameters**
+
+* `array` (Array): The array to process.
+* `size` (Number): The length of each chunk.
+
+**Returns**
+
+* (Array[]): An array containing the chunked arrays.
+
+**Example**
+
+```javascript
+const data = [1, 2, 3, 4, 5];
+const chunks = $.data.chunk(data, 2);
+// Result: [[1, 2], [3, 4], [5]]
+
+```
+
+---
+
+## <a id="usage-mergeArray"></a>.mergeArray
+
+**Description**
+Merges multiple arrays into a single, flat array.
+*(Note: This creates a new array and does not modify the inputs).*
+
+**Parameters**
+
+* `...arrays` (Array[]): A list of arrays to merge (e.g. `arr1, arr2, arr3`).
+
+**Returns**
+
+* (Array): A new, single merged array.
+
+**Example**
+
+```javascript
+const a = [1, 2];
+const b = [3, 4];
+const c = [5, 6];
+const result = $.data.mergeArray(a, b, c);
+// Result: [1, 2, 3, 4, 5, 6]
+
+```
+
+---
+
+## <a id="usage-add"></a>.add
+
+**Description**
+Safely adds an element to the array at a specific position without mutating the original array (Immutable).
+
+**Parameters**
+
+* `array` (Array): The original array.
+* `item` (Any): The item to add.
+* `index` (Number, optional): The position to insert at. Defaults to the end (`array.length`). Negative values count from the back.
+
+**Returns**
+
+* (Array): A new array including the added element.
+
+**Example**
+
+```javascript
+const list = ['a', 'c'];
+// Insert 'b' at index 1
+const result = $.data.add(list, 'b', 1);
+// Result: ['a', 'b', 'c']
+
+```
+
+---
+
+## <a id="usage-remove-at"></a>.remove.at
+
+**Description**
+Removes an element at a specific index and returns a new array. Supports negative indices to count from the end.
+
+**Parameters**
+
+* `array` (Array): The source array.
+* `index` (Number): The index to remove. Negative values count from the back (e.g., `-1` is the last item).
+
+**Returns**
+
+* (Array): A new array without the item at the specified index.
+
+**Example**
+
+```javascript
+const numbers = [10, 20, 30, 40];
+const result = $.data.remove.at(numbers, -2); // Removes 30
+// Result: [10, 20, 40]
+// Original 'numbers' array remains [10, 20, 30, 40]
+
+```
+
+---
+
+## <a id="usage-remove-first"></a>.remove.first
+
+**Description**
+Removes the first element of the array and returns the rest as a new array.
+
+**Parameters**
+
+* `array` (Array): The source array.
+
+**Returns**
+
+* (Array): A new array without the first element.
+
+**Example**
+
+```javascript
+const queue = ['Task 1', 'Task 2', 'Task 3'];
+const nextQueue = $.data.remove.first(queue);
+// Result: ['Task 2', 'Task 3']
+
+```
+
+---
+
+## <a id="usage-remove-last"></a>.remove.last
+
+**Description**
+Removes the last element of the array and returns the rest as a new array.
+
+**Parameters**
+
+* `array` (Array): The source array.
+
+**Returns**
+
+* (Array): A new array without the last element.
+
+**Example**
+
+```javascript
+const stack = ['A', 'B', 'C'];
+const newStack = $.data.remove.last(stack);
+// Result: ['A', 'B']
+
+```
+
+---
+
+## <a id="usage-remove-byMatch"></a>.remove.byMatch
+
+**Description**
+Removes **all** elements that match the search query condition.
+*(This effectively acts as an inverse filter).*
+
+**Parameters**
+
+* `array` (Array): The source array.
+* `query` (String|Number): The search term to match against.
+* `mode` (String, optional): Comparison mode: `'exact'`, `'contains'`, `'startsWith'`, `'endsWith'`. Default is `'exact'`.
+* `key` (String, optional): If the array contains objects, specify the property key to check.
+
+**Returns**
+
+* (Array): A new array containing only the items that **did not** match.
+
+**Example**
+
+```javascript
+const users = [
+    { id: 1, role: 'admin' },
+    { id: 2, role: 'user' },
+    { id: 3, role: 'admin' }
+];
+
+// Remove all admins
+const nonAdmins = $.data.remove.byMatch(users, 'admin', 'exact', 'role');
+// Result: [{ id: 2, role: 'user' }]
+```
+
+---
+
+## <a id="usage-find-at"></a>.find.at
+
+**Description**
+Finds the **index** of the first element that matches the query.
+
+**Parameters**
+
+* `array` (Array): The array to search.
+* `query` (String|Number): The search term.
+* `mode` (String, optional): Comparison mode: `'exact'`, `'contains'`, `'startsWith'`, `'endsWith'`. Default is `'exact'`.
+* `key` (String, optional): If the array contains objects, specify the property key to search in.
+
+**Returns**
+
+* (Number): The index of the match, or `-1` if not found.
+
+**Example**
+
+```javascript
+const users = [{id: 1, name: 'Alice'}, {id: 2, name: 'Bob'}];
+// Find index of user with name starting with 'Bo'
+const index = $.data.find.at(users, 'Bo', 'startsWith', 'name');
+// Result: 1
+
+```
+
+---
+
+## <a id="usage-find-all"></a>.find.all
+
+**Description**
+Returns **all elements** (as a new array) that match the condition. Similar to `filter()`.
+
+**Parameters**
+
+* `array` (Array): The array to search.
+* `query` (String|Number): The search term.
+* `mode` (String, optional): `'exact'`, `'contains'`, `'startsWith'`, `'endsWith'`. Default is `'exact'`.
+* `key` (String, optional): The object property key to check (if array of objects).
+
+**Returns**
+
+* (Array): An array containing all matching elements.
+
+**Example**
+
+```javascript
+const files = ['image.png', 'script.js', 'logo.png', 'style.css'];
+// Find all .png files
+const images = $.data.find.all(files, '.png', 'endsWith');
+// Result: ['image.png', 'logo.png']
+
+```
+
+---
+
+## <a id="usage-find-first"></a>.find.first
+
+**Description**
+Returns the **first element** (the actual item, not the index) that matches the query.
+
+**Parameters**
+
+* `array` (Array): The array to search.
+* `query` (String|Number): The search term.
+* `mode` (String, optional): `'exact'`, `'contains'`, `'startsWith'`, `'endsWith'`. Default is `'exact'`.
+* `key` (String, optional): The object property key to check.
+
+**Returns**
+
+* (Any | undefined): The found element, or `undefined`.
+
+**Example**
+
+```javascript
+const fruits = ['apple', 'banana', 'cherry'];
+const match = $.data.find.first(fruits, 'nana', 'contains');
+// Result: 'banana'
+
+```
+
+---
+
+## <a id="usage-find-last"></a>.find.last
+
+**Description**
+Returns the **last element** that matches the query. Searches the array in reverse order.
+
+**Parameters**
+
+* `array` (Array): The array to search.
+* `query` (String|Number): The search term.
+* `mode` (String, optional): `'exact'`, `'contains'`, `'startsWith'`, `'endsWith'`. Default is `'exact'`.
+* `key` (String, optional): The object property key to check.
+
+**Returns**
+
+* (Any | undefined): The last matching element, or `undefined`.
+
+**Example**
+
+```javascript
+const log = [
+    { level: 'info', msg: 'Start' },
+    { level: 'error', msg: 'Fail' },
+    { level: 'info', msg: 'End' }
+];
+// Find last info message
+const lastInfo = $.data.find.last(log, 'info', 'exact', 'level');
+// Result: { level: 'info', msg: 'End' }
+
+```
+
+---
+
+## <a id="usage-find-byMatch"></a>.find.byMatch
+
+**Description**
+Finds the **index** of the first match based on the query condition.
+*(Note: Functionally similar to `find.at` in the current implementation).*
+
+**Parameters**
+
+* `array` (Array): The array to search.
+* `query` (String|Number): The search term.
+* `mode` (String, optional): `'exact'`, `'contains'`, `'startsWith'`, `'endsWith'`. Default is `'exact'`.
+* `key` (String, optional): The object property key to check.
+
+**Returns**
+
+* (Number): The index of the match, or `-1`.
+
+**Example**
+
+```javascript
+const nums = [10, 20, 30, 40];
+const idx = $.data.find.byMatch(nums, 30);
+// Result: 2
+
+```