cradova 3.6.5 → 3.6.7

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2023 Friday Candour
+Copyright (c) 2021 Friday Candour
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+SOFTWARE.

package/dist/index.js

@@ -163,10 +163,10 @@ function useEffect(effect, self) {
 function useRef() {
   return new __raw_ref;
 }
-var getSignal = (func, name) => {
+var getSignal = (name, func) => {
   return func.pipes.get(name);
 };
-var sendSignal = (func, name, data) => {
+var sendSignal = (name, data, func) => {
   const signal = func.signals.get(name);
   if (signal) {
     signal.publish(name, data);
@@ -181,28 +181,21 @@ var DEFAULT_STATE = {
   preRendered: null,
   reference: null,
   effectuate: null,
-  _state_index: 0
+  _state_index: 0,
+  effects: [],
+  _state: []
 };
 var toFunc = (func) => {
-  if (func.id)
+  if (typeof func._state_index === "number")
     return funcManager.render(func);
-  cradovaEvent.compId += 1;
-  func.id = cradovaEvent.compId;
   Object.assign(func, DEFAULT_STATE);
   func.signals = new Map;
   func.pipes = new Map;
-  func.effects = [];
-  func._state = [];
   return funcManager.render(func);
 };
 var funcManager = {
   render(func) {
-    cradovaEvent.compId += 1;
-    func.id = cradovaEvent.compId;
-    func.effects = [];
-    func.rendered = false;
-    func._state_index = 0;
-    func._state = [];
+    Object.assign(func, DEFAULT_STATE);
     const html = func.apply(func);
     if (html instanceof HTMLElement) {
       func.reference = html;
@@ -329,7 +322,6 @@ var raw = (html) => {
 
 // src/primitives/classes.ts
 class cradovaEvent {
-  static compId = 0;
   after_comp_is_mounted = [];
   after_page_is_killed = [];
   dispatchEvent(eventName) {
@@ -381,19 +373,19 @@ class Signal {
       localStorage.setItem(this.pn, JSON.stringify(this.pipe));
     }
   }
-  publishObject(events) {
-    const s = new Map;
+  batchPublish(events) {
+    const s = new Set;
     for (const [eventName, data] of Object.entries(events)) {
       this.pipe[eventName] = data;
       const subs = this.subs[eventName] || [];
       for (let i2 = 0;i2 < subs.length; i2++) {
         const c = subs[i2];
         c.pipes.set(eventName, this.pipe[eventName]);
-        s.set(c.id, c);
+        s.add(c);
       }
     }
-    for (const [_, c] of s) {
-      c.recall();
+    for (const c of s.values()) {
+      funcManager.recall(c);
     }
     if (this.pn) {
       localStorage.setItem(this.pn, JSON.stringify(this.pipe));
@@ -413,9 +405,8 @@ class Signal {
       } else {
         console.error(` ✘  Cradova err:  ${String(eventName)} is not a valid event for this Signal`);
       }
-      if (this.subs[eventName]?.find((cmp) => cmp.id === comp.id)) {
+      if (comp.signals.get(eventName))
         return;
-      }
       if (!this.subs[eventName]) {
         this.subs[eventName] = [comp];
       } else {
@@ -439,7 +430,7 @@ class Page {
   _dropped = false;
   _snapshot;
   _snapshot_html;
-  _deCB;
+  _de_active_CB;
   constructor(pageParams) {
     const { template, name } = pageParams;
     if (typeof template !== "function") {
@@ -483,7 +474,7 @@ class Page {
     this._snapshot_html = undefined;
   }
   set onDeactivate(cb) {
-    this._deCB = cb;
+    this._de_active_CB = cb;
   }
   drop(state) {
     if (typeof state === "boolean") {
@@ -567,7 +558,7 @@ class RouterBoxClass {
           this.pageData.params = params;
         }
         await route._activate();
-        this.lastNavigatedRouteController && this.lastNavigatedRouteController._deCB?.();
+        this.lastNavigatedRouteController && this.lastNavigatedRouteController._de_active_CB?.();
         this.lastNavigatedRoute = url;
         this.lastNavigatedRouteController = route;
       } catch (error) {

package/dist/primitives/classes.d.ts

@@ -3,24 +3,25 @@ import type { browserPageType, CradovaPageType } from "./types.js";
  * Cradova event
  */
 export declare class cradovaEvent {
-    static compId: number;
-    /**
-     * the events runs only once and removed to avoid duplication when added on the next rendering
-     * these event are call and removed once when when a Function is rendered to the dom
-     * @param callback
-     */
-    after_comp_is_mounted: Function[];
-    /**
-     * the events runs once after comps unmounts.
-     * these event are called before a Function is rendered to the dom
-     * @param callback
-     */
-    after_page_is_killed: Function[];
-    /**
-     * Dispatch any event
-     * @param eventName
-     */
-    dispatchEvent(eventName: "after_comp_is_mounted" | "after_page_is_killed"): void;
+  /**
+   * the events runs only once and removed to avoid duplication when added on the next rendering
+   * these event are call and removed once when when a Function is rendered to the dom
+   * @param callback
+   */
+  after_comp_is_mounted: Function[];
+  /**
+   * the events runs once after comps unmounts.
+   * these event are called before a Function is rendered to the dom
+   * @param callback
+   */
+  after_page_is_killed: Function[];
+  /**
+   * Dispatch any event
+   * @param eventName
+   */
+  dispatchEvent(
+    eventName: "after_comp_is_mounted" | "after_page_is_killed",
+  ): void;
 }
 export declare const CradovaEvent: cradovaEvent;
 /**
@@ -34,43 +35,41 @@ export declare const CradovaEvent: cradovaEvent;
  * @constructor initial: Record<string, any>, props: {persist}
  */
 export declare class Signal<Type extends Record<string, any>> {
-    private pn?;
-    private subs?;
-    pipe: Type;
-    constructor(initial: Type, props?: {
-        persistName?: string | undefined;
-    });
-    /**
-     *  Cradova Signal
-     * ----
-     *  fires an action if available
-     * @param key - string key of the action
-     * @param data - data for the action
-     */
-    publish<T extends keyof Type>(eventName: T, data: Type[T]): void;
-    /**
-     *  Cradova Signal
-     * ----
-     *  fires an action if available
-     * @param key - string key of the action
-     * @param data - data for the action
-     */
-    publishObject<T extends keyof Type>(events: Record<T, Type[T]>): void;
-    /**
-     *  Cradova Signal
-     * ----
-     *  subscribe to an event
-     *
-     * @param name of event.
-     * @param Func component to bind to.
-     */
-    subscribe<T extends keyof Type>(eventName: T | T[], comp: any): void;
-    /**
-     *  Cradova Signal
-     * ----
-     * clear the history on local storage
-     */
-    clearPersist(): void;
+  private pn?;
+  private subs?;
+  pipe: Type;
+  constructor(initial: Type, props?: {
+    persistName?: string | undefined;
+  });
+  /**
+   *  Cradova Signal
+   * ----
+   *  fires an action if available
+   * @param key - string key of the action
+   * @param data - data for the action
+   */
+  publish<T extends keyof Type>(eventName: T, data: Type[T]): void;
+  /**
+   *  Cradova Signal
+   * ----
+   *  fires actions if any available
+   */
+  batchPublish<T extends keyof Type>(events: Record<T, Type[T]>): void;
+  /**
+   *  Cradova Signal
+   * ----
+   *  subscribe to an event
+   *
+   * @param name of event.
+   * @param Func component to bind to.
+   */
+  subscribe<T extends keyof Type>(eventName: T | T[], comp: any): void;
+  /**
+   *  Cradova Signal
+   * ----
+   * clear the history on local storage
+   */
+  clearPersist(): void;
 }
 /**
  *  Cradova Page
@@ -80,24 +79,22 @@ export declare class Signal<Type extends Record<string, any>> {
  * @param template
  */
 export declare class Page {
-    /**
-     * used internally
-     */
-    private _name;
-    /**
-     * this should be a cradova page component
-     */
-    _html: (this: Page) => HTMLElement;
-    _template?: HTMLElement;
-    private _dropped;
-    private _snapshot;
-    private _snapshot_html?;
-    _deCB?: () => Promise<void> | void;
-    constructor(pageParams: CradovaPageType);
-    private _takeSnapShot;
-    set onDeactivate(cb: () => Promise<void> | void);
-    drop(state?: boolean): boolean | undefined;
-    _activate(): Promise<void>;
+  /**
+   * used internally
+   */
+  private _name;
+  _html: (this: Page) => HTMLElement;
+  _template?: HTMLElement;
+  private _dropped;
+  private _snapshot;
+  private _snapshot_html?;
+  _de_active_CB?: () => Promise<void> | void;
+  constructor(pageParams: CradovaPageType);
+  private _takeSnapShot;
+  set onDeactivate(cb: () => Promise<void> | void);
+  drop(state?: boolean): boolean | undefined;
+  /** @internal */
+  _activate(): Promise<void>;
 }
 /** cradova router
  * ---
@@ -107,65 +104,69 @@ export declare class Page {
  * @param  page the cradova document tree for the route.
  */
 export declare class Router {
-    /**
-     * cradova router
-     * ---
-     * Registers a route.
-     *
-     * accepts an object containing pat and page
-     */
-    static BrowserRoutes(obj: Record<string, browserPageType<Page | unknown>>): void;
-    /**
+  /**
+   * cradova router
+   * ---
+   * Registers a route.
+   *
+   * accepts an object containing pat and page
+   */
+  static BrowserRoutes(
+    obj: Record<string, browserPageType<Page | unknown>>,
+  ): void;
+  /**
       Pause navigation
       */
-    static pauseNavigation(): void;
-    /**
+  static pauseNavigation(): void;
+  /**
      resume navigation
     */
-    static resumeNavigation(): void;
-    /**
-     * Cradova Router
-     * ------
-     *
-     * Navigates to a designated page in your app
-     *
-     * @param href string
-     * @param data object
-     * @param force boolean
-     */
-    static navigate(href: string, data?: Record<string, any>): void;
-    /**
-     * Cradova
-     * ---
-     * Loading page for your app
-     *
-     * lazy loaded loading use
-     *
-     * @param page
-     */
-    static setLoadingPage(page: Page): void;
-    /**
-     * Cradova Router
-     * ------
-     *
-     * return last set router params
-     *
-     * .
-     */
-    static get PageData(): {
-        params: Record<string, string>;
-        data?: Record<string, any>;
-    };
-    /**
-     * Cradova
-     * ---
-     * Error Handler for your app
-     *
-     * @param callback
-     * @param path? page path
-     */
-    static addErrorHandler(callback: (err?: unknown, pagePath?: string) => void): void;
-    static _mount(): void;
+  static resumeNavigation(): void;
+  /**
+   * Cradova Router
+   * ------
+   *
+   * Navigates to a designated page in your app
+   *
+   * @param href string
+   * @param data object
+   * @param force boolean
+   */
+  static navigate(href: string, data?: Record<string, any>): void;
+  /**
+   * Cradova
+   * ---
+   * Loading page for your app
+   *
+   * lazy loaded loading use
+   *
+   * @param page
+   */
+  static setLoadingPage(page: Page): void;
+  /**
+   * Cradova Router
+   * ------
+   *
+   * return last set router params
+   *
+   * .
+   */
+  static get PageData(): {
+    params: Record<string, string>;
+    data?: Record<string, any>;
+  };
+  /**
+   * Cradova
+   * ---
+   * Error Handler for your app
+   *
+   * @param callback
+   * @param path? page path
+   */
+  static addErrorHandler(
+    callback: (err?: unknown, pagePath?: string) => void,
+  ): void;
+  static _mount(): void;
 }
 /**
  * Cradova
@@ -173,21 +174,23 @@ export declare class Router {
  * make reference to dom elements
  */
 export declare class __raw_ref {
-    tree: Record<string, any>;
-    /**
-     * Bind a DOM element to a reference name.
-     * @param name - The name to reference the DOM element by.
-     */
-    bindAs(name: string): __raw_ref;
-    /**
-     * Retrieve a referenced DOM element.
-     * @param name - The name of the referenced DOM element.
-     */
-    elem<ElementType extends HTMLElement = HTMLElement>(name: string): ElementType | undefined;
-    /**
-     * Append a DOM element to the reference, overwriting any existing reference.
-     * @param name - The name to reference the DOM element by.
-     * @param element - The DOM element to reference.
-     */
-    _append(name: string, Element: HTMLElement): void;
+  tree: Record<string, any>;
+  /**
+   * Bind a DOM element to a reference name.
+   * @param name - The name to reference the DOM element by.
+   */
+  bindAs(name: string): __raw_ref;
+  /**
+   * Retrieve a referenced DOM element.
+   * @param name - The name of the referenced DOM element.
+   */
+  elem<ElementType extends HTMLElement = HTMLElement>(
+    name: string,
+  ): ElementType | undefined;
+  /**
+   * Append a DOM element to the reference, overwriting any existing reference.
+   * @param name - The name to reference the DOM element by.
+   * @param element - The DOM element to reference.
+   */
+  _append(name: string, Element: HTMLElement): void;
 }

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

@@ -1,38 +1,113 @@
 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 raw: (html: string | TemplateStringsArray) => DocumentFragment;
+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 raw: (
+  html: string | TemplateStringsArray,
+) => DocumentFragment;

package/dist/primitives/functions.d.ts

@@ -1,23 +1,50 @@
-import type { VJS_params_TYPE, CradovaFunc } from "./types.js";
+import type { Func, VJS_params_TYPE } from "./types.js";
 import { __raw_ref } from "./classes.js";
-export declare const makeElement: <E extends HTMLElement>(element: E & HTMLElement, ElementChildrenAndPropertyList: VJS_params_TYPE<E>) => E;
-export declare const cra: <E extends HTMLElement>(tag: string) => (...Children_and_Properties: VJS_params_TYPE<E>) => E;
+export declare const makeElement: <E extends HTMLElement>(
+  element: E & HTMLElement,
+  ElementChildrenAndPropertyList: VJS_params_TYPE<E>,
+) => E;
+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<E extends HTMLElement>(condition: any, ...elements: VJS_params_TYPE<E>): any;
-export declare function $ifelse(condition: any, ifTrue: any, ifFalse?: any): any;
-export declare function $case<E extends HTMLElement = HTMLElement>(value: any, ...elements: VJS_params_TYPE<E>): (key: any) => VJS_params_TYPE<E> | undefined;
-export declare function $switch(key: unknown, ...cases: ((key: any) => any)[]): any;
+export declare function $if<E extends HTMLElement>(
+  condition: any,
+  ...elements: VJS_params_TYPE<E>
+): any;
+export declare function $ifelse(
+  condition: any,
+  ifTrue: any,
+  ifFalse?: any,
+): any;
+export declare function $case<E extends HTMLElement = HTMLElement>(
+  value: any,
+  ...elements: VJS_params_TYPE<E>
+): (key: any) => VJS_params_TYPE<E> | undefined;
+export declare function $switch(
+  key: unknown,
+  ...cases: ((key: any) => any)[]
+): any;
 type LoopData<Type> = Type[];
-export declare function loop<Type>(datalist: LoopData<Type>, component: (value: Type, index?: number, array?: LoopData<Type>) => HTMLElement | DocumentFragment | undefined): HTMLElement[] | undefined;
+export declare function loop<Type>(
+  datalist: LoopData<Type>,
+  component: (
+    value: Type,
+    index?: number,
+    array?: LoopData<Type>,
+  ) => HTMLElement | DocumentFragment | undefined,
+): HTMLElement[] | undefined;
 /**
  * Document fragment
  * @param children
  * @returns
  */
-export declare const frag: (children: VJS_params_TYPE<HTMLElement>) => DocumentFragment;
+export declare const frag: (
+  children: VJS_params_TYPE<HTMLElement>,
+) => DocumentFragment;
 /**
  * Cradova
  * ---
@@ -26,7 +53,10 @@ export declare const frag: (children: VJS_params_TYPE<HTMLElement>) => DocumentF
  * @param Func
  * @returns [state, setState]
  */
-export declare function useState<S = unknown>(newState: S, self: any): [S, (newState: S | ((preS: S) => S)) => void];
+export declare function useState<S = unknown>(
+  newState: S,
+  self: any,
+): [S, (newState: S | ((preS: S) => S)) => void];
 /**
  * Cradova
  * ---
@@ -42,13 +72,13 @@ Returns a mutable reference object of dom elements.
  * @returns reference
  */
 export declare function useRef(): __raw_ref;
-export declare const getSignal: (func: CradovaFunc, name: string) => any;
-export declare const sendSignal: (func: CradovaFunc, name: string, data: any) => void;
+export declare const getSignal: (name: string, func: Func) => any;
+export declare const sendSignal: (name: string, data: any, func: Func) => void;
 export declare const funcManager: {
-    render(func: CradovaFunc): HTMLElement;
-    _effect(func: CradovaFunc, fn: () => Promise<void> | void): void;
-    effector(func: CradovaFunc): Promise<void>;
-    recall(func: CradovaFunc): void;
-    activate(func: CradovaFunc): Promise<void>;
+  render(func: Func): HTMLElement;
+  _effect(func: Func, fn: () => Promise<void> | void): void;
+  effector(func: Func): Promise<void>;
+  recall(func: Func): void;
+  activate(func: Func): Promise<void>;
 };
 export {};

package/dist/primitives/types.d.ts

@@ -1,94 +1,119 @@
 import * as CSS from "csstype";
 import { __raw_ref, Page, Signal } from "./classes.js";
-type DataAttributes = {
-    [key: `data-${string}`]: string;
+type Attributes<E> = {
+  src?: string;
+  alt?: string;
+  for?: string;
+  rel?: string;
+  href?: string;
+  type?: string;
+  name?: string;
+  rows?: string;
+  value?: string;
+  accept: string;
+  action?: string;
+  target?: string;
+  method?: string;
+  checked?: boolean;
+  required?: string;
+  frameBorder?: string;
+  placeholder?: string;
+  ref?: __raw_ref;
+  autocomplete?: string;
+  style?: CSS.Properties;
+  recall?: (P: any) => void;
+  [key: `data-${string}` | `data-${string}`]: string | undefined;
+  [key: `on${string}`]: (this: E) => void;
+  /**
+   * Cradova calls this function when this element is rendered on the DOM.
+   */
+  onmount: (this: E) => void;
 };
-type AriaAttributes = {
-    [key: `aria-${string}`]: string;
-};
-type Attributes = {
-    src?: string;
-    alt?: string;
-    for?: string;
-    rel?: string;
-    href?: string;
-    type?: string;
-    name?: string;
-    rows?: string;
-    value?: string;
-    accept: string;
-    action?: string;
-    target?: string;
-    method?: string;
-    checked?: boolean;
-    required?: string;
-    frameBorder?: string;
-    placeholder?: string;
-    ref?: __raw_ref;
-    autocomplete?: string;
-    style?: CSS.Properties;
-    recall?: (P: any) => void;
-    onmount?: (this: HTMLElement & Attributes) => void;
-};
-export type VJS_params_TYPE<E extends HTMLElement> = (string | undefined | HTMLElement | HTMLElement[] | DocumentFragment | DocumentFragment[] | Attributes | Partial<Attributes> | (() => HTMLElement) | Partial<E> | Record<string, (this: E) => void> | Partial<DataAttributes> | Partial<AriaAttributes> | CSS.Properties<string | number>)[];
+export type VJS_params_TYPE<E extends HTMLElement> = (
+  | undefined
+  | string
+  | HTMLElement
+  | HTMLElement[]
+  | DocumentFragment
+  | DocumentFragment[]
+  | (() => HTMLElement)
+  | Partial<Attributes<E>>
+  | Partial<E>
+  | {
+    style: CSS.Properties;
+  }
+)[];
 export interface RouterRouteObject {
-    _html: ((this: Page, data?: unknown) => HTMLElement | DocumentFragment) | HTMLElement | DocumentFragment;
-    _delegatedRoutes: number | boolean;
-    _Activate: (force: boolean) => Promise<void>;
-    _deActivate: (params: object) => void;
-    _package: (params: unknown) => void;
-    _errorHandler: ((err: unknown) => void) | null;
-    _derive(): {
-        _name: string;
-        _callBack: ((cradovaPageSet: HTMLElement) => void | Promise<void>) | undefined;
-        _deCallBack: ((cradovaPageSet: HTMLElement) => void | Promise<void>) | undefined;
-    };
-    _apply_derivation(data: {
-        _name: string;
-        _callBack: ((cradovaPageSet: HTMLElement) => void | Promise<void>) | undefined;
-        _deCallBack: ((cradovaPageSet: HTMLElement) => void | Promise<void>) | undefined;
-    }): unknown;
+  _html:
+    | ((this: Page, data?: unknown) => HTMLElement | DocumentFragment)
+    | HTMLElement
+    | DocumentFragment;
+  _delegatedRoutes: number | boolean;
+  _Activate: (force: boolean) => Promise<void>;
+  _deActivate: (params: object) => void;
+  _package: (params: unknown) => void;
+  _errorHandler: ((err: unknown) => void) | null;
+  _derive(): {
+    _name: string;
+    _callBack:
+      | ((cradovaPageSet: HTMLElement) => void | Promise<void>)
+      | undefined;
+    _deCallBack:
+      | ((cradovaPageSet: HTMLElement) => void | Promise<void>)
+      | undefined;
+  };
+  _apply_derivation(data: {
+    _name: string;
+    _callBack:
+      | ((cradovaPageSet: HTMLElement) => void | Promise<void>)
+      | undefined;
+    _deCallBack:
+      | ((cradovaPageSet: HTMLElement) => void | Promise<void>)
+      | undefined;
+  }): unknown;
 }
 export type CradovaPageType = {
-    /**
-     * Cradova page
-     * ---
-     * title of the page
-     * .
-     */
-    name?: string;
-    /**
-     * Cradova page
-     * ---
-     * The component for the page
-     * @param data
-     * @returns void
-     * .
-     */
-    template: (this: Page) => HTMLElement;
-    /**
-     * Cradova page
-     * ---
-     * a snapshot is the initial render of a page.
-     * snapshot isolation allows for good SEO guarantee with the flexibility of client based rendering
-     * the origin server should accept post requesting to save a snapshot of this page for future use.
-     * the origin server should respond with the snapshot for future request to the page url
-     * the origin server should implement suitable mechanisms to invalidate it's caches
-     */
-    snapshotIsolation?: boolean;
+  /**
+   * Cradova page
+   * ---
+   * title of the page
+   * .
+   */
+  name?: string;
+  /**
+   * Cradova page
+   * ---
+   * The component for the page
+   * @param data
+   * @returns void
+   * .
+   */
+  template: (this: Page) => HTMLElement;
+  /**
+   * Cradova page
+   * ---
+   * a snapshot is the initial render of a page.
+   * snapshot isolation allows for good SEO guarantee with the flexibility of client based rendering
+   * the origin server should accept post requesting to save a snapshot of this page for future use.
+   * the origin server should respond with the snapshot for future request to the page url
+   * the origin server should implement suitable mechanisms to invalidate it's caches
+   */
+  snapshotIsolation?: boolean;
 };
-export type browserPageType<importType = Page> = importType | Promise<importType> | (() => Promise<importType>);
-export type CradovaFunc = {
-    (): HTMLElement;
-    id?: number;
-    rendered: boolean;
-    published: boolean;
-    reference: HTMLElement | null;
-    signals: Map<string, Signal<any>>;
-    pipes: Map<string, any>;
-    _state: unknown[];
-    _state_index: number;
-    effects: (() => Promise<void> | void)[];
-    effectuate: ((this: any) => void) | null;
+export type browserPageType<importType = Page> =
+  | importType
+  | Promise<importType>
+  | (() => Promise<importType>);
+export type Func = {
+  (): HTMLElement;
+  rendered?: boolean;
+  published?: boolean;
+  reference?: HTMLElement | null;
+  signals?: Map<string, Signal<any>>;
+  pipes?: Map<string, any>;
+  effects?: (() => Promise<void> | void)[];
+  effectuate?: ((this: any) => void) | null;
+  _state?: unknown[];
+  _state_index?: number;
 };
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cradova",
-  "version": "3.6.5",
+  "version": "3.6.7",
   "description": "Build Powerful ⚡ Web Apps with Ease",
   "main": "dist/index.js",
   "type": "module",
@@ -18,6 +18,7 @@
     "lint": "eslint . --fix"
   },
   "keywords": [
+    "frontend library",
     "PWA",
     "webapp",
     "SPA",