ziko 0.0.17 → 0.0.19

package/src/reactivity/hooks/{interactions → Interactions}/useEventEmmiter.js

@@ -1,64 +1,64 @@
-class ZikoUseEventEmitter {
-    constructor() {
-      this.events = {};
-      this.maxListeners = 10; 
-    }
-    on(event, listener) {
-      if (!this.events[event]) {
-        this.events[event] = [];
-      }
-      this.events[event].push(listener);  
-      if (this.events[event].length > this.maxListeners) {
-        console.warn(`Warning: Possible memory leak. Event '${event}' has more than ${this.maxListeners} listeners.`);
-      }
-    }
-    once(event, listener) {
-      const onceListener = (data) => {
-        this.off(event, onceListener); // Remove the listener after it's been called
-        listener(data);
-      };
-      this.on(event, onceListener);
-    }
-  
-    off(event, listener) {
-      const listeners = this.events[event];
-      if (listeners) {
-        const index = listeners.indexOf(listener);
-        if (index !== -1) {
-          listeners.splice(index, 1);
-        }
-      }
-    }
-  
-    emit(event, data) {
-      const listeners = this.events[event];
-      if (listeners) {
-        listeners.forEach(listener => {
-          listener(data);
-        });
-      }
-    }
-  
-    clear(event) {
-      if (event) {
-        delete this.events[event];
-      } else {
-        this.events = {};
-      }
-    }
-  
-    setMaxListener(event, max) {
-      this.maxListeners = max;
-    }
-  
-    removeAllListeners(event) {
-      if (event) {
-        this.events[event] = [];
-      } else {
-        this.events = {};
-      }
-    }
-  }
-
-const useEventEmitter=()=>new ZikoUseEventEmitter()
+class ZikoUseEventEmitter {
+    constructor() {
+      this.events = {};
+      this.maxListeners = 10; 
+    }
+    on(event, listener) {
+      if (!this.events[event]) {
+        this.events[event] = [];
+      }
+      this.events[event].push(listener);  
+      if (this.events[event].length > this.maxListeners) {
+        console.warn(`Warning: Possible memory leak. Event '${event}' has more than ${this.maxListeners} listeners.`);
+      }
+    }
+    once(event, listener) {
+      const onceListener = (data) => {
+        this.off(event, onceListener); // Remove the listener after it's been called
+        listener(data);
+      };
+      this.on(event, onceListener);
+    }
+  
+    off(event, listener) {
+      const listeners = this.events[event];
+      if (listeners) {
+        const index = listeners.indexOf(listener);
+        if (index !== -1) {
+          listeners.splice(index, 1);
+        }
+      }
+    }
+  
+    emit(event, data) {
+      const listeners = this.events[event];
+      if (listeners) {
+        listeners.forEach(listener => {
+          listener(data);
+        });
+      }
+    }
+  
+    clear(event) {
+      if (event) {
+        delete this.events[event];
+      } else {
+        this.events = {};
+      }
+    }
+  
+    setMaxListener(event, max) {
+      this.maxListeners = max;
+    }
+  
+    removeAllListeners(event) {
+      if (event) {
+        this.events[event] = [];
+      } else {
+        this.events = {};
+      }
+    }
+  }
+
+const useEventEmitter=()=>new ZikoUseEventEmitter()
 export{useEventEmitter}

package/src/reactivity/hooks/{interactions → Interactions}/useThread.js

