cradova 3.11.10 → 3.12.1

package/dist/index.js

@@ -53,7 +53,7 @@ var makeElement = (element, ElementChildrenAndPropertyList) => {
         continue;
       }
       if (Array.isArray(value)) {
-        if (prop === "ref" && value.length === 2 && value[0] instanceof __raw_ref && typeof value[1] === "string") {
+        if (prop === "ref" && value.length === 2 && value[0] instanceof RefInstance && typeof value[1] === "string") {
           const [refInstance, name] = value;
           refInstance.current[name] = element;
           continue;
@@ -102,18 +102,6 @@ function unroll_child_list(l) {
   }
   return fg;
 }
-function $if(condition, ...elements) {
-  if (condition) {
-    return elements;
-  }
-  return;
-}
-function $ifelse(condition, ifTrue, ifFalse) {
-  if (condition) {
-    return ifTrue;
-  }
-  return ifFalse;
-}
 var $case = (value, element) => {
   return (key) => {
     if (key === value) {
@@ -243,7 +231,7 @@ function useRef() {
   if (typeof self !== "function") {
     throw new Error("Cradova Hook Error: useRef called outside of a Cradova component context.");
   }
-  return new __raw_ref;
+  return new RefInstance;
 }
 function useReducer(reducer, initialArg, initializer) {
   const self = this;
@@ -326,7 +314,7 @@ var toCompNoRender = (comp) => {
 };
 var funcManager = {
   render(component) {
-    const html = component.apply(component, component._args);
+    const html = component(component, ...component._args || []);
     if (html instanceof HTMLElement) {
       component.reference = html;
       component.rendered = true;
@@ -356,7 +344,7 @@ var funcManager = {
     const node = component.reference;
     if (document.body.contains(node)) {
       resetComponent(component);
-      const newHtml = component.apply(component, component._args);
+      const newHtml = component(component, ...component._args || []);
       if (newHtml instanceof HTMLElement) {
         node.replaceWith(newHtml);
         node.insertAdjacentElement("beforebegin", newHtml);
@@ -487,11 +475,6 @@ var tbody = cra("table");
 var table = cra("tbody");
 var td = cra("td");
 var tr = cra("tr");
-var svg = (svg2, properties) => {
-  const span2 = document.createElement("span");
-  span2.innerHTML = svg2;
-  return makeElement(span2, properties || []);
-};
 var raw = (html) => {
   const div2 = document.createElement("div");
   if (Array.isArray(html)) {
@@ -548,6 +531,27 @@ class Store {
   }
 }
 
+class SilentStore {
+  $store;
+  constructor(store) {
+    this.$store = store;
+    for (const key in this.$store.$_internal_data) {
+      if (this.$store.$_internal_data.hasOwnProperty(key)) {
+        Object.defineProperty(this, key, {
+          get() {
+            return this.$store.$_internal_data[key];
+          },
+          set(value) {
+            this.$store.$_internal_data[key] = value;
+          },
+          enumerable: true,
+          configurable: true
+        });
+      }
+    }
+  }
+}
+
 class List2 {
   _data;
   _dirtyIndices;
@@ -592,6 +596,9 @@ class List2 {
     this._dirtyIndices.add("all");
     this.notifier("dataChanged", { type: "add", index });
   }
+  map(callback) {
+    return this._data.map(callback);
+  }
   remove(index, count = 1) {
     if (index >= 0 && index < this._data.length && count > 0) {
       this._data.splice(index, count);
@@ -622,6 +629,7 @@ class Signal {
   isList = false;
   subscribers = {};
   store;
+  silentStore = undefined;
   passers;
   constructor(initial, props) {
     if (!initial || typeof initial !== "object") {
@@ -631,6 +639,7 @@ class Signal {
       this.store = new Store(initial, (key) => {
         this.publish(key);
       });
+      this.silentStore = new SilentStore(this.store);
     } else {
       this.isList = true;
       this.store = new List2(initial, (eventType) => {
@@ -646,6 +655,7 @@ class Signal {
           this.store = new Store(Object.assign(initial, restored), (key2) => {
             this.publish(key2);
           });
+          this.silentStore = new SilentStore(this.store);
         } else if (Array.isArray(restored)) {
           this.isList = true;
           this.store = new List2(restored, (eventType) => {
@@ -1017,6 +1027,9 @@ class Router {
     history.go(-1);
   }
   static navigate(href, data) {
+    if (RouterBox["paused"]) {
+      return;
+    }
     if (typeof href !== "string") {
       console.error(" ✘  Cradova err:  href must be a defined path but got " + href + " instead");
     }
@@ -1059,14 +1072,25 @@ class Router {
       throw new Error(`✘  Cradova err: please add '<div data-wrapper="app"></div>' to the body of your index.html file `);
     }
     window.addEventListener("pageshow", () => RouterBox.router());
+    window.addEventListener("hashchange", () => {
+      if (RouterBox["paused"]) {
+        history.forward();
+        return;
+      }
+      RouterBox.router();
+    });
     window.addEventListener("popstate", (_e) => {
       _e.preventDefault();
+      if (RouterBox["paused"]) {
+        history.forward();
+        return;
+      }
       RouterBox.router();
     });
   }
 }
 
-class __raw_ref {
+class RefInstance {
   current = {};
   bind(name) {
     return [this, name];
@@ -1152,7 +1176,6 @@ export {
   td,
   tbody,
   table,
-  svg,
   span,
   select,
   section,
@@ -1190,14 +1213,12 @@ export {
   button,
   audio,
   a,
-  __raw_ref,
   VirtualList,
   Signal,
   Router,
+  RefInstance,
   Page,
   List,
   $switch,
-  $ifelse,
-  $if,
   $case
 };

package/dist/primitives/classes.d.ts

@@ -8,6 +8,7 @@ declare class List<Type extends any[]> {
     indexOf(item: Type[number]): number;
     update(index: number, newItemData: Type[number]): void;
     push(itemData: Type[number], index?: number): void;
+    map<T>(callback: (item: Type[number], index: number) => T): T[];
     remove(index: number, count?: number): void;
 }
 /**
@@ -22,6 +23,7 @@ declare class List<Type extends any[]> {
  */
 export declare class Signal<Type = any> {
     store: Type extends Array<any> ? List<Type> : Type extends Record<string, any> ? Type : never;
+    silentStore: Type extends Array<any> ? never : Type;
     passers?: Record<keyof Type, [string, Signal<Type>]>;
     constructor(initial: Type, props?: {
         persistName?: string | undefined;
@@ -40,7 +42,7 @@ export declare class Signal<Type = any> {
      * @param name of event.
      * @param callback function to call.
      */
-    notify<T extends keyof Type>(eventName: (T | "dataChanged" | "itemUpdated" | T[]) | (() => HTMLElement | void) | Comp | ((this: Comp) => HTMLElement), listener?: (() => HTMLElement | void) | Comp | ((this: Comp) => HTMLElement)): void;
+    notify<T extends keyof Type>(eventName: (T | "dataChanged" | "itemUpdated" | T[]) | (() => HTMLElement | void) | Comp | ((ctx: Comp) => HTMLElement), listener?: (() => HTMLElement | void) | Comp | ((this: Comp) => HTMLElement)): void;
     computed<T extends keyof Type>(eventName: (T | "dataChanged" | "itemUpdated") | (() => HTMLElement) | Comp | ((this: Comp) => HTMLElement), element?: (() => HTMLElement) | Comp | ((this: Comp) => HTMLElement)): HTMLElement | undefined;
     /**
      *  Cradova Signal
@@ -139,13 +141,13 @@ export declare class Router {
  * ---
  * make reference to dom elements
  */
-export declare class __raw_ref<T = unknown> {
+export declare class RefInstance<T = unknown> {
     current: Record<string, T>;
     /**
      * Bind a DOM element to a reference name.
      * @param name - The name to reference the DOM element by.
      */
-    bind(name: string): [__raw_ref<T>, string];
+    bind(name: string): [RefInstance<T>, string];
 }
 export declare class VirtualList {
     idxs: number[];

package/dist/primitives/dom-objects.d.ts

@@ -1,38 +1,36 @@
-import { type VJS_params_TYPE } from "./types.js";
-export declare const a: (...Children_and_Properties: VJS_params_TYPE<HTMLAnchorElement>) => HTMLAnchorElement;
-export declare const audio: (...Children_and_Properties: VJS_params_TYPE<HTMLAudioElement>) => HTMLAudioElement;
-export declare const button: (...Children_and_Properties: VJS_params_TYPE<HTMLButtonElement>) => HTMLButtonElement;
-export declare const canvas: (...Children_and_Properties: VJS_params_TYPE<HTMLCanvasElement>) => HTMLCanvasElement;
-export declare const div: (...Children_and_Properties: VJS_params_TYPE<HTMLDivElement>) => HTMLDivElement;
-export declare const footer: (...Children_and_Properties: VJS_params_TYPE<HTMLElement>) => HTMLElement;
-export declare const form: (...Children_and_Properties: VJS_params_TYPE<HTMLFormElement>) => HTMLFormElement;
-export declare const h1: (...Children_and_Properties: VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
-export declare const h2: (...Children_and_Properties: VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
-export declare const h3: (...Children_and_Properties: VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
-export declare const h4: (...Children_and_Properties: VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
-export declare const h5: (...Children_and_Properties: VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
-export declare const h6: (...Children_and_Properties: VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
-export declare const header: (...Children_and_Properties: VJS_params_TYPE<HTMLHeadElement>) => HTMLHeadElement;
-export declare const i: (...Children_and_Properties: VJS_params_TYPE<HTMLLIElement>) => HTMLLIElement;
-export declare const iframe: (...Children_and_Properties: VJS_params_TYPE<HTMLIFrameElement>) => HTMLIFrameElement;
-export declare const img: (...Children_and_Properties: VJS_params_TYPE<HTMLImageElement>) => HTMLImageElement;
-export declare const input: (...Children_and_Properties: VJS_params_TYPE<HTMLInputElement>) => HTMLInputElement;
-export declare const label: (...Children_and_Properties: VJS_params_TYPE<HTMLLabelElement>) => HTMLLabelElement;
-export declare const li: (...Children_and_Properties: VJS_params_TYPE<HTMLLIElement>) => HTMLLIElement;
-export declare const main: (...Children_and_Properties: VJS_params_TYPE<HTMLElement>) => HTMLElement;
-export declare const nav: (...Children_and_Properties: VJS_params_TYPE<HTMLElement>) => HTMLElement;
-export declare const ol: (...Children_and_Properties: VJS_params_TYPE<HTMLOListElement>) => HTMLOListElement;
-export declare const option: (...Children_and_Properties: VJS_params_TYPE<HTMLOptionElement>) => HTMLOptionElement;
-export declare const p: (...Children_and_Properties: VJS_params_TYPE<HTMLParagraphElement>) => HTMLParagraphElement;
-export declare const section: (...Children_and_Properties: VJS_params_TYPE<HTMLElement>) => HTMLElement;
-export declare const select: (...Children_and_Properties: VJS_params_TYPE<HTMLSelectElement>) => HTMLSelectElement;
-export declare const span: (...Children_and_Properties: VJS_params_TYPE<HTMLSpanElement>) => HTMLSpanElement;
-export declare const textarea: (...Children_and_Properties: VJS_params_TYPE<HTMLTextAreaElement>) => HTMLTextAreaElement;
-export declare const ul: (...Children_and_Properties: VJS_params_TYPE<HTMLUListElement>) => HTMLUListElement;
-export declare const video: (...Children_and_Properties: VJS_params_TYPE<HTMLVideoElement>) => HTMLVideoElement;
-export declare const tbody: (...Children_and_Properties: VJS_params_TYPE<HTMLTableElement>) => HTMLTableElement;
-export declare const table: (...Children_and_Properties: VJS_params_TYPE<HTMLTableSectionElement>) => HTMLTableSectionElement;
-export declare const td: (...Children_and_Properties: VJS_params_TYPE<HTMLTableCellElement>) => HTMLTableCellElement;
-export declare const tr: (...Children_and_Properties: VJS_params_TYPE<HTMLTableColElement>) => HTMLTableColElement;
-export declare const svg: (svg: string, properties?: VJS_params_TYPE<HTMLSpanElement>) => HTMLSpanElement;
+export declare const a: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLAnchorElement>) => HTMLAnchorElement;
+export declare const audio: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLAudioElement>) => HTMLAudioElement;
+export declare const button: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLButtonElement>) => HTMLButtonElement;
+export declare const canvas: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLCanvasElement>) => HTMLCanvasElement;
+export declare const div: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLDivElement>) => HTMLDivElement;
+export declare const footer: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLElement>) => HTMLElement;
+export declare const form: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLFormElement>) => HTMLFormElement;
+export declare const h1: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
+export declare const h2: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
+export declare const h3: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
+export declare const h4: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
+export declare const h5: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
+export declare const h6: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLHeadingElement>) => HTMLHeadingElement;
+export declare const header: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLHeadElement>) => HTMLHeadElement;
+export declare const i: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLLIElement>) => HTMLLIElement;
+export declare const iframe: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLIFrameElement>) => HTMLIFrameElement;
+export declare const img: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLImageElement>) => HTMLImageElement;
+export declare const input: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLInputElement>) => HTMLInputElement;
+export declare const label: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLLabelElement>) => HTMLLabelElement;
+export declare const li: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLLIElement>) => HTMLLIElement;
+export declare const main: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLElement>) => HTMLElement;
+export declare const nav: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLElement>) => HTMLElement;
+export declare const ol: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLOListElement>) => HTMLOListElement;
+export declare const option: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLOptionElement>) => HTMLOptionElement;
+export declare const p: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLParagraphElement>) => HTMLParagraphElement;
+export declare const section: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLElement>) => HTMLElement;
+export declare const select: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLSelectElement>) => HTMLSelectElement;
+export declare const span: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLSpanElement>) => HTMLSpanElement;
+export declare const textarea: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLTextAreaElement>) => HTMLTextAreaElement;
+export declare const ul: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLUListElement>) => HTMLUListElement;
+export declare const video: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLVideoElement>) => HTMLVideoElement;
+export declare const tbody: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLTableElement>) => HTMLTableElement;
+export declare const table: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLTableSectionElement>) => HTMLTableSectionElement;
+export declare const td: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLTableCellElement>) => HTMLTableCellElement;
+export declare const tr: (...Children_and_Properties: import("./types.js").VJS_params_TYPE<HTMLTableColElement>) => HTMLTableColElement;
 export declare const raw: (html: string | TemplateStringsArray) => DocumentFragment;

package/dist/primitives/functions.d.ts

@@ -2,12 +2,6 @@ import * as CSS from "csstype";
 import type { Comp, VJS_params_TYPE } from "./types.js";
 import { Signal } from "./classes.js";
 export declare const cra: <E extends HTMLElement>(tag: string) => (...Children_and_Properties: VJS_params_TYPE<E>) => E;
-/**
- * @param {expression} condition
- * @param {function} elements[]
- */
-export declare function $if(condition: any, ...elements: (() => HTMLElement | undefined)[]): (() => HTMLElement | undefined)[] | undefined;
-export declare function $ifelse(condition: any, ifTrue: () => HTMLElement, ifFalse?: () => HTMLElement): HTMLElement | undefined;
 type Case<K> = (key: K) => HTMLElement | undefined;
 export declare const $case: (value: any, element: any) => Case<any>;
 export declare function $switch<K = unknown>(key: K, ...cases: Case<K>[]): HTMLElement | undefined;

package/dist/primitives/types.d.ts

@@ -1,7 +1,7 @@
 import * as CSS from "csstype";
-import { __raw_ref, Page, Signal } from "./classes.js";
+import { Page, RefInstance, Signal } from "./classes.js";
 interface Attributes<E extends HTMLElement> {
-    ref?: [__raw_ref<any>, string];
+    ref?: [RefInstance<any>, string];
     value?: any;
     style?: Partial<CSS.Properties>;
     [key: `data-${string}`]: string | undefined;
@@ -11,7 +11,7 @@ interface Attributes<E extends HTMLElement> {
 type StandardEvents<E extends HTMLElement> = {
     [key in keyof E]: E[key] extends (this: E, event: Event) => void ? key : never;
 }[keyof E];
-export type VJS_params_TYPE<E extends HTMLElement> = (undefined | undefined[] | string | string[] | HTMLElement | HTMLElement[] | DocumentFragment | DocumentFragment[] | (() => HTMLElement) | (() => HTMLElement)[] | [string, Signal<any>] | VJS_params_TYPE<E> | VJS_params_TYPE<E>[] | (Attributes<E> & Omit<Partial<E>, keyof Attributes<E> | StandardEvents<E>>))[];
+export type VJS_params_TYPE<E extends HTMLElement> = (undefined | undefined[] | string | string[] | HTMLElement | HTMLElement[] | DocumentFragment | DocumentFragment[] | (() => HTMLElement) | (() => HTMLElement)[] | ((ctx: Comp) => HTMLElement) | ((ctx: Comp) => HTMLElement)[] | [string, Signal<any>] | (Attributes<E> & Omit<Partial<E>, keyof Attributes<E> | StandardEvents<E>>))[];
 export type CradovaPageType = {
     /**
      * Cradova page
@@ -42,7 +42,7 @@ export type CradovaPageType = {
 };
 export type browserPageType<importType = Page> = importType | Promise<importType> | (() => Promise<importType>);
 export interface Comp extends Function {
-    (this: Comp): HTMLElement;
+    (ctx: Comp, ...args: any[]): HTMLElement;
     useReducer: <S, A>(reducer: (state: S, action: A) => S, initialArg: S, initializer?: (arg: S) => S) => [S, (action: A) => void];
     useState: <S>(initialValue: S) => [S, (newState: S | ((prevState: S) => S)) => void];
     useEffect: (effect: () => (() => void) | void, deps?: unknown[]) => void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cradova",
-  "version": "3.11.10",
+  "version": "3.12.1",
   "description": "Build Powerful ⚡ Web Apps with Ease",
   "main": "dist/index.js",
   "type": "module",
@@ -15,7 +15,8 @@
   },
   "scripts": {
     "compile": "bun bundle.ts",
-    "lint": "eslint . --fix"
+    "lint": "eslint . --fix",
+    "tsc": "tsc --target esnext  tests/index.ts --watch --moduleResolution NodeNext --module NodeNext"
   },
   "keywords": [
     "frontend library",