ziko 0.36.0 → 0.36.2

package/dist/ziko.mjs

@@ -2,7 +2,7 @@
 /*
   Project: ziko.js
   Author: Zakaria Elalaoui
-  Date : Tue Aug 12 2025 11:00:20 GMT+0100 (UTC+01:00)
+  Date : Thu Aug 14 2025 10:09:49 GMT+0100 (UTC+01:00)
   Git-Repo : https://github.com/zakarialaoui10/ziko.js
   Git-Wiki : https://github.com/zakarialaoui10/ziko.js/wiki
   Released under MIT License
@@ -3289,52 +3289,16 @@ class ZikoUseMediaQuery {
 
 const useMediaQuery = (mediaQueryRules,fallback) => new ZikoUseMediaQuery(mediaQueryRules,fallback);
 
-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 * from "./window"
 
 var Hooks = /*#__PURE__*/Object.freeze({
   __proto__: null,
   ZikoHead: ZikoHead$1,
-  ZikoUseRoot: ZikoUseRoot,
   ZikoUseStyle: ZikoUseStyle,
   useFavIcon: useFavIcon$1,
   useHead: useHead$1,
   useMediaQuery: useMediaQuery,
   useMeta: useMeta$1,
-  useRoot: useRoot,
-  useRootValue: useRootValue,
   useStyle: useStyle,
   useSuccesifKeys: useSuccesifKeys,
   useTitle: useTitle$1
@@ -8115,6 +8079,123 @@ class ZikoUseChannel{
 }
 const useChannel = name => new ZikoUseChannel(name);
 
+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 ZikoUseRoot {
+    constructor(PropsMap, {namespace = 'Ziko', register, ValidateCssProps = false} = {}){
+        this.currentPropsMap = PropsMap;
+        this.namespace = namespace;
+        this.ValidateCssProps = ValidateCssProps;
+        // this.pairs = {};
+        // this.#maintain()
+        this.use(PropsMap);
+    }
+    use(PropsMap){
+        if(this.ValidateCssProps) ValidateCssProps(PropsMap);
+        this.currentPropsMap = PropsMap;
+        this.#maintain();
+        return this;
+    }
+    #maintain(){
+       const root = globalThis?.document?.documentElement?.style;
+       for(let prop in this.currentPropsMap){
+        const cssProp = this.namespace ? `--${this.namespace}-${prop}` : `--${prop}`;
+           root.setProperty(
+            cssProp, 
+            this.currentPropsMap[prop]
+            ); 
+            console.log({cssProp});
+        //    Object.assign(this.pairs, {
+        //     [prop] : `var(--${this.namespace}-${prop})`
+        //    })
+           Object.defineProperty(this, prop, {
+                value: `var(${cssProp})`,
+                writable: true,
+                configurable: true,
+                enumerable: false 
+           });
+       }
+    }
+}
+
+function ValidateCssProps(PropsMap){
+    const validProps = new Set(Object.keys(document.documentElement.style));
+    for (let key in PropsMap) {
+        if (!validProps.has(key)) {
+            throw new Error(`Invalid CSS property: "${key}"`);
+        }
+    }
+}
+
+const useRoot = (PropsMap, {namespace, register, ValidateCssProps} = {}) => new ZikoUseRoot(PropsMap, {namespace, register, ValidateCssProps});
+
+// Usage 
+
+/*
+const Styles = {
+ S1 : {
+  background : 'white',
+  color : 'darkblue'
+  border : '2px darkblue solid"'
+ },
+ S2 : {
+  background : 'darkblue',
+  color : 'white'
+  border : '2px green solid"'
+ }
+}
+const {use, border, background, color} = useRoot(Style.S1)
+
+tags.p("Test useRoot ").style({
+  border,
+  color,
+  background,
+  padding : '10px'
+})
+
+*/
+
 // To do : remove old items
 class ZikoUseStorage{
     constructor(storage, globalKey, initialValue){
@@ -8184,49 +8265,6 @@ class ZikoUseStorage{
 const useLocaleStorage=(key,initialValue)=>new ZikoUseStorage(localStorage,key,initialValue);
 const useSessionStorage=(key,initialValue)=>new ZikoUseStorage(sessionStorage,key,initialValue);
 
-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;
-};
-
 [
     App,
     Math$1,
@@ -8293,4 +8331,4 @@ function RemoveAll(){
     Data.RemoveAll();
 }
 
-export { App$1 as App, Article, Aside, Base, Canvas, Combinaison, Complex, E, EPSILON, Ease, FileBasedRouting, Flex, Footer, Form, Grid$1 as Grid, HTMLWrapper, Header, Logic$1 as Logic, Main, Matrix, Nav, PI$1 as PI, Permutation, Random, SPA, SVGWrapper, Section, Str, Suspense, Svg, Table$1 as Table, Utils$1 as Utils, ZikoApp, ZikoCustomEvent, ZikoEventClick, ZikoEventClipboard, ZikoEventCustom, ZikoEventDrag, ZikoEventFocus, ZikoEventInput, ZikoEventKey, ZikoEventMouse, ZikoEventPointer, ZikoEventSwipe, ZikoEventTouch, ZikoEventWheel, ZikoHead$1 as ZikoHead, ZikoMutationObserver, ZikoSPA, ZikoUIAbbrText, ZikoUIArticle, ZikoUIAside, ZikoUIAudio, ZikoUIBlockQuote, ZikoUIBr, ZikoUICanvas, ZikoUICodeText, ZikoUIDefintion, ZikoUIElement, ZikoUIFigure, ZikoUIFlex, ZikoUIFooter, ZikoUIForm, ZikoUIGrid, ZikoUIHTMLWrapper, ZikoUIHeader, ZikoUIHeading, ZikoUIHr, ZikoUIHtmlTag, ZikoUIImage, ZikoUIInput, ZikoUIInputCheckbox, ZikoUIInputColor, ZikoUIInputDatalist$1 as ZikoUIInputDatalist, ZikoUIInputDate, ZikoUIInputDateTime, ZikoUIInputEmail, ZikoUIInputImage, ZikoUIInputNumber, ZikoUIInputOption, ZikoUIInputPassword, ZikoUIInputRadio, ZikoUIInputSearch, ZikoUIInputSlider$1 as ZikoUIInputSlider, ZikoUIInputTime, ZikoUILabel, ZikoUILink, ZikoUIMain, ZikoUINav, ZikoUIParagraphe, ZikoUIQuote, ZikoUISVGWrapper, ZikoUISection, ZikoUISelect, ZikoUISubText, ZikoUISupText, ZikoUISuspense, ZikoUISvg, ZikoUIText, ZikoUITextArea, ZikoUIVideo, ZikoUIXMLWrapper, ZikoUseRoot, ZikoUseStyle, __CACHE__, __Config__, __HYDRATION_MAP__, __HYDRATION__, __UI__, __ZikoEvent__, abbrText, abs, accum, acos, acosh, acot, add, arange, arr2str, asin, asinh, atan, atan2, atanh, audio, bindClickEvent, bindClipboardEvent, bindCustomEvent, bindDragEvent, bindFocusEvent, bindHashEvent, bindKeyEvent, bindMouseEvent, bindPointerEvent, bindTouchEvent, bindWheelEvent, blockQuote, br, brs, btn, cartesianProduct, ceil, checkbox, clamp, codeText, combinaison, complex, cos, cosh, cot, coth, count, countWords, csc, csv2arr, csv2json, csv2matrix, csv2object, csv2sql, datalist, Ziko as default, defineParamsGetter, deg2rad, dfnText, div, e, fact, figure, floor, geomspace, getEvent, h, h1, h2, h3, h4, h5, h6, hTags, hr, hrs, html, hypot, image, inRange, input, inputCamera, inputColor, inputDate, inputDateTime, inputEmail, inputImage, inputNumber, inputPassword, inputTime, isApproximatlyEqual, json2arr, json2css, json2csv, json2csvFile, json2xml, json2xmlFile, json2yml, json2ymlFile, lerp, li, link, linspace, ln, logspace, map, mapfun$1 as mapfun, matrix, matrix2, matrix3, matrix4, max, min, modulo, mul, norm, nums, obj2str, ol, ones, p, pgcd, pow, powerSet, ppcm, preload, prod, quote, rad2deg, radio, removeExtraSpace, round, s, sTags, search, sec, select, sig, sign, sin, sinc, sinh, slider, sqrt, sqrtn, str, sub, subSet, subText, sum, supText, svg2ascii, svg2img, svg2imgUrl, svg2str, tags, tan, tanh, text, textarea, timeTaken, time_memory_Taken, ul, useAnimation, useChannel, useCustomEvent, useEventEmitter, useFavIcon$1 as useFavIcon, useFps, useHashEvent, useHead$1 as useHead, useInputEvent, useLocaleStorage, useMediaQuery, useMeta$1 as useMeta, useRoot, useRootValue, useSessionStorage, useStyle, useSuccesifKeys, useSwipeEvent, useThread, useTimeLoop, useTitle$1 as useTitle, video, wait, waitForUIElm, waitForUIElmSync, watch, watchAttr, watchChildren, watchIntersection, watchScreen, watchSize, zeros };
+export { App$1 as App, Article, Aside, Base, Canvas, Combinaison, Complex, E, EPSILON, Ease, FileBasedRouting, Flex, Footer, Form, Grid$1 as Grid, HTMLWrapper, Header, Logic$1 as Logic, Main, Matrix, Nav, PI$1 as PI, Permutation, Random, SPA, SVGWrapper, Section, Str, Suspense, Svg, Table$1 as Table, Utils$1 as Utils, ZikoApp, ZikoCustomEvent, ZikoEventClick, ZikoEventClipboard, ZikoEventCustom, ZikoEventDrag, ZikoEventFocus, ZikoEventInput, ZikoEventKey, ZikoEventMouse, ZikoEventPointer, ZikoEventSwipe, ZikoEventTouch, ZikoEventWheel, ZikoHead$1 as ZikoHead, ZikoMutationObserver, ZikoSPA, ZikoUIAbbrText, ZikoUIArticle, ZikoUIAside, ZikoUIAudio, ZikoUIBlockQuote, ZikoUIBr, ZikoUICanvas, ZikoUICodeText, ZikoUIDefintion, ZikoUIElement, ZikoUIFigure, ZikoUIFlex, ZikoUIFooter, ZikoUIForm, ZikoUIGrid, ZikoUIHTMLWrapper, ZikoUIHeader, ZikoUIHeading, ZikoUIHr, ZikoUIHtmlTag, ZikoUIImage, ZikoUIInput, ZikoUIInputCheckbox, ZikoUIInputColor, ZikoUIInputDatalist$1 as ZikoUIInputDatalist, ZikoUIInputDate, ZikoUIInputDateTime, ZikoUIInputEmail, ZikoUIInputImage, ZikoUIInputNumber, ZikoUIInputOption, ZikoUIInputPassword, ZikoUIInputRadio, ZikoUIInputSearch, ZikoUIInputSlider$1 as ZikoUIInputSlider, ZikoUIInputTime, ZikoUILabel, ZikoUILink, ZikoUIMain, ZikoUINav, ZikoUIParagraphe, ZikoUIQuote, ZikoUISVGWrapper, ZikoUISection, ZikoUISelect, ZikoUISubText, ZikoUISupText, ZikoUISuspense, ZikoUISvg, ZikoUIText, ZikoUITextArea, ZikoUIVideo, ZikoUIXMLWrapper, ZikoUseRoot, ZikoUseStyle, __CACHE__, __Config__, __HYDRATION_MAP__, __HYDRATION__, __UI__, __ZikoEvent__, abbrText, abs, accum, acos, acosh, acot, add, arange, arr2str, asin, asinh, atan, atan2, atanh, audio, bindClickEvent, bindClipboardEvent, bindCustomEvent, bindDragEvent, bindFocusEvent, bindHashEvent, bindKeyEvent, bindMouseEvent, bindPointerEvent, bindTouchEvent, bindWheelEvent, blockQuote, br, brs, btn, cartesianProduct, ceil, checkbox, clamp, codeText, combinaison, complex, cos, cosh, cot, coth, count, countWords, csc, csv2arr, csv2json, csv2matrix, csv2object, csv2sql, datalist, Ziko as default, defineParamsGetter, deg2rad, dfnText, div, e, fact, figure, floor, geomspace, getEvent, h, h1, h2, h3, h4, h5, h6, hTags, hr, hrs, html, hypot, image, inRange, input, inputCamera, inputColor, inputDate, inputDateTime, inputEmail, inputImage, inputNumber, inputPassword, inputTime, isApproximatlyEqual, json2arr, json2css, json2csv, json2csvFile, json2xml, json2xmlFile, json2yml, json2ymlFile, lerp, li, link, linspace, ln, logspace, map, mapfun$1 as mapfun, matrix, matrix2, matrix3, matrix4, max, min, modulo, mul, norm, nums, obj2str, ol, ones, p, pgcd, pow, powerSet, ppcm, preload, prod, quote, rad2deg, radio, removeExtraSpace, round, s, sTags, search, sec, select, sig, sign, sin, sinc, sinh, slider, sqrt, sqrtn, str, sub, subSet, subText, sum, supText, svg2ascii, svg2img, svg2imgUrl, svg2str, tags, tan, tanh, text, textarea, timeTaken, time_memory_Taken, ul, useAnimation, useChannel, useCustomEvent, useEventEmitter, useFavIcon$1 as useFavIcon, useFps, useHashEvent, useHead$1 as useHead, useInputEvent, useLocaleStorage, useMediaQuery, useMeta$1 as useMeta, useRoot, useSessionStorage, useStyle, useSuccesifKeys, useSwipeEvent, useThread, useTimeLoop, useTitle$1 as useTitle, video, wait, waitForUIElm, waitForUIElmSync, watch, watchAttr, watchChildren, watchIntersection, watchScreen, watchSize, zeros };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ziko",
-  "version": "0.36.0",
-  "description": "a versatile javaScript framework offering a rich set of UI components, advanced mathematical utilities, reactivity, animations, client side routing and graphics capabilities",
+  "version": "0.36.2",
+  "description": "A versatile JavaScript library offering a rich set of Hyperscript Based UI components, advanced mathematical utilities, interactivity ,animations, client side routing and more ...",
   "keywords": [
     "front-end",
     "framework",
@@ -24,6 +24,7 @@
     "LICENCE"
   ],
   "exports": {
+    "./*" : "./src/*",
     ".": {
       "import": "./dist/ziko.mjs",
       "require": "./dist/ziko.cjs"
@@ -55,6 +56,7 @@
     "./app": {},
     "./time": {},
     "./components": {}
+    
   },
   "bin": {
     "create-ziko-app": "starter/bin/index.js"
@@ -90,4 +92,4 @@
     "rollup-plugin-livereload": "^2.0.5",
     "rollup-plugin-serve": "^1.1.1"
   }
-}
+}

package/readme.md

@@ -0,0 +1,57 @@
+# Zikojs 
+
+A versatile JavaScript library offering a rich set of Hyperscript Based UI components, advanced mathematical utilities, interactivity ,animations, client side routing and more ...
+<div align="center">
+
+[![license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/zakarialaoui10/zikojs/blob/HEAD/LICENSE) [![npm latest package](https://img.shields.io/npm/v/ziko/latest.svg)](https://www.npmjs.com/package/ziko) [![npm downloads](https://img.shields.io/npm/dy/ziko.svg)](https://www.npmjs.com/package/ziko) 
+<!-- [![Average time to resolve an issue](https://isitmaintained.com/badge/resolution/zakarialaoui10/ziko.svg)](https://isitmaintained.com/project/zakarialaoui/ziko 'Average time to resolve an issue') -->
+
+</div>
+
+<!-- 
+## Philosophy
+Methodes Chaining 
+Composition 
+ -->
+## Demos
+- [ Windows entanglement using zikojs and ziko-gl ](https://www.linkedin.com/feed/update/urn:li:activity:7144023650394918913/) 
+
+## 🔥 Features
+### 💎 Core
+- 🚫 Zero Dependency
+- 🌳 Partial Tree Shaking
+- 🔢 Rich Math Functions and Utilities
+<!-- - The Math Module supports a new Paradigm  -->
+- ✨ Hyperscript-Based Declarative UI (No Template Engines needed)
+- 📱 Single Page Application With File Based Routing
+- 🤝 One Way Interleaving With [Vanjs]()
+- ⏰ Time loop and animations support
+
+### 🚀 External : 
+- 🧩 Extra UI Components : [Zextra]()
+- 🖥️ Server Side Rendering With File Based Routing and Client Side Hydration : [ziko-server]()
+- 📝 Mdx-Like Markdown Preprocessor : [Mdz]()
+- 🔌 Flexible Integration with Popular Frameworks/Libraries : [Ziko-wrapper]()
+  - 🔄 Bi-directional : `React`, `Preact`, `Solid`, `Svelte`, `Vue` , `Vanjs`
+  - ➡️ Uni-directional (ZikoJS → X) : 
+    - `Astro` : (SSR + Client Hydration)
+- 📦 Growing Add-On Ecosystem : 
+    - Ziko-Gl : WebGL/3D Graphics, Built on Top of [Threejs]()
+    - Ziko-Chart 
+    - Ziko-Code
+    - Ziko-Lottie
+    - ...
+
+## Install :
+```bash
+npm i ziko
+```
+## Quick Start :
+```bash
+npx create-ziko-app [app-title]
+```
+## ⭐️ Show your support <a name="support"></a>
+
+If you appreciate the library, kindly demonstrate your support by giving it a star!<br>
+[![Star](https://img.shields.io/github/stars/zakarialaoui10/ziko.js?style=social)](https://github.com/zakarialaoui10/ziko.js)
+<!--## Financial support-->

package/src/reactivity/hooks/Head/useFavIcon.js

@@ -1,4 +1,4 @@
-import { useEventEmitter } from "../../../use/interactions/use-event-emmiter.js";
+import { useEventEmitter } from "../../../use/use-event-emmiter.js";
 class ZikoUseFavIcon{
     constructor(FavIcon,useEventEmitter=true){
         this.#init();

package/src/reactivity/hooks/Head/useTitle.js

@@ -1,4 +1,4 @@
-import { useEventEmitter } from "../../../use/interactions/use-event-emmiter.js";
+import { useEventEmitter } from "../../../use/use-event-emmiter.js";
 class ZikoUseTitle{
     constructor(title=document.title,useEventEmitter=true){
         this.cache={

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

@@ -3,4 +3,4 @@ export * from "./useStyle.js";
 // export * from "../Head/useTitle";
 // export * from "../Head/useFavIcon";
 export * from "./useMediaQuery.js"
-export * from "./useRoot.js"
+// export * from "./useRoot.js"

package/src/use/index.js

@@ -1,3 +1,14 @@
-export * from './storage/index.js';
-export * from './decorators/index.js';
-export * from './interactions/index.js';
+export * from './use-debounce.js';
+export * from './use-throttle.js';
+
+export * from "./use-channel.js";
+export * from "./use-event-emmiter.js";
+export * from "./use-thread.js";
+
+export * from './use-root.js';
+// export * from './use-title.js'
+export * from './use-favicon.js'
+// export * from './use-link.js'
+// export * from 'use-meta.js'
+
+export * from './use-storage.js'

package/src/use/{interactions/use-channel.js → use-channel.js}

@@ -1,4 +1,4 @@
-import { Random } from "../../math/random/index.js";
+import { Random } from "../math/random/index.js";
 class ZikoUseChannel{
     constructor(name = ""){
         this.channel = new BroadcastChannel(name);

package/src/use/use-root.js

@@ -0,0 +1,78 @@
+class ZikoUseRoot {
+    constructor(PropsMap, {namespace = 'Ziko', register, ValidateCssProps = false} = {}){
+        this.currentPropsMap = PropsMap;
+        this.namespace = namespace;
+        this.ValidateCssProps = ValidateCssProps;
+        // this.pairs = {};
+        // this.#maintain()
+        this.use(PropsMap)
+    }
+    use(PropsMap){
+        if(this.ValidateCssProps) ValidateCssProps(PropsMap)
+        this.currentPropsMap = PropsMap;
+        this.#maintain()
+        return this;
+    }
+    #maintain(){
+       const root = globalThis?.document?.documentElement?.style
+       for(let prop in this.currentPropsMap){
+        const cssProp = this.namespace ? `--${this.namespace}-${prop}` : `--${prop}`
+           root.setProperty(
+            cssProp, 
+            this.currentPropsMap[prop]
+            ); 
+            console.log({cssProp})
+        //    Object.assign(this.pairs, {
+        //     [prop] : `var(--${this.namespace}-${prop})`
+        //    })
+           Object.defineProperty(this, prop, {
+                value: `var(${cssProp})`,
+                writable: true,
+                configurable: true,
+                enumerable: false 
+           })
+       }
+    }
+}
+
+function ValidateCssProps(PropsMap){
+    const validProps = new Set(Object.keys(document.documentElement.style));
+    for (let key in PropsMap) {
+        if (!validProps.has(key)) {
+            throw new Error(`Invalid CSS property: "${key}"`);
+        }
+    }
+}
+
+const useRoot = (PropsMap, {namespace, register, ValidateCssProps} = {}) => new ZikoUseRoot(PropsMap, {namespace, register, ValidateCssProps});
+
+export{
+    ZikoUseRoot,
+    useRoot
+}
+
+// Usage 
+
+/*
+const Styles = {
+ S1 : {
+  background : 'white',
+  color : 'darkblue'
+  border : '2px darkblue solid"'
+ },
+ S2 : {
+  background : 'darkblue',
+  color : 'white'
+  border : '2px green solid"'
+ }
+}
+const {use, border, background, color} = useRoot(Style.S1)
+
+tags.p("Test useRoot ").style({
+  border,
+  color,
+  background,
+  padding : '10px'
+})
+
+*/

package/src/use/{storage/index.js → use-storage.js}

@@ -1,5 +1,5 @@
 // To do : remove old items
-import { useChannel } from "../interactions/use-channel.js";
+import { useChannel } from "./use-channel.js";
 class ZikoUseStorage{
     constructor(storage, globalKey, initialValue){
         this.cache={

package/src/use/decorators/index.js

@@ -1,2 +0,0 @@
-export * from './use-debounce.js'
-export * from './use-throttle.js'

package/src/use/interactions/index.js

@@ -1,3 +0,0 @@
-export * from "./use-channel.js";
-export * from "./use-thread.js";
-export * from "./use-event-emmiter.js"