@@ -1,44 +1,44 @@
-class ZikoUseThreed {
-    #workerContent;
-    constructor() {
-        this.#workerContent = (
-            function (msg) {
-                try {
-                    const func = new Function("return " + msg.data.fun)();
-                    let result = func();
-                    postMessage({ result });
-                } catch (error) {
-                    postMessage({ error: error.message });
-                } finally {
-                    if (msg.data.close) self.close();
-                }
-            }
-        ).toString();
-        this.blob = new Blob(["this.onmessage = " + this.#workerContent], { type: "text/javascript" });
-        this.worker = new Worker(window.URL.createObjectURL(this.blob));
-    }
-    call(func, callback, close = true) {
-        this.worker.postMessage({
-            fun: func.toString(),
-            close
-        });
-        this.worker.onmessage = function (e) {
-            if (e.data.error) {
-                console.error(e.data.error);
-            } else {
-                callback(e.data.result);
-            }
-        };
-        return this;
-    }
-}
-
-const useThread = (func, callback , close) => {
-    const T = new ZikoUseThreed();
-    if (func) {
-        T.call(func, callback , close);
-    }
-    return T;
-}
-
+class ZikoUseThreed {
+    #workerContent;
+    constructor() {
+        this.#workerContent = (
+            function (msg) {
+                try {
+                    const func = new Function("return " + msg.data.fun)();
+                    let result = func();
+                    postMessage({ result });
+                } catch (error) {
+                    postMessage({ error: error.message });
+                } finally {
+                    if (msg.data.close) self.close();
+                }
+            }
+        ).toString();
+        this.blob = new Blob(["this.onmessage = " + this.#workerContent], { type: "text/javascript" });
+        this.worker = new Worker(window.URL.createObjectURL(this.blob));
+    }
+    call(func, callback, close = true) {
+        this.worker.postMessage({
+            fun: func.toString(),
+            close
+        });
+        this.worker.onmessage = function (e) {
+            if (e.data.error) {
+                console.error(e.data.error);
+            } else {
+                callback(e.data.result);
+            }
+        };
+        return this;
+    }
+}
+
+const useThread = (func, callback , close) => {
+    const T = new ZikoUseThreed();
+    if (func) {
+        T.call(func, callback , close);
+    }
+    return T;
+}
+
 export { useThread };

package/src/reactivity/hooks/Sensors/index.js

@@ -0,0 +1,2 @@
+export * from "./useBattery";
+export * from "./useGeolocation"

package/src/reactivity/hooks/{sensors → Sensors}/useBattery.js

@@ -1,36 +1,36 @@
-class ZikoUseBattery{
-    constructor(){
-        if(this.isSupported)this.#init();
-    }   
-    async #init(){
-        this.__Battery__=await navigator.getBattery(); 
-    }
-    get isSupported(){
-        return !!navigator.getBattery;
-    }
-    get current(){
-        // Synchrouns Code
-        const {
-            level,
-            charging,
-            chargingTime,
-            dischargingTime
-        }=this.__Battery__;
-        return{
-            level,
-            charging,
-            chargingTime,
-            dischargingTime
-        }
-    }
-    onChargingChange(callback){
-        this.__Battery__?.addEventListener("chargingchange",callback);
-        return this;
-    }
-    onLevelChange(callback){
-        this.__Battery__?.addEventListener("levelchange",callback);
-        return this;
-    }
-}
-const useBattery=()=>new ZikoUseBattery();
+class ZikoUseBattery{
+    constructor(){
+        if(this.isSupported)this.#init();
+    }   
+    async #init(){
+        this.__Battery__=await navigator.getBattery(); 
+    }
+    get isSupported(){
+        return !!navigator.getBattery;
+    }
+    get current(){
+        // Synchrouns Code
+        const {
+            level,
+            charging,
+            chargingTime,
+            dischargingTime
+        }=this.__Battery__;
+        return{
+            level,
+            charging,
+            chargingTime,
+            dischargingTime
+        }
+    }
+    onChargingChange(callback){
+        this.__Battery__?.addEventListener("chargingchange",callback);
+        return this;
+    }
+    onLevelChange(callback){
+        this.__Battery__?.addEventListener("levelchange",callback);
+        return this;
+    }
+}
+const useBattery=()=>new ZikoUseBattery();
 export{ useBattery }

package/src/reactivity/hooks/{sensors → Sensors}/useGeolocation.js

@@ -1,17 +1,17 @@
-class ZikoUseGeolocation{
-    constructor(){
-        if(this.isSupported)this.#init();
-    }   
-    async #init(){
-        navigator.geolocation.getCurrentPosition(e=>this.__Geolocation__=e)
-    }
-    get isSupported(){
-        return !!navigator.geolocation;
-    }
-    get current(){
-        // Synchrouns Code
-        return this.__Geolocation__;
-    }
-}
-const useGeolocation=()=>new ZikoUseGeolocation();
+class ZikoUseGeolocation{
+    constructor(){
+        if(this.isSupported)this.#init();
+    }   
+    async #init(){
+        navigator.geolocation.getCurrentPosition(e=>this.__Geolocation__=e)
+    }
+    get isSupported(){
+        return !!navigator.geolocation;
+    }
+    get current(){
+        // Synchrouns Code
+        return this.__Geolocation__;
+    }
+}
+const useGeolocation=()=>new ZikoUseGeolocation();
 export{ useGeolocation }

package/src/reactivity/hooks/{storage → Storage}/useStorage.js

