aprog 2.2.1 → 2.2.3

package/index.js

@@ -15,10 +15,11 @@ export { cookie, storage, session, cacheKey, downloadFile } from './src/storage.
 export { paginate, parseData, __paginate, __counter } from './src/paginate.js';
 export { saveItem, loadItem, setSecretKey } from './src/secretStorage.js';
 export {
-    pushHTMLElementPrototype, pushAfterHTMLElementPrototype,
-    pushBeforeHTMLElementPrototype, dataHTMLElementPrototype,
-    toKebabCaseStringPrototype, toSnakeCaseStringPrototype,
-    repeatHTMLElementPrototype
+    pushHTMLElementPrototype, prepushHTMLElementPrototype,
+    pushAfterHTMLElementPrototype, pushBeforeHTMLElementPrototype,
+    dataHTMLElementPrototype, toKebabCaseStringPrototype,
+    toSnakeCaseStringPrototype, repeatHTMLElementPrototype,
+    replaceChildrenHTMLElementPrototype
 } from './src/html.js';
 export { prism } from "./src/prism.js";
 export { uniquePage } from "./src/pages.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aprog",
-  "version": "2.2.1",
+  "version": "2.2.3",
   "description": "Допоміжна JavaScript-бібліотека для проєктів",
   "main": "index.js",
   "exports": {

package/src/classes/StateWrapper.js

@@ -4,55 +4,53 @@ class StateWrapper {
     constructor(initialValue) {
         this.#value = initialValue;
 
-        return new Proxy(this, {
-            get: (target, prop) => {
+        const handler = {
+            get: (target, prop, receiver) => {
+                if (prop === 'val') return target.#value;
+
                 if (prop === 'set') {
                     return (newValue) => {
-                        target.#value = typeof newValue === 'function'
-                            ? newValue(target.#value)
-                            : newValue;
+                        target.#value = typeof newValue === 'function' ? newValue(target.#value) : newValue;
                     };
                 }
 
-                if (prop === 'value') {
-                    return target.#value;
+                if (prop === 'merge') {
+                    return (patch) => {
+                        if (typeof target.#value === 'object' && target.#value !== null) {
+                            target.#value = { ...target.#value, ...patch };
+                        }
+                    };
                 }
 
-                if (typeof target.#value === 'object' && target.#value !== null && prop in target.#value) {
+                if (prop === 'toJSON') return () => target.#value;
+                if (prop === 'toString') return () => String(target.#value);
+                if (prop === 'valueOf') return () => target.#value;
+
+                if (
+                    typeof target.#value === 'object' &&
+                    target.#value !== null &&
+                    prop in target.#value
+                ) {
                     return target.#value[prop];
                 }
 
-                return Reflect.get(target, prop);
+                return Reflect.get(target, prop, receiver);
             },
 
-            set: (target, prop, val) => {
+            set: (target, prop, newVal) => {
                 if (typeof target.#value === 'object' && target.#value !== null) {
-                    target.#value[prop] = val;
+                    target.#value[prop] = newVal;
                     return true;
                 }
                 return false;
             },
+        };
 
-            apply: (_, __, ___) => {
-                return target.#value;
-            },
-
-            getPrototypeOf: (target) => {
-                return Object.getPrototypeOf(target.#value);
-            },
-
-            has: (target, key) => {
-                return key in target.#value;
-            },
-
-            ownKeys: (target) => {
-                return Reflect.ownKeys(target.#value);
-            },
+        return new Proxy(this, handler);
+    }
 
-            getOwnPropertyDescriptor: (target, key) => {
-                return Object.getOwnPropertyDescriptor(target.#value, key);
-            }
-        });
+    valueOf() {
+        return this.#value;
     }
 }
 

package/src/constructs/ButtonConstructor.js

@@ -25,6 +25,7 @@ export const ButtonConstructor = {
         type = undefined,
         text = "",
         callback = () => {},
+        ...props
     } = {}) {
         return this.is = button({
             id: id || GUID(),
@@ -32,7 +33,8 @@ export const ButtonConstructor = {
             style: style,
             ...(type && {type: type}),
             value: text,
-            onClick: callback
+            onClick: callback,
+            ...props
         });
     },
 

package/src/constructs/InputConstructor.js

@@ -28,17 +28,21 @@ export const InputConstructor = {
         value = undefined,
         nameCallback = "onInput",
         callback = () => {},
+        ...props
     } = {}) {
-        return this.is = input({
+        this.is = input({
             id: id || GUID(),
             class: `${this.class} input ${className}`.trim(),
             style: style,
             ...(type && {type: type}),
-            focus: focus,
             ...(placeholder && {placeholder: placeholder}),
             ...(value && {value: value}),
             [nameCallback]: callback,
+            ...props
         });
+
+        if (focus) queueMicrotask(() => this.is.focus());
+        return this.is;
     },
 
     /**

package/src/constructs/SelectConstructor.js

@@ -25,6 +25,7 @@ export const SelectConstructor = {
         option = undefined,
         options = undefined,
         callback = () => {},
+        ...props
     } = {}) {
         return this.is = select({
             id: id || GUID(),
@@ -33,6 +34,7 @@ export const SelectConstructor = {
             ...(option && {option: option}),
             ...(options && {options: options}),
             onChange: callback,
+            ...props
         });
     },
 

package/src/html.js

@@ -7,6 +7,15 @@ export function pushHTMLElementPrototype() {
     }
 }
 
+export function prepushHTMLElementPrototype() {
+    if (!HTMLElement.prototype.prepush) {
+        HTMLElement.prototype.prepush = function(element) {
+            this.innerHTML = null;
+            this.prepend(element);
+        };
+    }
+}
+
 export function pushAfterHTMLElementPrototype() {
     if (!HTMLElement.prototype.pushAfter) {
         HTMLElement.prototype.pushAfter = function (element, existingChild) {