valyrian.js 7.2.11 → 7.2.12

package/dist/store/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../lib/store/index.ts"],
-  "sourcesContent": ["import { update } from \"valyrian.js\";\n\ninterface StoreOptions {\n  state?: Record<string, unknown> | (() => Record<string, unknown>);\n  getters?: Record<string, Function>;\n  mutations?: Record<string, Function>;\n  actions?: Record<string, Function>;\n}\n\ninterface StoreInstance {\n  // eslint-disable-next-line no-unused-vars\n  new (options: StoreOptions): StoreInstance;\n  state: Record<string, any>;\n  getters?: Record<string, any>;\n  // eslint-disable-next-line no-unused-vars\n  commit: (type: string, ...payload: any[]) => void;\n  // eslint-disable-next-line no-unused-vars\n  dispatch: (type: string, ...payload: any[]) => void;\n}\n\nfunction keyExists(typeOfKey: string, object: Record<string, unknown>, key: string) {\n  if (key in object === false) {\n    throw new Error(`The ${typeOfKey} \"${key}\" does not exists.`);\n  }\n}\n\nfunction deepFreeze(obj: any) {\n  if (typeof obj === \"object\" && obj !== null && !Object.isFrozen(obj)) {\n    if (Array.isArray(obj)) {\n      for (let i = 0, l = obj.length; i < l; i++) {\n        deepFreeze(obj[i]);\n      }\n    } else {\n      let props = Reflect.ownKeys(obj);\n      for (let i = 0, l = props.length; i < l; i++) {\n        deepFreeze(obj[props[i]]);\n      }\n    }\n    Object.freeze(obj);\n  }\n\n  return obj;\n}\n\nlet updateTimeout: any;\nfunction delayedUpdate() {\n  clearTimeout(updateTimeout);\n  updateTimeout = setTimeout(update);\n}\n\nexport const Store = function Store(\n  this: StoreInstance,\n  { state = {}, getters = {}, actions = {}, mutations = {} }: StoreOptions = {}\n) {\n  let frozen = true;\n\n  function isUnfrozen() {\n    if (frozen) {\n      throw new Error(\"You need to commit a mutation to change the state\");\n    }\n  }\n\n  let localState = typeof state === \"function\" ? state() : state;\n\n  this.state = new Proxy(localState || {}, {\n    get: (state, prop: string) => deepFreeze(state[prop]),\n    set: (state, prop: string, value: any) => {\n      isUnfrozen();\n      state[prop] = value;\n      return true;\n    },\n    deleteProperty: (state, prop: string) => {\n      isUnfrozen();\n      Reflect.deleteProperty(state, prop);\n      return true;\n    }\n  });\n\n  this.getters = new Proxy(getters, {\n    get: (getters, getter: string) => {\n      try {\n        return getters[getter](this.state, this.getters);\n      } catch (e) {\n        // Getters should fail silently\n      }\n    }\n  });\n\n  this.commit = (mutation, ...args) => {\n    keyExists(\"mutation\", mutations, mutation);\n    frozen = false;\n    mutations[mutation](this.state, ...args);\n    frozen = true;\n    delayedUpdate();\n  };\n\n  this.dispatch = (action, ...args) => {\n    keyExists(\"action\", actions, action);\n    return Promise.resolve(actions[action](this, ...args));\n  };\n} as unknown as StoreInstance;\n"],
-  "mappings": ";AAAA,SAAS,cAAc;AAoBvB,SAAS,UAAU,WAAmB,QAAiC,KAAa;AAClF,MAAI,OAAO,WAAW,OAAO;AAC3B,UAAM,IAAI,MAAM,OAAO,SAAS,KAAK,GAAG,oBAAoB;AAAA,EAC9D;AACF;AAEA,SAAS,WAAW,KAAU;AAC5B,MAAI,OAAO,QAAQ,YAAY,QAAQ,QAAQ,CAAC,OAAO,SAAS,GAAG,GAAG;AACpE,QAAI,MAAM,QAAQ,GAAG,GAAG;AACtB,eAAS,IAAI,GAAG,IAAI,IAAI,QAAQ,IAAI,GAAG,KAAK;AAC1C,mBAAW,IAAI,CAAC,CAAC;AAAA,MACnB;AAAA,IACF,OAAO;AACL,UAAI,QAAQ,QAAQ,QAAQ,GAAG;AAC/B,eAAS,IAAI,GAAG,IAAI,MAAM,QAAQ,IAAI,GAAG,KAAK;AAC5C,mBAAW,IAAI,MAAM,CAAC,CAAC,CAAC;AAAA,MAC1B;AAAA,IACF;AACA,WAAO,OAAO,GAAG;AAAA,EACnB;AAEA,SAAO;AACT;AAEA,IAAI;AACJ,SAAS,gBAAgB;AACvB,eAAa,aAAa;AAC1B,kBAAgB,WAAW,MAAM;AACnC;AAEO,IAAM,QAAQ,SAASA,OAE5B,EAAE,QAAQ,CAAC,GAAG,UAAU,CAAC,GAAG,UAAU,CAAC,GAAG,YAAY,CAAC,EAAE,IAAkB,CAAC,GAC5E;AACA,MAAI,SAAS;AAEb,WAAS,aAAa;AACpB,QAAI,QAAQ;AACV,YAAM,IAAI,MAAM,mDAAmD;AAAA,IACrE;AAAA,EACF;AAEA,MAAI,aAAa,OAAO,UAAU,aAAa,MAAM,IAAI;AAEzD,OAAK,QAAQ,IAAI,MAAM,cAAc,CAAC,GAAG;AAAA,IACvC,KAAK,CAACC,QAAO,SAAiB,WAAWA,OAAM,IAAI,CAAC;AAAA,IACpD,KAAK,CAACA,QAAO,MAAc,UAAe;AACxC,iBAAW;AACX,MAAAA,OAAM,IAAI,IAAI;AACd,aAAO;AAAA,IACT;AAAA,IACA,gBAAgB,CAACA,QAAO,SAAiB;AACvC,iBAAW;AACX,cAAQ,eAAeA,QAAO,IAAI;AAClC,aAAO;AAAA,IACT;AAAA,EACF,CAAC;AAED,OAAK,UAAU,IAAI,MAAM,SAAS;AAAA,IAChC,KAAK,CAACC,UAAS,WAAmB;AAChC,UAAI;AACF,eAAOA,SAAQ,MAAM,EAAE,KAAK,OAAO,KAAK,OAAO;AAAA,MACjD,SAAS,GAAG;AAAA,MAEZ;AAAA,IACF;AAAA,EACF,CAAC;AAED,OAAK,SAAS,CAAC,aAAa,SAAS;AACnC,cAAU,YAAY,WAAW,QAAQ;AACzC,aAAS;AACT,cAAU,QAAQ,EAAE,KAAK,OAAO,GAAG,IAAI;AACvC,aAAS;AACT,kBAAc;AAAA,EAChB;AAEA,OAAK,WAAW,CAAC,WAAW,SAAS;AACnC,cAAU,UAAU,SAAS,MAAM;AACnC,WAAO,QAAQ,QAAQ,QAAQ,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;AAAA,EACvD;AACF;",
+  "sourcesContent": ["import { update } from \"valyrian.js\";\n\ninterface StoreOptions {\n  state?: Record<string, unknown> | (() => Record<string, unknown>);\n  getters?: Record<string, Function>;\n  mutations?: Record<string, Function>;\n  actions?: Record<string, Function>;\n}\n\ninterface StoreInstance {\n  // eslint-disable-next-line no-unused-vars\n  new (options: StoreOptions): StoreInstance;\n  state: Record<string, any>;\n  getters?: Record<string, any>;\n  // eslint-disable-next-line no-unused-vars\n  commit: (type: string, ...payload: any[]) => void;\n  // eslint-disable-next-line no-unused-vars\n  dispatch: (type: string, ...payload: any[]) => void;\n}\n\nfunction keyExists(typeOfKey: string, object: Record<string, unknown>, key: string) {\n  if (key in object === false) {\n    throw new Error(`The ${typeOfKey} \"${key}\" does not exists.`);\n  }\n}\n\nfunction deepFreeze(obj: any) {\n  if (typeof obj === \"object\" && obj !== null && !Object.isFrozen(obj)) {\n    if (Array.isArray(obj)) {\n      for (let i = 0, l = obj.length; i < l; i++) {\n        deepFreeze(obj[i]);\n      }\n    } else {\n      const props = Reflect.ownKeys(obj);\n      for (let i = 0, l = props.length; i < l; i++) {\n        deepFreeze(obj[props[i]]);\n      }\n    }\n    Object.freeze(obj);\n  }\n\n  return obj;\n}\n\nlet updateTimeout: any;\nfunction delayedUpdate() {\n  clearTimeout(updateTimeout);\n  updateTimeout = setTimeout(update);\n}\n\nexport const Store = function Store(\n  this: StoreInstance,\n  { state = {}, getters = {}, actions = {}, mutations = {} }: StoreOptions = {}\n) {\n  let frozen = true;\n\n  function isUnfrozen() {\n    if (frozen) {\n      throw new Error(\"You need to commit a mutation to change the state\");\n    }\n  }\n\n  const localState = typeof state === \"function\" ? state() : state;\n\n  this.state = new Proxy(localState || {}, {\n    get: (state, prop: string) => deepFreeze(state[prop]),\n    set: (state, prop: string, value: any) => {\n      isUnfrozen();\n      state[prop] = value;\n      return true;\n    },\n    deleteProperty: (state, prop: string) => {\n      isUnfrozen();\n      Reflect.deleteProperty(state, prop);\n      return true;\n    }\n  });\n\n  this.getters = new Proxy(getters, {\n    get: (getters, getter: string) => {\n      try {\n        return getters[getter](this.state, this.getters);\n      } catch (e) {\n        // Getters should fail silently\n      }\n    }\n  });\n\n  this.commit = (mutation, ...args) => {\n    keyExists(\"mutation\", mutations, mutation);\n    frozen = false;\n    mutations[mutation](this.state, ...args);\n    frozen = true;\n    delayedUpdate();\n  };\n\n  this.dispatch = (action, ...args) => {\n    keyExists(\"action\", actions, action);\n    return Promise.resolve(actions[action](this, ...args));\n  };\n} as unknown as StoreInstance;\n"],
+  "mappings": ";AAAA,SAAS,cAAc;AAoBvB,SAAS,UAAU,WAAmB,QAAiC,KAAa;AAClF,MAAI,OAAO,WAAW,OAAO;AAC3B,UAAM,IAAI,MAAM,OAAO,SAAS,KAAK,GAAG,oBAAoB;AAAA,EAC9D;AACF;AAEA,SAAS,WAAW,KAAU;AAC5B,MAAI,OAAO,QAAQ,YAAY,QAAQ,QAAQ,CAAC,OAAO,SAAS,GAAG,GAAG;AACpE,QAAI,MAAM,QAAQ,GAAG,GAAG;AACtB,eAAS,IAAI,GAAG,IAAI,IAAI,QAAQ,IAAI,GAAG,KAAK;AAC1C,mBAAW,IAAI,CAAC,CAAC;AAAA,MACnB;AAAA,IACF,OAAO;AACL,YAAM,QAAQ,QAAQ,QAAQ,GAAG;AACjC,eAAS,IAAI,GAAG,IAAI,MAAM,QAAQ,IAAI,GAAG,KAAK;AAC5C,mBAAW,IAAI,MAAM,CAAC,CAAC,CAAC;AAAA,MAC1B;AAAA,IACF;AACA,WAAO,OAAO,GAAG;AAAA,EACnB;AAEA,SAAO;AACT;AAEA,IAAI;AACJ,SAAS,gBAAgB;AACvB,eAAa,aAAa;AAC1B,kBAAgB,WAAW,MAAM;AACnC;AAEO,IAAM,QAAQ,SAASA,OAE5B,EAAE,QAAQ,CAAC,GAAG,UAAU,CAAC,GAAG,UAAU,CAAC,GAAG,YAAY,CAAC,EAAE,IAAkB,CAAC,GAC5E;AACA,MAAI,SAAS;AAEb,WAAS,aAAa;AACpB,QAAI,QAAQ;AACV,YAAM,IAAI,MAAM,mDAAmD;AAAA,IACrE;AAAA,EACF;AAEA,QAAM,aAAa,OAAO,UAAU,aAAa,MAAM,IAAI;AAE3D,OAAK,QAAQ,IAAI,MAAM,cAAc,CAAC,GAAG;AAAA,IACvC,KAAK,CAACC,QAAO,SAAiB,WAAWA,OAAM,IAAI,CAAC;AAAA,IACpD,KAAK,CAACA,QAAO,MAAc,UAAe;AACxC,iBAAW;AACX,MAAAA,OAAM,IAAI,IAAI;AACd,aAAO;AAAA,IACT;AAAA,IACA,gBAAgB,CAACA,QAAO,SAAiB;AACvC,iBAAW;AACX,cAAQ,eAAeA,QAAO,IAAI;AAClC,aAAO;AAAA,IACT;AAAA,EACF,CAAC;AAED,OAAK,UAAU,IAAI,MAAM,SAAS;AAAA,IAChC,KAAK,CAACC,UAAS,WAAmB;AAChC,UAAI;AACF,eAAOA,SAAQ,MAAM,EAAE,KAAK,OAAO,KAAK,OAAO;AAAA,MACjD,SAAS,GAAG;AAAA,MAEZ;AAAA,IACF;AAAA,EACF,CAAC;AAED,OAAK,SAAS,CAAC,aAAa,SAAS;AACnC,cAAU,YAAY,WAAW,QAAQ;AACzC,aAAS;AACT,cAAU,QAAQ,EAAE,KAAK,OAAO,GAAG,IAAI;AACvC,aAAS;AACT,kBAAc;AAAA,EAChB;AAEA,OAAK,WAAW,CAAC,WAAW,SAAS;AACnC,cAAU,UAAU,SAAS,MAAM;AACnC,WAAO,QAAQ,QAAQ,QAAQ,MAAM,EAAE,MAAM,GAAG,IAAI,CAAC;AAAA,EACvD;AACF;",
   "names": ["Store", "state", "getters"]
 }