@@ -1,73 +1,73 @@
-// To do : remove old items
-import { useChannel } from "../Interactions";
-class ZikoUseStorage{
-    constructor(storage,globalKey,initialValue){
-        this.cache={
-            storage,
-            globalKey,
-            channel:useChannel(`Ziko:useStorage-${globalKey}`),
-            oldItemKeys:new Set()
-        }
-        this.#init(initialValue);
-        this.#maintain();
-    }
-    get items(){
-        return JSON.parse(this.cache.storage[this.cache.globalKey]??null);
-    }
-    #maintain() {
-        for(let i in this.items)Object.assign(this, { [[i]]: this.items[i] });
-    }
-    #init(initialValue){
-        this.cache.channel=useChannel(`Ziko:useStorage-${this.cache.globalKey}`);
-        this.cache.channel.on("Ziko-Storage-Updated",()=>this.#maintain());
-        if(!initialValue)return;
-        if(this.cache.storage[this.cache.globalKey]){
-            Object.keys(this.items).forEach(key=>this.cache.oldItemKeys.add(key));
-            console.group("Ziko:useStorage")
-            console.warn(`Storage key '${this.cache.globalKey}' already exists. we will not overwrite it.`);
-            console.info(`%cWe'll keep the existing data.`,"background-color:#2222dd; color:gold;");
-            console.group("")
-        }
-        else this.set(initialValue);
-    }
-    set(data){
-        this.cache.storage.setItem(this.cache.globalKey,JSON.stringify(data));
-        this.cache.channel.emit("Ziko-Storage-Updated",{});
-        Object.keys(data).forEach(key=>this.cache.oldItemKeys.add(key));
-        this.#maintain();
-        return this
-    }
-    add(data){
-        const db={
-            ...this.items,
-            ...data
-        }
-        this.cache.storage.setItem(this.cache.globalKey,JSON.stringify(db));
-        this.#maintain();
-        return this;
-    }
-    remove(...keys){
-        const db={...this.items};
-        for(let i=0;i<keys.length;i++){
-            delete db[keys[i]];
-            delete this[keys[i]];
-        }
-        this.set(db);
-        return this;
-    }
-    get(key){
-        return this.items[key];
-    }
-    clear(){
-        this.cache.storage.removeItem(this.cache.globalKey);
-        this.#maintain();
-        return this;
-    }
-
-}
-const useLocaleStorage=(key,initialValue)=>new ZikoUseStorage(localStorage,key,initialValue);
-const useSessionStorage=(key,initialValue)=>new ZikoUseStorage(sessionStorage,key,initialValue);
-export{
-    useLocaleStorage,
-    useSessionStorage
+// To do : remove old items
+import { useChannel } from "../Interactions";
+class ZikoUseStorage{
+    constructor(storage,globalKey,initialValue){
+        this.cache={
+            storage,
+            globalKey,
+            channel:useChannel(`Ziko:useStorage-${globalKey}`),
+            oldItemKeys:new Set()
+        }
+        this.#init(initialValue);
+        this.#maintain();
+    }
+    get items(){
+        return JSON.parse(this.cache.storage[this.cache.globalKey]??null);
+    }
+    #maintain() {
+        for(let i in this.items)Object.assign(this, { [[i]]: this.items[i] });
+    }
+    #init(initialValue){
+        this.cache.channel=useChannel(`Ziko:useStorage-${this.cache.globalKey}`);
+        this.cache.channel.on("Ziko-Storage-Updated",()=>this.#maintain());
+        if(!initialValue)return;
+        if(this.cache.storage[this.cache.globalKey]){
+            Object.keys(this.items).forEach(key=>this.cache.oldItemKeys.add(key));
+            console.group("Ziko:useStorage")
+            console.warn(`Storage key '${this.cache.globalKey}' already exists. we will not overwrite it.`);
+            console.info(`%cWe'll keep the existing data.`,"background-color:#2222dd; color:gold;");
+            console.group("")
+        }
+        else this.set(initialValue);
+    }
+    set(data){
+        this.cache.storage.setItem(this.cache.globalKey,JSON.stringify(data));
+        this.cache.channel.emit("Ziko-Storage-Updated",{});
+        Object.keys(data).forEach(key=>this.cache.oldItemKeys.add(key));
+        this.#maintain();
+        return this
+    }
+    add(data){
+        const db={
+            ...this.items,
+            ...data
+        }
+        this.cache.storage.setItem(this.cache.globalKey,JSON.stringify(db));
+        this.#maintain();
+        return this;
+    }
+    remove(...keys){
+        const db={...this.items};
+        for(let i=0;i<keys.length;i++){
+            delete db[keys[i]];
+            delete this[keys[i]];
+        }
+        this.set(db);
+        return this;
+    }
+    get(key){
+        return this.items[key];
+    }
+    clear(){
+        this.cache.storage.removeItem(this.cache.globalKey);
+        this.#maintain();
+        return this;
+    }
+
+}
+const useLocaleStorage=(key,initialValue)=>new ZikoUseStorage(localStorage,key,initialValue);
+const useSessionStorage=(key,initialValue)=>new ZikoUseStorage(sessionStorage,key,initialValue);
+export{
+    useLocaleStorage,
+    useSessionStorage
 }

package/src/reactivity/hooks/{ui → UI}/index.js

