veles 0.0.2 → 0.0.3

package/dist/index.cjs

@@ -53,6 +53,20 @@ function getComponentVelesNode(component) {
   }
   return { velesElementNode: childNode, componentsTree };
 }
+function callMountHandlers(component) {
+  if ("velesStringElement" in component) {
+    return;
+  }
+  if ("velesComponent" in component) {
+    component._privateMethods._callMountHandlers();
+    callMountHandlers(component.tree);
+  }
+  if ("velesNode" in component) {
+    component.childComponents.forEach(
+      (childComponent) => callMountHandlers(childComponent)
+    );
+  }
+}
 function identity(value1, value2) {
   return value1 === value2;
 }
@@ -72,6 +86,9 @@ function parseChildren({
       if (typeof childComponent === "string") {
         const text = document.createTextNode(childComponent);
         htmlElement.append(text);
+      } else if (typeof childComponent === "number") {
+        const text = document.createTextNode(String(childComponent));
+        htmlElement.append(text);
       } else if (typeof childComponent === "object" && childComponent && "velesNode" in childComponent && (childComponent == null ? void 0 : childComponent.velesNode)) {
         if (childComponent.phantom) {
           childComponent.childComponents.forEach((childComponentofPhantom) => {
@@ -79,14 +96,13 @@ function parseChildren({
               htmlElement.append(childComponentofPhantom.html);
               childComponentofPhantom.parentVelesElement = velesNode;
             } else {
-              const { componentsTree, velesElementNode } = getComponentVelesNode(childComponentofPhantom);
+              const { velesElementNode } = getComponentVelesNode(
+                childComponentofPhantom
+              );
               if (!velesElementNode) {
                 console.error("can't find HTML tree in a component chain");
               } else {
                 htmlElement.append(velesElementNode.html);
-                componentsTree.forEach((component) => {
-                  component._privateMethods._callMountHandlers();
-                });
                 velesElementNode.parentVelesElement = velesNode;
               }
             }
@@ -115,11 +131,6 @@ function parseChildren({
                     console.error("can't find HTML tree in a component chain");
                   } else {
                     htmlElement.append(velesElementNode2.html);
-                    setTimeout(() => {
-                      componentsTree2.forEach((component) => {
-                        component._privateMethods._callMountHandlers();
-                      });
-                    }, 0);
                     velesElementNode2.parentVelesElement = velesNode;
                   }
                 }
@@ -128,11 +139,6 @@ function parseChildren({
           } else {
             htmlElement.append(velesElementNode.html);
           }
-          setTimeout(() => {
-            componentsTree.forEach((component) => {
-              component._privateMethods._callMountHandlers();
-            });
-          }, 0);
           velesElementNode.parentVelesElement = velesNode;
           childComponents.push(childComponent);
         }
@@ -229,7 +235,12 @@ function parseComponent({
         componentAPI.onUnmount(cb);
       },
       _callMountHandlers: () => {
-        componentMountCbs.forEach((cb) => cb());
+        componentMountCbs.forEach((cb) => {
+          const mountCbResult = cb();
+          if (typeof mountCbResult === "function") {
+            componentAPI.onUnmount(mountCbResult);
+          }
+        });
       },
       _callUnmountHandlers: () => {
         componentUnmountCbs.forEach((cb) => cb());
@@ -292,6 +303,7 @@ function attachComponent({
   const wrappedApp = createElement("div", { children: [component] });
   const { velesElementNode } = getComponentVelesNode(wrappedApp);
   htmlElement.appendChild(velesElementNode.html);
+  callMountHandlers(wrappedApp);
   return () => {
     velesElementNode.html.remove();
   };
@@ -357,18 +369,19 @@ function createState(initialValue, subscribeCallback) {
     },
     useValueSelector(selector, cb, comparator = identity) {
       const selectedValue = selector ? selector(value) : value;
-      const returnedNode = cb(selectedValue);
+      const returnedNode = cb ? cb(selectedValue) : String(selectedValue);
       const node = !returnedNode || typeof returnedNode === "string" ? createTextElement(returnedNode) : returnedNode;
-      trackingSelectorElements.push({
+      const trackingSelectorElement = {
         selector,
         selectedValue,
         cb,
         node,
         comparator
-      });
+      };
+      trackingSelectorElements.push(trackingSelectorElement);
       node._privateMethods._addUnmountHandler(() => {
         trackingSelectorElements = trackingSelectorElements.filter(
-          (trackingSelectorElement) => trackingSelectorElement.cb !== cb
+          (el) => trackingSelectorElement !== el
         );
       });
       return node;
@@ -425,12 +438,13 @@ function createState(initialValue, subscribeCallback) {
       return wrapperComponent;
     },
     useAttribute: (cb) => {
-      const attributeValue = cb(value);
+      const attributeValue = cb ? cb(value) : String(value);
       const attributeHelper = (htmlElement, attributeName, node) => {
-        trackingAttributes.push({ cb, htmlElement, attributeName });
+        const trackingElement = { cb, htmlElement, attributeName };
+        trackingAttributes.push(trackingElement);
         node._privateMethods._addUnmountHandler(() => {
           trackingAttributes = trackingAttributes.filter(
-            (trackingAttribute) => trackingAttribute.cb !== cb
+            (trackingAttribute) => trackingAttribute !== trackingElement
           );
         });
         return attributeValue;
@@ -449,7 +463,10 @@ function createState(initialValue, subscribeCallback) {
     // gives the latest value to ensure no outdated data
     // can be used for the state
     setValue: (newValueCB) => {
-      const newValue = newValueCB(value);
+      const newValue = (
+        // @ts-expect-error
+        typeof newValueCB === "function" ? newValueCB(value) : newValueCB
+      );
       if (newValue !== value) {
         previousValue = value;
         value = newValue;
@@ -466,11 +483,18 @@ function createState(initialValue, subscribeCallback) {
           if (comparator(selectedValue, newSelectedValue)) {
             return selectorTrackingElement;
           }
-          const returnednewNode = cb(newSelectedValue);
+          const returnednewNode = cb ? cb(newSelectedValue) : String(newSelectedValue);
           const newNode = !returnednewNode || typeof returnednewNode === "string" ? createTextElement(returnednewNode) : returnednewNode;
           const { velesElementNode: oldVelesElementNode } = getComponentVelesNode(node);
           const { velesElementNode: newVelesElementNode } = getComponentVelesNode(newNode);
           const parentVelesElement = oldVelesElementNode.parentVelesElement;
+          const newTrackingSelectorElement = {
+            selector,
+            selectedValue: newSelectedValue,
+            cb,
+            node: newNode,
+            comparator
+          };
           if (parentVelesElement) {
             newVelesElementNode.parentVelesElement = parentVelesElement;
             parentVelesElement.html.replaceChild(
@@ -481,32 +505,20 @@ function createState(initialValue, subscribeCallback) {
               (childComponent) => childComponent === node ? newNode : node
             );
             node._privateMethods._callUnmountHandlers();
-            trackingSelectorElements.push({
-              selector,
-              selectedValue: newSelectedValue,
-              cb,
-              node: newNode,
-              comparator
-            });
+            callMountHandlers(newNode);
             newNode._privateMethods._addUnmountHandler(() => {
               trackingSelectorElements = trackingSelectorElements.filter(
-                (trackingSelectorElement) => trackingSelectorElement.cb !== cb
+                (el) => el !== newTrackingSelectorElement
               );
             });
           } else {
             console.log("parent node was not found");
           }
-          return {
-            selectedValue: newSelectedValue,
-            selector,
-            cb,
-            node: newNode,
-            comparator
-          };
+          return newTrackingSelectorElement;
         }
       );
       trackingAttributes.forEach(({ cb, htmlElement, attributeName }) => {
-        const newAttributeValue = cb(value);
+        const newAttributeValue = cb ? cb(value) : String(value);
         htmlElement.setAttribute(attributeName, newAttributeValue);
       });
       trackingEffects.forEach((trackingEffect) => {
@@ -649,6 +661,7 @@ function createState(initialValue, subscribeCallback) {
               offset = offset + 1;
               currentElement = newNodeVelesElement.html;
               newElementsCount = newElementsCount + 1;
+              callMountHandlers(newNode);
             }
           });
           if (renderedElements.length === newRenderedElements.length + newElementsCount) {
@@ -724,4 +737,3 @@ function Fragment({ children }) {
   onMount,
   onUnmount
 });
-//# sourceMappingURL=index.cjs.map

package/dist/index.d.cts

@@ -1,5 +1,5 @@
-import { V as VelesElement, a as VelesComponent, b as VelesStringElement } from './jsx-runtime-vDysOz5d.cjs';
-export { F as Fragment, c as createElement } from './jsx-runtime-vDysOz5d.cjs';
+import { V as VelesElement, a as VelesComponent, b as VelesStringElement } from './jsx-runtime-C2XLvZ55.cjs';
+export { F as Fragment, c as createElement } from './jsx-runtime-C2XLvZ55.cjs';
 
 declare function attachComponent({ htmlElement, component, }: {
     htmlElement: HTMLElement;
@@ -21,9 +21,9 @@ type State<ValueType> = {
         skipFirstCall?: boolean;
         comparator?: (value1: SelectorValueType, value2: SelectorValueType) => boolean;
     }): void;
-    useValue(cb: (value: ValueType) => VelesElement | VelesComponent | string | undefined | null, comparator?: (value1: ValueType, value2: ValueType) => boolean): VelesElement | VelesComponent | VelesStringElement;
-    useValueSelector<SelectorValueType>(selector: (value: ValueType) => SelectorValueType, cb: (value: SelectorValueType) => VelesElement | VelesComponent | string | undefined | null, comparator?: (value1: SelectorValueType, value2: SelectorValueType) => boolean): VelesElement | VelesComponent | VelesStringElement;
-    useAttribute(cb: (value: ValueType) => string): AttributeHelper;
+    useValue(cb?: (value: ValueType) => VelesElement | VelesComponent | string | undefined | null, comparator?: (value1: ValueType, value2: ValueType) => boolean): VelesElement | VelesComponent | VelesStringElement;
+    useValueSelector<SelectorValueType>(selector: (value: ValueType) => SelectorValueType, cb?: (value: SelectorValueType) => VelesElement | VelesComponent | string | undefined | null, comparator?: (value1: SelectorValueType, value2: SelectorValueType) => boolean): VelesElement | VelesComponent | VelesStringElement;
+    useAttribute(cb?: (value: ValueType) => string): AttributeHelper;
     useValueIterator<Element>(options: {
         key: string | ((options: {
             element: Element;
@@ -36,7 +36,7 @@ type State<ValueType> = {
     }) => VelesElement | VelesComponent): VelesComponent | VelesElement | null;
     getValue(): ValueType;
     getPreviousValue(): undefined | ValueType;
-    setValue(newValueCB: (currentValue: ValueType) => ValueType): void;
+    setValue(newValueCB: ((currentValue: ValueType) => ValueType) | ValueType): void;
     _triggerUpdates(): void;
 };
 declare function createState<T>(initialValue: T, subscribeCallback?: (setValue: ReturnType<typeof createState<T>>["setValue"]) => Function): State<T>;
@@ -52,7 +52,7 @@ declare function combineState<A, B, C, D, E, F, G, H>(state1: createdState<A>, s
 declare function combineState<A, B, C, D, E, F, G, H, I>(state1: createdState<A>, state2: createdState<B>, state3: createdState<C>, state4: createdState<D>, state5: createdState<E>, state6: createdState<F>, state7: createdState<G>, state8: createdState<H>, state9: createdState<I>): createdState<[A, B, C, D, E, F, G, H, I]>;
 declare function combineState<A, B, C, D, E, F, G, H, I, J>(state1: createdState<A>, state2: createdState<B>, state3: createdState<C>, state4: createdState<D>, state5: createdState<E>, state6: createdState<F>, state7: createdState<G>, state8: createdState<H>, state9: createdState<I>, state10: createdState<J>): createdState<[A, B, C, D, E, F, G, H, I, J]>;
 
-declare function onMount(cb: Function): void;
+declare function onMount(cb: () => void | Function): void;
 declare function onUnmount(cb: Function): void;
 
 declare function createRef<T>(initialRefValue?: T | null): {

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import { V as VelesElement, a as VelesComponent, b as VelesStringElement } from './jsx-runtime-vDysOz5d.js';
-export { F as Fragment, c as createElement } from './jsx-runtime-vDysOz5d.js';
+import { V as VelesElement, a as VelesComponent, b as VelesStringElement } from './jsx-runtime-C2XLvZ55.js';
+export { F as Fragment, c as createElement } from './jsx-runtime-C2XLvZ55.js';
 
 declare function attachComponent({ htmlElement, component, }: {
     htmlElement: HTMLElement;
@@ -21,9 +21,9 @@ type State<ValueType> = {
         skipFirstCall?: boolean;
         comparator?: (value1: SelectorValueType, value2: SelectorValueType) => boolean;
     }): void;
-    useValue(cb: (value: ValueType) => VelesElement | VelesComponent | string | undefined | null, comparator?: (value1: ValueType, value2: ValueType) => boolean): VelesElement | VelesComponent | VelesStringElement;
-    useValueSelector<SelectorValueType>(selector: (value: ValueType) => SelectorValueType, cb: (value: SelectorValueType) => VelesElement | VelesComponent | string | undefined | null, comparator?: (value1: SelectorValueType, value2: SelectorValueType) => boolean): VelesElement | VelesComponent | VelesStringElement;
-    useAttribute(cb: (value: ValueType) => string): AttributeHelper;
+    useValue(cb?: (value: ValueType) => VelesElement | VelesComponent | string | undefined | null, comparator?: (value1: ValueType, value2: ValueType) => boolean): VelesElement | VelesComponent | VelesStringElement;
+    useValueSelector<SelectorValueType>(selector: (value: ValueType) => SelectorValueType, cb?: (value: SelectorValueType) => VelesElement | VelesComponent | string | undefined | null, comparator?: (value1: SelectorValueType, value2: SelectorValueType) => boolean): VelesElement | VelesComponent | VelesStringElement;
+    useAttribute(cb?: (value: ValueType) => string): AttributeHelper;
     useValueIterator<Element>(options: {
         key: string | ((options: {
             element: Element;
@@ -36,7 +36,7 @@ type State<ValueType> = {
     }) => VelesElement | VelesComponent): VelesComponent | VelesElement | null;
     getValue(): ValueType;
     getPreviousValue(): undefined | ValueType;
-    setValue(newValueCB: (currentValue: ValueType) => ValueType): void;
+    setValue(newValueCB: ((currentValue: ValueType) => ValueType) | ValueType): void;
     _triggerUpdates(): void;
 };
 declare function createState<T>(initialValue: T, subscribeCallback?: (setValue: ReturnType<typeof createState<T>>["setValue"]) => Function): State<T>;
@@ -52,7 +52,7 @@ declare function combineState<A, B, C, D, E, F, G, H>(state1: createdState<A>, s
 declare function combineState<A, B, C, D, E, F, G, H, I>(state1: createdState<A>, state2: createdState<B>, state3: createdState<C>, state4: createdState<D>, state5: createdState<E>, state6: createdState<F>, state7: createdState<G>, state8: createdState<H>, state9: createdState<I>): createdState<[A, B, C, D, E, F, G, H, I]>;
 declare function combineState<A, B, C, D, E, F, G, H, I, J>(state1: createdState<A>, state2: createdState<B>, state3: createdState<C>, state4: createdState<D>, state5: createdState<E>, state6: createdState<F>, state7: createdState<G>, state8: createdState<H>, state9: createdState<I>, state10: createdState<J>): createdState<[A, B, C, D, E, F, G, H, I, J]>;
 
-declare function onMount(cb: Function): void;
+declare function onMount(cb: () => void | Function): void;
 declare function onUnmount(cb: Function): void;
 
 declare function createRef<T>(initialRefValue?: T | null): {

package/dist/index.js

@@ -1,11 +1,12 @@
 import {
   Fragment,
+  callMountHandlers,
   createElement,
   getComponentVelesNode,
   identity,
   onMount,
   onUnmount
-} from "./chunk-EVX3ZDYT.js";
+} from "./chunk-V3EV7UG6.js";
 
 // src/attach-component.ts
 function attachComponent({
@@ -15,6 +16,7 @@ function attachComponent({
   const wrappedApp = createElement("div", { children: [component] });
   const { velesElementNode } = getComponentVelesNode(wrappedApp);
   htmlElement.appendChild(velesElementNode.html);
+  callMountHandlers(wrappedApp);
   return () => {
     velesElementNode.html.remove();
   };
@@ -80,18 +82,19 @@ function createState(initialValue, subscribeCallback) {
     },
     useValueSelector(selector, cb, comparator = identity) {
       const selectedValue = selector ? selector(value) : value;
-      const returnedNode = cb(selectedValue);
+      const returnedNode = cb ? cb(selectedValue) : String(selectedValue);
       const node = !returnedNode || typeof returnedNode === "string" ? createTextElement(returnedNode) : returnedNode;
-      trackingSelectorElements.push({
+      const trackingSelectorElement = {
         selector,
         selectedValue,
         cb,
         node,
         comparator
-      });
+      };
+      trackingSelectorElements.push(trackingSelectorElement);
       node._privateMethods._addUnmountHandler(() => {
         trackingSelectorElements = trackingSelectorElements.filter(
-          (trackingSelectorElement) => trackingSelectorElement.cb !== cb
+          (el) => trackingSelectorElement !== el
         );
       });
       return node;
@@ -148,12 +151,13 @@ function createState(initialValue, subscribeCallback) {
       return wrapperComponent;
     },
     useAttribute: (cb) => {
-      const attributeValue = cb(value);
+      const attributeValue = cb ? cb(value) : String(value);
       const attributeHelper = (htmlElement, attributeName, node) => {
-        trackingAttributes.push({ cb, htmlElement, attributeName });
+        const trackingElement = { cb, htmlElement, attributeName };
+        trackingAttributes.push(trackingElement);
         node._privateMethods._addUnmountHandler(() => {
           trackingAttributes = trackingAttributes.filter(
-            (trackingAttribute) => trackingAttribute.cb !== cb
+            (trackingAttribute) => trackingAttribute !== trackingElement
           );
         });
         return attributeValue;
@@ -172,7 +176,10 @@ function createState(initialValue, subscribeCallback) {
     // gives the latest value to ensure no outdated data
     // can be used for the state
     setValue: (newValueCB) => {
-      const newValue = newValueCB(value);
+      const newValue = (
+        // @ts-expect-error
+        typeof newValueCB === "function" ? newValueCB(value) : newValueCB
+      );
       if (newValue !== value) {
         previousValue = value;
         value = newValue;
@@ -189,11 +196,18 @@ function createState(initialValue, subscribeCallback) {
           if (comparator(selectedValue, newSelectedValue)) {
             return selectorTrackingElement;
           }
-          const returnednewNode = cb(newSelectedValue);
+          const returnednewNode = cb ? cb(newSelectedValue) : String(newSelectedValue);
           const newNode = !returnednewNode || typeof returnednewNode === "string" ? createTextElement(returnednewNode) : returnednewNode;
           const { velesElementNode: oldVelesElementNode } = getComponentVelesNode(node);
           const { velesElementNode: newVelesElementNode } = getComponentVelesNode(newNode);
           const parentVelesElement = oldVelesElementNode.parentVelesElement;
+          const newTrackingSelectorElement = {
+            selector,
+            selectedValue: newSelectedValue,
+            cb,
+            node: newNode,
+            comparator
+          };
           if (parentVelesElement) {
             newVelesElementNode.parentVelesElement = parentVelesElement;
             parentVelesElement.html.replaceChild(
@@ -204,32 +218,20 @@ function createState(initialValue, subscribeCallback) {
               (childComponent) => childComponent === node ? newNode : node
             );
             node._privateMethods._callUnmountHandlers();
-            trackingSelectorElements.push({
-              selector,
-              selectedValue: newSelectedValue,
-              cb,
-              node: newNode,
-              comparator
-            });
+            callMountHandlers(newNode);
             newNode._privateMethods._addUnmountHandler(() => {
               trackingSelectorElements = trackingSelectorElements.filter(
-                (trackingSelectorElement) => trackingSelectorElement.cb !== cb
+                (el) => el !== newTrackingSelectorElement
               );
             });
           } else {
             console.log("parent node was not found");
           }
-          return {
-            selectedValue: newSelectedValue,
-            selector,
-            cb,
-            node: newNode,
-            comparator
-          };
+          return newTrackingSelectorElement;
         }
       );
       trackingAttributes.forEach(({ cb, htmlElement, attributeName }) => {
-        const newAttributeValue = cb(value);
+        const newAttributeValue = cb ? cb(value) : String(value);
         htmlElement.setAttribute(attributeName, newAttributeValue);
       });
       trackingEffects.forEach((trackingEffect) => {
@@ -372,6 +374,7 @@ function createState(initialValue, subscribeCallback) {
               offset = offset + 1;
               currentElement = newNodeVelesElement.html;
               newElementsCount = newElementsCount + 1;
+              callMountHandlers(newNode);
             }
           });
           if (renderedElements.length === newRenderedElements.length + newElementsCount) {
@@ -438,4 +441,3 @@ export {
   onMount,
   onUnmount
 };
-//# sourceMappingURL=index.js.map

package/dist/{jsx-runtime-vDysOz5d.d.cts → jsx-runtime-C2XLvZ55.d.cts}

@@ -214,7 +214,12 @@ type VelesComponent = {
 };
 
 // all supported child options
-type velesChild = string | VelesElement | VelesComponent | VelesStringElement;
+type velesChild =
+  | string
+  | number
+  | VelesElement
+  | VelesComponent
+  | VelesStringElement;
 type VelesChildren = velesChild | velesChild[] | undefined | null;
 
 type VelesElementProps = {
@@ -232,7 +237,9 @@ type VelesElementProps = {
 } & VelesDOMElementProps;
 
 type ComponentAPI = {
-  onMount: (cb: Function) => void;
+  // You can return a function from the mount callback, and it will be
+  // automatically registered as `onUnmount` callback
+  onMount: (cb: Function) => void | Function;
   onUnmount: (cb: Function) => void;
 };
 

package/dist/{jsx-runtime-vDysOz5d.d.ts → jsx-runtime-C2XLvZ55.d.ts}

@@ -214,7 +214,12 @@ type VelesComponent = {
 };
 
 // all supported child options
-type velesChild = string | VelesElement | VelesComponent | VelesStringElement;
+type velesChild =
+  | string
+  | number
+  | VelesElement
+  | VelesComponent
+  | VelesStringElement;
 type VelesChildren = velesChild | velesChild[] | undefined | null;
 
 type VelesElementProps = {
@@ -232,7 +237,9 @@ type VelesElementProps = {
 } & VelesDOMElementProps;
 
 type ComponentAPI = {
-  onMount: (cb: Function) => void;
+  // You can return a function from the mount callback, and it will be
+  // automatically registered as `onUnmount` callback
+  onMount: (cb: Function) => void | Function;
   onUnmount: (cb: Function) => void;
 };
 

package/dist/jsx-runtime.cjs

@@ -65,6 +65,9 @@ function parseChildren({
       if (typeof childComponent === "string") {
         const text = document.createTextNode(childComponent);
         htmlElement.append(text);
+      } else if (typeof childComponent === "number") {
+        const text = document.createTextNode(String(childComponent));
+        htmlElement.append(text);
       } else if (typeof childComponent === "object" && childComponent && "velesNode" in childComponent && (childComponent == null ? void 0 : childComponent.velesNode)) {
         if (childComponent.phantom) {
           childComponent.childComponents.forEach((childComponentofPhantom) => {
@@ -72,14 +75,13 @@ function parseChildren({
               htmlElement.append(childComponentofPhantom.html);
               childComponentofPhantom.parentVelesElement = velesNode;
             } else {
-              const { componentsTree, velesElementNode } = getComponentVelesNode(childComponentofPhantom);
+              const { velesElementNode } = getComponentVelesNode(
+                childComponentofPhantom
+              );
               if (!velesElementNode) {
                 console.error("can't find HTML tree in a component chain");
               } else {
                 htmlElement.append(velesElementNode.html);
-                componentsTree.forEach((component) => {
-                  component._privateMethods._callMountHandlers();
-                });
                 velesElementNode.parentVelesElement = velesNode;
               }
             }
@@ -108,11 +110,6 @@ function parseChildren({
                     console.error("can't find HTML tree in a component chain");
                   } else {
                     htmlElement.append(velesElementNode2.html);
-                    setTimeout(() => {
-                      componentsTree2.forEach((component) => {
-                        component._privateMethods._callMountHandlers();
-                      });
-                    }, 0);
                     velesElementNode2.parentVelesElement = velesNode;
                   }
                 }
@@ -121,11 +118,6 @@ function parseChildren({
           } else {
             htmlElement.append(velesElementNode.html);
           }
-          setTimeout(() => {
-            componentsTree.forEach((component) => {
-              component._privateMethods._callMountHandlers();
-            });
-          }, 0);
           velesElementNode.parentVelesElement = velesNode;
           childComponents.push(childComponent);
         }
@@ -208,7 +200,12 @@ function parseComponent({
         componentAPI.onUnmount(cb);
       },
       _callMountHandlers: () => {
-        componentMountCbs.forEach((cb) => cb());
+        componentMountCbs.forEach((cb) => {
+          const mountCbResult = cb();
+          if (typeof mountCbResult === "function") {
+            componentAPI.onUnmount(mountCbResult);
+          }
+        });
       },
       _callUnmountHandlers: () => {
         componentUnmountCbs.forEach((cb) => cb());
@@ -277,4 +274,3 @@ function Fragment({ children }) {
   jsxDEV,
   jsxs
 });
-//# sourceMappingURL=jsx-runtime.cjs.map

package/dist/jsx-runtime.d.cts

@@ -1 +1 @@
-export { F as Fragment, c as jsx, c as jsxDEV, c as jsxs } from './jsx-runtime-vDysOz5d.cjs';
+export { F as Fragment, c as jsx, c as jsxDEV, c as jsxs } from './jsx-runtime-C2XLvZ55.cjs';

package/dist/jsx-runtime.d.ts

@@ -1 +1 @@
-export { F as Fragment, c as jsx, c as jsxDEV, c as jsxs } from './jsx-runtime-vDysOz5d.js';
+export { F as Fragment, c as jsx, c as jsxDEV, c as jsxs } from './jsx-runtime-C2XLvZ55.js';

package/dist/jsx-runtime.js

@@ -1,11 +1,10 @@
 import {
   Fragment,
   createElement
-} from "./chunk-EVX3ZDYT.js";
+} from "./chunk-V3EV7UG6.js";
 export {
   Fragment,
   createElement as jsx,
   createElement as jsxDEV,
   createElement as jsxs
 };
-//# sourceMappingURL=jsx-runtime.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "veles",
-  "version": "0.0.2",
+  "version": "0.0.3",
   "description": "UI library with main focus on performance",
   "type": "module",
   "main": "dist/index.js",

package/dist/chunk-EVX3ZDYT.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/hooks/lifecycle.ts","../src/utils.ts","../src/create-element/parse-children.ts","../src/create-element/assign-attributes.ts","../src/create-element/parse-component.ts","../src/create-element/create-element.ts","../src/fragment.ts"],"sourcesContent":["import { ComponentAPI } from \"../types\";\n\n// lifecycle hooks\n// currently, all components need to be synchronous\n// so we execute them and set background context\n// since components can be nested, we need to keep the array\nconst contextStack: ComponentAPI[] = [];\n// all hooks need to know the current context\n// it should way more convenient this way compared to passing\n// `componentAPI` to every method\nlet currentContext: ComponentAPI | null = null;\n\nfunction addContext(newContext: ComponentAPI) {\n  contextStack.push(newContext);\n  currentContext = newContext;\n}\n\nfunction popContext() {\n  contextStack.pop();\n  currentContext = contextStack[contextStack.length - 1];\n}\n\nfunction onMount(cb: Function) {\n  if (currentContext) {\n    currentContext.onMount(cb);\n  } else {\n    console.error(\"missing current context\");\n  }\n}\n\nfunction onUnmount(cb: Function) {\n  if (currentContext) {\n    currentContext.onUnmount(cb);\n  } else {\n    console.error(\"missing current context\");\n  }\n}\n\nexport { addContext, popContext, onMount, onUnmount };\n","import type { VelesComponent, VelesElement, VelesStringElement } from \"./types\";\n\nfunction getComponentVelesNode(\n  component: VelesComponent | VelesElement | VelesStringElement\n): {\n  velesElementNode: VelesElement | VelesStringElement;\n  componentsTree: VelesComponent[];\n} {\n  const componentsTree: VelesComponent[] = [];\n\n  if (\"velesStringElement\" in component) {\n    return {\n      velesElementNode: component,\n      componentsTree: [],\n    };\n  }\n\n  let childNode: VelesComponent | VelesElement = component;\n  // we can have multiple components nested, we need to get\n  // to the actual HTML to attach it\n  while (\"velesComponent\" in childNode) {\n    componentsTree.push(childNode);\n    if (\"velesStringElement\" in childNode.tree) {\n      return {\n        velesElementNode: childNode.tree,\n        componentsTree,\n      };\n    } else {\n      childNode = childNode.tree;\n    }\n  }\n\n  return { velesElementNode: childNode, componentsTree };\n}\n\nfunction identity<T>(value1: T, value2: T) {\n  return value1 === value2;\n}\n\nexport { getComponentVelesNode, identity };\n","import { getComponentVelesNode } from \"../utils\";\n\nimport type {\n  VelesComponent,\n  VelesElement,\n  VelesStringElement,\n  VelesElementProps,\n} from \"../types\";\n\nfunction parseChildren({\n  children,\n  htmlElement,\n  velesNode,\n}: {\n  children: VelesElementProps[\"children\"];\n  htmlElement: HTMLElement;\n  velesNode: VelesElement;\n}) {\n  const childComponents: (\n    | VelesElement\n    | VelesComponent\n    | VelesStringElement\n  )[] = [];\n\n  if (children === undefined || children === null) {\n    return childComponents;\n  }\n\n  (Array.isArray(children) ? children : [children]).forEach(\n    (childComponent) => {\n      if (typeof childComponent === \"string\") {\n        const text = document.createTextNode(childComponent);\n        htmlElement.append(text);\n      } else if (\n        typeof childComponent === \"object\" &&\n        childComponent &&\n        \"velesNode\" in childComponent &&\n        childComponent?.velesNode\n      ) {\n        if (childComponent.phantom) {\n          // we need to get ALL the children of it and attach it to this node\n          childComponent.childComponents.forEach((childComponentofPhantom) => {\n            if (\"velesNode\" in childComponentofPhantom) {\n              htmlElement.append(childComponentofPhantom.html);\n              childComponentofPhantom.parentVelesElement = velesNode;\n            } else {\n              const { componentsTree, velesElementNode } =\n                getComponentVelesNode(childComponentofPhantom);\n\n              if (!velesElementNode) {\n                console.error(\"can't find HTML tree in a component chain\");\n              } else {\n                htmlElement.append(velesElementNode.html);\n\n                // TODO: address the same concern as below\n                componentsTree.forEach((component) => {\n                  component._privateMethods._callMountHandlers();\n                });\n\n                velesElementNode.parentVelesElement = velesNode;\n              }\n            }\n          });\n          childComponent.parentVelesElement = velesNode;\n          childComponents.push(childComponent);\n        } else {\n          // TODO: check that it is a valid DOM Node\n          htmlElement.append(childComponent.html);\n          childComponent.parentVelesElement = velesNode;\n          childComponents.push(childComponent);\n        }\n      } else if (\n        typeof childComponent === \"object\" &&\n        childComponent &&\n        \"velesComponent\" in childComponent &&\n        childComponent?.velesComponent\n      ) {\n        // we need to save the whole components chain, so that\n        // we can trigger `mount` hooks on all of them correctly\n        const { componentsTree, velesElementNode } =\n          getComponentVelesNode(childComponent);\n\n        if (!velesElementNode) {\n          console.error(\"can't find HTML tree in a component chain\");\n        } else {\n          if (\"velesNode\" in velesElementNode && velesElementNode.phantom) {\n            // we need to get ALL the children of it and attach it to this node\n            velesElementNode.childComponents.forEach(\n              (childComponentofPhantom) => {\n                if (\"velesNode\" in childComponentofPhantom) {\n                  htmlElement.append(childComponentofPhantom.html);\n                  childComponentofPhantom.parentVelesElement = velesNode;\n                } else {\n                  const { componentsTree, velesElementNode } =\n                    getComponentVelesNode(childComponentofPhantom);\n\n                  if (!velesElementNode) {\n                    console.error(\"can't find HTML tree in a component chain\");\n                  } else {\n                    htmlElement.append(velesElementNode.html);\n\n                    // Same explanation as below. Components are mounted synchronously\n                    setTimeout(() => {\n                      componentsTree.forEach((component) => {\n                        component._privateMethods._callMountHandlers();\n                      });\n                    }, 0);\n                    velesElementNode.parentVelesElement = velesNode;\n                  }\n                }\n              }\n            );\n          } else {\n            htmlElement.append(velesElementNode.html);\n          }\n\n          /**\n           * Components are mounted synchronously, so we can safely wait for the next\n           * CPU tick and be sure that new markup is attached to DOM.\n           */\n          setTimeout(() => {\n            componentsTree.forEach((component) => {\n              component._privateMethods._callMountHandlers();\n            });\n          }, 0);\n          velesElementNode.parentVelesElement = velesNode;\n          childComponents.push(childComponent);\n        }\n      } else if (\n        typeof childComponent === \"object\" &&\n        childComponent &&\n        \"velesStringElement\" in childComponent &&\n        childComponent?.velesStringElement\n      ) {\n        // TODO: check that it is a valid DOM Node\n        htmlElement.append(childComponent.html);\n        childComponent.parentVelesElement = velesNode;\n        childComponents.push(childComponent);\n      }\n    }\n  );\n\n  return childComponents;\n}\n\nexport { parseChildren };\n","import type { VelesElement } from \"../types\";\n\nfunction assignAttributes({\n  props,\n  htmlElement,\n  velesNode,\n}: {\n  props: Record<string, any>;\n  htmlElement: HTMLElement;\n  velesNode: VelesElement;\n}) {\n  Object.entries(props).forEach(([key, value]) => {\n    const isFunction = typeof value === \"function\";\n    if (isFunction && value.velesAttribute === true) {\n      const attributeValue = value(htmlElement, key, velesNode);\n      htmlElement.setAttribute(key, attributeValue);\n    } else if (\n      // basically, any form of `on` handlers, like `onClick`, `onCopy`, etc\n      isFunction &&\n      key.length > 2 &&\n      key.startsWith(\"on\")\n    ) {\n      // TODO: think if this is robust enough\n      htmlElement.addEventListener(\n        key[2].toLocaleLowerCase() + key.slice(3),\n        value\n      );\n    } else {\n      htmlElement.setAttribute(key, value);\n    }\n  });\n}\n\nexport { assignAttributes };\n","import { addContext, popContext } from \"../hooks/lifecycle\";\n\nimport type {\n  VelesComponent,\n  VelesStringElement,\n  VelesElementProps,\n  ComponentAPI,\n  ComponentFunction,\n} from \"../types\";\n\nfunction parseComponent({\n  element,\n  props,\n}: {\n  element: ComponentFunction;\n  props: VelesElementProps;\n}) {\n  const componentUnmountCbs: Function[] = [];\n  const componentMountCbs: Function[] = [];\n  const componentAPI: ComponentAPI = {\n    onMount: (cb) => {\n      componentMountCbs.push(cb);\n    },\n    onUnmount: (cb) => {\n      componentUnmountCbs.push(cb);\n    },\n  };\n  // at this moment we enter new context\n  addContext(componentAPI);\n  const _componentTree = element(props, componentAPI);\n\n  const componentTree =\n    typeof _componentTree === \"string\" || !_componentTree\n      ? ({\n          velesStringElement: true,\n          html: document.createTextNode(\n            typeof _componentTree === \"string\" ? _componentTree : \"\"\n          ),\n        } as VelesStringElement)\n      : _componentTree;\n\n  // here we exit our context\n  popContext();\n  const velesComponent: VelesComponent = {\n    velesComponent: true,\n    tree: componentTree,\n    _privateMethods: {\n      _addUnmountHandler: (cb: Function) => {\n        componentAPI.onUnmount(cb);\n      },\n      _callMountHandlers: () => {\n        componentMountCbs.forEach((cb) => cb());\n      },\n      _callUnmountHandlers: () => {\n        componentUnmountCbs.forEach((cb) => cb());\n        // this should trigger recursive checks, whether it is a VelesNode or VelesComponent\n        // string Nodes don't have lifecycle handlers\n        if (\"_privateMethods\" in velesComponent.tree) {\n          velesComponent.tree._privateMethods._callUnmountHandlers();\n        }\n      },\n    },\n  };\n\n  return velesComponent;\n}\n\nexport { parseComponent };\n","import { parseChildren } from \"./parse-children\";\nimport { assignAttributes } from \"./assign-attributes\";\nimport { parseComponent } from \"./parse-component\";\n\nimport type {\n  VelesComponent,\n  VelesElement,\n  VelesElementProps,\n  ComponentFunction,\n} from \"../types\";\n\nfunction createElement(\n  element: string | ComponentFunction,\n  props: VelesElementProps = {}\n): VelesElement | VelesComponent {\n  if (typeof element === \"string\") {\n    const { children, ref, phantom = false, ...otherProps } = props;\n    const newElement = document.createElement(element);\n    const velesNode = {} as VelesElement;\n\n    if (ref?.velesRef) {\n      ref.current = newElement;\n    }\n\n    const childComponents = parseChildren({\n      children,\n      htmlElement: newElement,\n      velesNode,\n    });\n\n    // these handlers are attached directly to the DOM element\n    // specifically, the top level node which is rendered after\n    // using `useValue` function and also listeners from\n    // `useAttribute`\n    let unmountHandlers: Function[] = [];\n    const callUnmountHandlers = () => {\n      unmountHandlers.forEach((cb) => cb());\n      unmountHandlers = [];\n\n      childComponents.forEach((childComponent) => {\n        childComponent._privateMethods._callUnmountHandlers();\n      });\n    };\n\n    velesNode.html = newElement;\n    velesNode.velesNode = true;\n    velesNode.childComponents = childComponents;\n    velesNode.phantom = phantom;\n    velesNode._privateMethods = {\n      _addUnmountHandler: (cb: Function) => {\n        unmountHandlers.push(cb);\n      },\n      _callUnmountHandlers: callUnmountHandlers,\n    };\n\n    // assign all the DOM attributes, including event listeners\n    assignAttributes({ props: otherProps, htmlElement: newElement, velesNode });\n\n    return velesNode;\n\n    // functions mean that we want to render another component\n  } else if (typeof element === \"function\") {\n    return parseComponent({ element, props });\n  }\n\n  // otherwise we use the API wrong, so we throw an error\n  throw new Error(\n    \"Veles createElement expects a valid DOM string or another component\"\n  );\n}\n\nexport { createElement };\n","import { createElement } from \"./create-element\";\n\nimport type { VelesChildren } from \"./types\";\n\nfunction Fragment({ children }: { children: VelesChildren }) {\n  return createElement(\"div\", {\n    phantom: true,\n    children,\n  });\n}\n\nexport { Fragment };\n"],"mappings":"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","names":["componentsTree","velesElementNode"]}