ziko 1.0.0 → 1.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ziko",
-  "version": "1.0.0",
+  "version": "1.1.1",
   "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",

package/src/app/params.js

@@ -1,10 +1,7 @@
 function parseQueryParams(queryString) {
-    const params = {};
-    queryString.replace(/[A-Z0-9]+?=([\w|:|\/\.]*)/gi, (match) => {
-        const [key, value] = match.split('=');
-        params[key] = value;
-    });
-    return params;
+    return Object.fromEntries(
+            new URLSearchParams(location.search)
+        );
 }
 
 function defineParamsGetter(target ){

package/src/app/spa-file-based-routing.js

@@ -1,5 +1,5 @@
 import { SPA } from "./spa.js";
-import { tags } from "../ui/index.js";
+import { tags } from "../dom/index.js";
 // import.meta.glob('./src/pages/**/*.js')
 async function FileBasedRouting(pages /* use import.meta.glob */){
    const routes = Object.keys(pages)

package/src/app/spa.js

@@ -1,4 +1,4 @@
-import { text } from "../ui/index.js";
+import { text } from "../dom/index.js";
 import { dynamicRoutesParser,routesMatcher,isDynamic } from "./routes.js";
 import { ZikoApp } from "./ziko-app.js";
 class ZikoSPA extends ZikoApp{

package/src/data/converter/index.js

@@ -22,12 +22,12 @@
    svg2imgUrl,
    svg2img
  } from "./svg.js";
- export{
-  obj2str
- } from "./object.js"
- export{
-  arr2str
- } from "./array.js"
+//  export{
+//   obj2str
+//  } from "./object.js"
+//  export{
+//   arr2str
+//  } from "./array.js"
  export{
   json2css
  } from "./css.js"

package/src/data/converter/object.js

@@ -1,5 +1,9 @@
-import { arr2str } from "../index.js";
-import { Complex, mapfun, Matrix } from "../../math/index.js";
+// import { arr2str } from "../index.js";
+// import { Complex, mapfun, Matrix } from "../../math/index.js";
+
+import { Complex } from "../../math/complex/index.js";
+import { Matrix } from "../../math/matrix/index.js";
+import { mapfun } from "../../math/functions/utils/mapfun.js";
 
 // const obj2str=(object)=>{
 //     const recursiveToString = (obj) => {

package/src/data/converter/svg.js

@@ -1,4 +1,4 @@
-import { tags } from "../../ui"
+import { tags } from "../../dom"
 const svg2str=svg=>(new XMLSerializer()).serializeToString(svg);
 const svg2ascii=svg=>btoa(svg2str(svg));
 const svg2imgUrl=svg=>'data:image/svg+xml;base64,'+svg2ascii(svg);

package/src/hooks/index.d.ts

@@ -8,4 +8,5 @@ export type * from './use-event-emitter.d.ts'
 export type * from './use-media-query.d.ts'
 export type * from './use-title.d.ts'
 export type * from './use-favicon.d.ts'
-export type * from './use-root.d.ts'
+export type * from './use-root.d.ts'
+export type * from './use-query-params.d.ts'

package/src/hooks/index.js

@@ -10,4 +10,6 @@ export * from './use-thread.js'
 export * from './use-event-emitter.js'
 export * from './use-media-query.js'
 export * from './use-title.js'
-export * from './use-root.js'
+export * from './use-root.js'
+
+export * from './use-query-params.js'

package/src/hooks/use-query-params.d.ts

@@ -0,0 +1,31 @@
+export type QueryParams = Record<string, string>;
+
+export type SetQueryParams = (
+    updates:
+        | QueryParams
+        | ((current: QueryParams) => QueryParams),
+    merge?: boolean
+) => void;
+
+export type GetQueryParams = () => QueryParams;
+
+/**
+ * Reactive query params hook-like utility
+ * Returns:
+ * - getParams: function that returns current query params
+ * - setParams: function to update query params
+ */
+export function useQueryParams(): [
+    GetQueryParams,
+    SetQueryParams
+];
+
+/**
+ * Watches URL query parameters changes.
+ * Calls callback only when params actually change.
+ *
+ * Returns an unsubscribe function.
+ */
+export function watchQueryParams(
+    callback: (params: QueryParams) => void
+): () => void;

package/src/hooks/use-query-params.js

@@ -0,0 +1,71 @@
+import { useState } from "./use-state.js";
+const parseQueryParams = queryString => Object.fromEntries(new URLSearchParams(globalThis?.location?.search))
+
+export function useQueryParams() {
+    const getParams = () =>
+        parseQueryParams(window.location.search);
+
+    const setParams = (updates, merge = true) => {
+        const current = getParams();
+
+        const next =
+            typeof updates === "function"
+                ? updates(current)
+                : updates;
+
+        const finalParams = merge
+            ? { ...current, ...next }
+            : next;
+
+        const search = new URLSearchParams(finalParams).toString();
+
+        window.history.pushState(
+            {},
+            "",
+            `${window.location.pathname}${search ? `?${search}` : ""}`
+        );
+
+        window.dispatchEvent(
+            new CustomEvent("queryparamschange", {
+                detail: finalParams
+            })
+        );
+    };
+
+    return [getParams, setParams];
+}
+
+export function watchQueryParams(callback) {
+    let previousSearch = location.search;
+
+    const notify = () => {
+        const currentSearch = location.search;
+
+        if (currentSearch === previousSearch) {
+            return;
+        }
+
+        previousSearch = currentSearch;
+        callback(parseQueryParams(currentSearch));
+    };
+
+    window.addEventListener("popstate", notify);
+
+    const pushState = history.pushState;
+    history.pushState = function (...args) {
+        pushState.apply(this, args);
+        notify();
+    };
+
+    const replaceState = history.replaceState;
+    history.replaceState = function (...args) {
+        replaceState.apply(this, args);
+        notify();
+    };
+
+    callback(parseQueryParams(location.search));
+
+    return () => {
+        window.removeEventListener("popstate", notify);
+    };
+}

package/src/hooks/use-reactive.js

@@ -1,4 +1,4 @@
-import { mapfun } from '../math/index.js'
+import { mapfun } from '../math/utils/mapfun.js'
 import { useState } from './use-state.js'
 
 const useReactive = (nested_value) => mapfun(

package/src/index.js

@@ -1,5 +1,5 @@
 export * from "./math/index.js";
-export * from "./ui/index.js";
+export * from "./dom/index.js";
 export * from "./time/index.js";
 export * from "./data/index.js";
 // export * from "./reactivity/index.js"

package/src/math/functions/mapfun/index.d.ts

@@ -1,4 +1,4 @@
-import { Complex } from "../../../src/math/index.js";
+import { Complex } from "../../../src/math/Complex/index.js";
 import { Matrix } from "../../../src/math/matrix/index.js";
 
 /**

package/src/math/index.d.ts.txt

@@ -0,0 +1,5 @@
+export type * from './complex/index.d.ts'
+// export type * from './time'
+// export type * from './router'
+// export type * from './hooks'
+// export type * from './data'

package/src/math/index.js

@@ -16,11 +16,11 @@
 // }
 export * from "./const.js"
 export * from "./functions/index.js"
-export * from "./complex"
-export * from "./matrix"
+export * from "./complex/index.js"
+export * from "./matrix/index.js"
 // export * from "./discret"
-export * from "./random"
-export * from "./utils"
+export * from "./random/index.js"
+// export * from "./utils/index.js"  // To Check
 // export * from "./statistics"
 // export default Math;
 

package/src/math/utils/index.js

@@ -1,102 +1,108 @@
-// import { mapfun } from "../mapfun/index.js";
-// import { 
-//     add,
-//     sub,
-//     mul,
-//     div,
-//     modulo
-//  } from "./arithmetic.js";
-import {
-    zeros,
-    ones,
-    nums,
-    // norm,
-    // lerp,
-    // map,
-    // clamp,
-    arange,
-    linspace,
-    logspace,
-    geomspace
-} from "../signal/functions.js"
+export * from './arithmetic.js'
+export * from './checkers.js'
+export * from './comparaison.js'
+export * from './conversions.js'
+export * from './discret.js'
+// export * from './mapfun.js'
+// // import { mapfun } from "../mapfun/index.js";
+// // import { 
+// //     add,
+// //     sub,
+// //     mul,
+// //     div,
+// //     modulo
+// //  } from "./arithmetic.js";
 // import {
-//     deg2rad,
-//     rad2deg
-// } from "./conversions.js"
+//     zeros,
+//     ones,
+//     nums,
+//     // norm,
+//     // lerp,
+//     // map,
+//     // clamp,
+//     arange,
+//     linspace,
+//     logspace,
+//     geomspace
+// } from "../signal/functions.js"
+// // import {
+// //     deg2rad,
+// //     rad2deg
+// // } from "./conversions.js"
+// // import{
+// //     sum,
+// //     prod,
+// //     accum
+// // } from "../statistics/index.js"
 // import{
-//     sum,
-//     prod,
-//     accum
-// } from "../statistics/index.js"
-import{
-    inRange,
-    isApproximatlyEqual
-} from "./checkers.js"
-import{
-    cartesianProduct,
-    ppcm,
-    pgcd
-} from "./discret.js"
-const Utils={
-    // add,
-    // sub,
-    // mul,
-    // div,
-    // modulo,
+//     inRange,
+//     isApproximatlyEqual
+// } from "./checkers.js"
+// import{
+//     cartesianProduct,
+//     ppcm,
+//     pgcd
+// } from "./discret.js"
+// const Utils={
+//     // add,
+//     // sub,
+//     // mul,
+//     // div,
+//     // modulo,
 
-    zeros,
-    ones,
-    nums,
-    // norm,
-    // lerp,
-    // map,
-    // clamp,
-    arange,
-    linspace,
-    logspace,
-    geomspace,
+//     zeros,
+//     ones,
+//     nums,
+//     // norm,
+//     // lerp,
+//     // map,
+//     // clamp,
+//     arange,
+//     linspace,
+//     logspace,
+//     geomspace,
 
-    // sum,
-    // prod,
-    // accum,
+//     // sum,
+//     // prod,
+//     // accum,
 
-    cartesianProduct,
-    ppcm,
-    pgcd,
+//     cartesianProduct,
+//     ppcm,
+//     pgcd,
 
-    // deg2rad,
-    // rad2deg,
+//     // deg2rad,
+//     // rad2deg,
 
-    inRange,
-    isApproximatlyEqual
-}
-export {
-    // mapfun,
-    Utils,
-    zeros,
-    ones,
-    nums,
-    // sum,
-    // prod,
-    // add,
-    // mul,
-    // sub,
-    // div,
-    // modulo,
-    // rad2deg,
-    // deg2rad,
-    arange,
-    linspace,
-    logspace,
-    geomspace,
-    // norm,
-    // lerp,
-    // map,
-    // clamp,
-    pgcd,
-    ppcm,
-    isApproximatlyEqual,
-    inRange,
-    cartesianProduct,
-  };
+//     inRange,
+//     isApproximatlyEqual
+// }
+// export {
+//     // mapfun,
+//     Utils,
+//     zeros,
+//     ones,
+//     nums,
+//     // sum,
+//     // prod,
+//     // add,
+//     // mul,
+//     // sub,
+//     // div,
+//     // modulo,
+//     // rad2deg,
+//     // deg2rad,
+//     arange,
+//     linspace,
+//     logspace,
+//     geomspace,
+//     // norm,
+//     // lerp,
+//     // map,
+//     // clamp,
+//     pgcd,
+//     ppcm,
+//     isApproximatlyEqual,
+//     inRange,
+//     cartesianProduct,
+//   };
  

package/src/math/utils/mapfun.js

@@ -1,4 +1,4 @@
-const mapfun=(fun,...X)=>{
+export const mapfun=(fun,...X)=>{
     const Y=X.map(x=>{
         if(
             x===null||
@@ -40,4 +40,3 @@ const mapfun=(fun,...X)=>{
     });
    return Y.length==1? Y[0]: Y; 
 }
-export {mapfun}

package/src/math/index.d.ts

@@ -1,5 +0,0 @@
-export type * from './math'
-export type * from './time'
-export type * from './router'
-export type * from './hooks'
-export type * from './data'