package/lib/dataset/index.ts

@@ -1,4 +1,4 @@
-import { VnodeInterface, VnodeWithDom, createDomElement, directive, patch, updateAttributes } from "valyrian.js";
+import { VnodeWithDom, createElement, directive, patch, updateAttributes } from "valyrian.js";
 
 interface DataSetInterface<T> {
   data: T[];
@@ -13,7 +13,7 @@ interface DataSetInterface<T> {
 }
 interface DataSetHandler<T> {
   // eslint-disable-next-line no-unused-vars
-  (data: T, index: number): VnodeInterface;
+  (data: T, index: number): VnodeWithDom;
 }
 
 function deepFreeze(obj: any) {
@@ -23,7 +23,7 @@ function deepFreeze(obj: any) {
         deepFreeze(obj[i]);
       }
     } else {
-      let props = Reflect.ownKeys(obj);
+      const props = Reflect.ownKeys(obj);
       for (let i = 0, l = props.length; i < l; i++) {
         deepFreeze(obj[props[i]]);
       }
@@ -90,8 +90,8 @@ export class DataSet<T> implements DataSetInterface<T> {
       return;
     }
 
-    let vnode = this.#vnode;
-    let handler = this.#handler;
+    const vnode = this.#vnode;
+    const handler = this.#handler;
 
     if (data.length === 0) {
       vnode.children = [];
@@ -99,24 +99,24 @@ export class DataSet<T> implements DataSetInterface<T> {
       return;
     }
 
-    let childrenLength = vnode.children.length;
+    const childrenLength = vnode.children.length;
     for (let i = 0, l = data.length; i < l; i++) {
-      let child = handler(this.data[i], i);
+      const child = handler(this.data[i], i);
 
       if (i < childrenLength) {
-        let oldChild = vnode.children[i];
+        const oldChild = vnode.children[i];
         child.isSVG = oldChild.isSVG;
         child.dom = oldChild.dom;
-        updateAttributes(child as VnodeWithDom, oldChild);
+        updateAttributes(child as VnodeWithDom, null);
         vnode.children[i] = child;
-        patch(child as VnodeWithDom, oldChild);
+        patch(child as VnodeWithDom);
         continue;
       }
 
       child.isSVG = vnode.isSVG || child.tag === "svg";
-      child.dom = createDomElement(child.tag as string, child.isSVG);
+      child.dom = createElement(child.tag as string, child.isSVG);
       vnode.dom.appendChild(child.dom);
-      updateAttributes(child as VnodeWithDom);
+      updateAttributes(child as VnodeWithDom, null);
       vnode.children.push(child);
       patch(child as VnodeWithDom);
     }
@@ -129,7 +129,7 @@ export class DataSet<T> implements DataSetInterface<T> {
 
   add(...data: T[]) {
     if (this.#data) {
-      let oldLength = this.#data.length;
+      const oldLength = this.#data.length;
       if (this.#isFrozen) {
         this.#setData([...this.#data, ...data]);
       } else {
@@ -140,15 +140,15 @@ export class DataSet<T> implements DataSetInterface<T> {
         return;
       }
 
-      let vnode = this.#vnode;
-      let handler = this.#handler;
+      const vnode = this.#vnode;
+      const handler = this.#handler;
 
       for (let i = 0, ii = oldLength, l = data.length; i < l; i++, ii++) {
-        let child = handler(this.#data[i], ii);
+        const child = handler(this.#data[i], ii);
         child.isSVG = vnode.isSVG || child.tag === "svg";
-        child.dom = createDomElement(child.tag as string, child.isSVG);
+        child.dom = createElement(child.tag as string, child.isSVG);
         vnode.dom.appendChild(child.dom);
-        updateAttributes(child as VnodeWithDom);
+        updateAttributes(child as VnodeWithDom, null);
         vnode.children.push(child);
         patch(child as VnodeWithDom);
       }
@@ -157,7 +157,7 @@ export class DataSet<T> implements DataSetInterface<T> {
 
   delete(index: number) {
     if (this.#data && this.#vnode) {
-      let child = this.#vnode.children[index];
+      const child = this.#vnode.children[index];
       if (this.#isFrozen) {
         this.#setData(this.data.filter((_, i) => i !== index));
       } else {
@@ -171,23 +171,23 @@ export class DataSet<T> implements DataSetInterface<T> {
 
   update(index: number, item: Partial<T>) {
     if (this.#data && this.#vnode && this.#handler) {
-      let child = this.#vnode.children[index];
+      const child = this.#vnode.children[index];
       if (this.#isFrozen) {
         this.#setData(this.#data.map((d, i) => (i === index ? { ...d, ...item } : d)));
       } else {
         this.#data[index] = { ...this.#data[index], ...item };
       }
-      let newChild = this.#handler(this.#data[index], index);
+      const newChild = this.#handler(this.#data[index], index);
       newChild.isSVG = this.#vnode.isSVG || newChild.tag === "svg";
       newChild.dom = child.dom;
       this.#vnode.children[index] = newChild;
-      updateAttributes(newChild as VnodeWithDom, child);
-      patch(newChild as VnodeWithDom, child);
+      updateAttributes(newChild as VnodeWithDom, null);
+      patch(newChild as VnodeWithDom);
     }
   }
 }
 
-directive("with-dataset", (dataSet, vnode) => {
-  dataSet.setVnodeAndHandler(vnode as VnodeWithDom, vnode.children[0]);
+directive("with-dataset", (dataSet: DataSet<any>, vnode: VnodeWithDom) => {
+  dataSet.setVnodeAndHandler(vnode, vnode.children[0]);
   return false;
 });

package/lib/hooks/index.ts

@@ -1,10 +1,4 @@
-import { Component, POJOComponent, VnodeWithDom, current, directive, onCleanup, onUnmount, update } from "valyrian.js";
-
-interface CurrentOnPatch {
-  component: Component | POJOComponent;
-  vnode: VnodeWithDom;
-  oldVnode: VnodeWithDom;
-}
+import { Component, POJOComponent, current, directive, onCleanup, onUnmount, update } from "valyrian.js";
 
 export type Hook = any;
 
@@ -26,6 +20,13 @@ export interface CreateHook {
   (HookDefinition: HookDefinition): (...args: any[]) => any;
 }
 
+type HookCalls = {
+  hooks: Hook[];
+  hook_calls: number;
+};
+
+const componentToHooksWeakMap = new WeakMap<Component | POJOComponent, HookCalls>();
+
 export const createHook = function createHook({
   onCreate,
   onUpdate: onUpdateHook,
@@ -34,62 +35,33 @@ export const createHook = function createHook({
   returnValue
 }: HookDefinition): Hook {
   return (...args: any[]) => {
-    let { component, vnode } = current as CurrentOnPatch;
-
+    const component = current.component as Component | POJOComponent;
     let hook: any = null;
 
-    if (vnode) {
-      // Init the components array for the current vnode
-      if (!vnode.components) {
-        vnode.components = [];
-      }
+    if (componentToHooksWeakMap.has(component) === false) {
+      const HookCalls = { hooks: [], hook_calls: -1 };
+      componentToHooksWeakMap.set(component, HookCalls);
+      onUnmount(() => componentToHooksWeakMap.delete(component));
+    }
 
-      if (vnode.components.indexOf(component) === -1) {
-        vnode.hook_calls = -1;
-        vnode.components.push(component);
-        if (!component.hooks) {
-          component.hooks = [];
-          onUnmount(() => Reflect.deleteProperty(component, "hooks"));
-        }
-      }
+    const HookCalls = componentToHooksWeakMap.get(component) as HookCalls;
+    onCleanup(() => (HookCalls.hook_calls = -1));
+
+    hook = HookCalls.hooks[++HookCalls.hook_calls];
 
-      hook = component.hooks[++vnode.hook_calls];
+    if (hook) {
+      onUpdateHook && onUpdateHook(hook, ...args);
     }
 
     // If the hook doesn't exist, create it
     if (!hook) {
-      // create a new hook
       hook = onCreate(...args);
-
-      if (vnode) {
-        // Add the hook to the component
-        component.hooks.push(hook);
-      }
-
-      // if we have a onRemove hook, add it to the onUnmount set
-      if (onRemove) {
-        // Add the hook to the onRemove array
-        onUnmount(() => onRemove(hook));
-      }
-    } else {
-      if (onUpdateHook) {
-        onUpdateHook(hook, ...args);
-      }
+      HookCalls.hooks.push(hook);
+      onRemove && onUnmount(() => onRemove(hook));
     }
 
-    // If we have an onCleanup function, add it to the cleanup set
-    if (onCleanupHook) {
-      // Add the hook to the onCleanup set
-      onCleanup(() => onCleanupHook(hook));
-    }
-
-    // If we have a returnValue function, call it and return the result instead of the hook
-    if (returnValue) {
-      return returnValue(hook);
-    }
-
-    // Return the hook
-    return hook;
+    onCleanupHook && onCleanup(() => onCleanupHook(hook));
+    return returnValue ? returnValue(hook) : hook;
   };
 } as unknown as CreateHook;
 
@@ -110,7 +82,6 @@ export const useState = createHook({
     get.toString = () => `${value}`;
 
     function set(newValue: any) {
-      // Prevent default event if it exists
       if (current.event) {
         current.event.preventDefault();
       }
@@ -129,7 +100,7 @@ export const useState = createHook({
 // Effect hook
 export const useEffect = createHook({
   onCreate: (effect: Function, changes: any[]) => {
-    let hook: {
+    const hook: {
       effect: Function;
       prev: any[];
       onRemove?: Function;