@@ -1,5 +1,6 @@
-export * from "./useStyle";
-export * from "./useTheme";
-// export * from "../Head/useTitle";
-// export * from "../Head/useFavIcon";
-export * from "./useMediaQuery"
+export * from "./useStyle";
+// export * from "./useTheme";
+// export * from "../Head/useTitle";
+// export * from "../Head/useFavIcon";
+export * from "./useMediaQuery"
+export * from "./useRoot.js"

package/src/reactivity/hooks/{ui → UI}/useMediaQuery.js

@@ -1,43 +1,43 @@
-/*
- [
-            {
-                query: '(min-width: 600px)',
-                callback: () => console.log(1)
-            },
-            {
-                query: '(max-width: 300px)',
-                callback: () => console.log(2)
-            }
-        ]
-*/
-class ZikoUseMediaQuery {
-    constructor(mediaQueryRules=[],fallback=()=>{}) {
-        this.mediaQueryRules = mediaQueryRules;
-        this.fallback = fallback;
-        this.lastCalledCallback = null;
-        this.init();
-    }
-
-    init() {
-        this.mediaQueryRules.forEach(({ query, callback }) => {
-            const mediaQueryList = globalThis.matchMedia(query);
-            const checkMatches = () => {
-                const anyMatch = this.mediaQueryRules.some(({ query }) => globalThis.matchMedia(query).matches);
-                if (mediaQueryList.matches) {
-                    callback();
-                    this.lastCalledCallback = callback;
-                } else if (!anyMatch && this.lastCalledCallback !== this.fallback) {
-                    this.fallback();
-                    this.lastCalledCallback = this.fallback;
-                }
-            };
-            checkMatches()
-            mediaQueryList.addListener(checkMatches);
-        });
-    }
-}
-
-const useMediaQuery = (mediaQueryRules,fallback) => new ZikoUseMediaQuery(mediaQueryRules,fallback);
-export {
-    useMediaQuery
-};
+/*
+ [
+            {
+                query: '(min-width: 600px)',
+                callback: () => console.log(1)
+            },
+            {
+                query: '(max-width: 300px)',
+                callback: () => console.log(2)
+            }
+        ]
+*/
+class ZikoUseMediaQuery {
+    constructor(mediaQueryRules=[],fallback=()=>{}) {
+        this.mediaQueryRules = mediaQueryRules;
+        this.fallback = fallback;
+        this.lastCalledCallback = null;
+        this.init();
+    }
+
+    init() {
+        this.mediaQueryRules.forEach(({ query, callback }) => {
+            const mediaQueryList = globalThis.matchMedia(query);
+            const checkMatches = () => {
+                const anyMatch = this.mediaQueryRules.some(({ query }) => globalThis.matchMedia(query).matches);
+                if (mediaQueryList.matches) {
+                    callback();
+                    this.lastCalledCallback = callback;
+                } else if (!anyMatch && this.lastCalledCallback !== this.fallback) {
+                    this.fallback();
+                    this.lastCalledCallback = this.fallback;
+                }
+            };
+            checkMatches()
+            mediaQueryList.addListener(checkMatches);
+        });
+    }
+}
+
+const useMediaQuery = (mediaQueryRules,fallback) => new ZikoUseMediaQuery(mediaQueryRules,fallback);
+export {
+    useMediaQuery
+};

package/src/reactivity/hooks/UI/useRoot.js

@@ -0,0 +1,39 @@
+import { Str } from "../../../data"
+class ZikoUseRoot{
+    constructor(props){
+        this.props={};
+        props && this.set(props)
+    }
+    get(prop){
+        return this.props[prop]
+    }
+    // getStaticValue(){
+    //     return document.documentElement.style.getPropertyValue("--primary-col")
+    // }
+    set(props){
+        Object.entries(props).forEach(([key,value])=>this.#setOneProp(key, value));
+        return this;
+    }
+    #setOneProp(prop, value){
+        const CssProp = `--${Str.camel2hyphencase(prop)}`
+        document.documentElement.style.setProperty(CssProp,value);
+        Object.assign(this.props, {[prop]: `var(${CssProp})`})
+        Object.assign(this, {[prop] : `var(${CssProp})`})
+    }
+}
+
+const useRootValue=CssVar=>{
+    if(!CssVar.startsWith("--")) CssVar = `--${Str.camel2hyphencase(CssVar)}`
+    return `var(${CssVar})`
+}
+// const useRootStaticValue=CssVar=>{
+//     if(!CssVar.startsWith("--")) CssVar = `--${Str.camel2hyphencase(CssVar)}`
+//     return globalThis.document.documentElement.style.getPropertyValue(CssVar)  
+// }
+const useRoot=(props)=>new ZikoUseRoot(props)
+export{
+    ZikoUseRoot,
+    useRoot,
+    useRootValue,
+    // useRootStaticValue
+}