veles 0.0.6 → 0.0.7

package/dist/index.cjs

@@ -21,7 +21,6 @@ var src_exports = {};
 __export(src_exports, {
   Fragment: () => Fragment,
   attachComponent: () => attachComponent,
-  combineState: () => combineState,
   createElement: () => createElement,
   createRef: () => createRef,
   createState: () => createState,
@@ -30,7 +29,7 @@ __export(src_exports, {
 });
 module.exports = __toCommonJS(src_exports);
 
-// src/utils.ts
+// src/_utils.ts
 function getComponentVelesNode(component) {
   const componentsTree = [];
   if ("velesStringElement" in component) {
@@ -347,6 +346,307 @@ function createState(initialValue, subscribeCallback) {
   let trackingSelectorElements = [];
   let trackingAttributes = [];
   let trackingIterators = [];
+  const _triggerUpdates = () => {
+    const newTrackingSelectorElements = [];
+    trackingSelectorElements.forEach((selectorTrackingElement) => {
+      const { selectedValue, selector, cb, node, comparator } = selectorTrackingElement;
+      const newSelectedValue = selector ? selector(value) : value;
+      if (comparator(selectedValue, newSelectedValue)) {
+        newTrackingSelectorElements.push(selectorTrackingElement);
+        return;
+      }
+      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;
+        if ("velesNode" in newVelesElementNode && newVelesElementNode.phantom) {
+          const insertAllPhantomChildren = (adjacentNode) => {
+            newVelesElementNode.childComponents.forEach(
+              (childComponentofPhantom) => {
+                if ("velesNode" in childComponentofPhantom) {
+                  adjacentNode.html.before(childComponentofPhantom.html);
+                  childComponentofPhantom.parentVelesElement = adjacentNode.parentVelesElement;
+                } else {
+                  const { velesElementNode } = getComponentVelesNode(
+                    childComponentofPhantom
+                  );
+                  if (!velesElementNode) {
+                    console.error("can't find HTML tree in a component chain");
+                  } else {
+                    adjacentNode.html.before(velesElementNode.html);
+                    velesElementNode.parentVelesElement = adjacentNode.parentVelesElement;
+                  }
+                }
+              }
+            );
+          };
+          if ("velesNode" in oldVelesElementNode && oldVelesElementNode.phantom) {
+            let isInserted = false;
+            oldVelesElementNode.childComponents.forEach(
+              (childComponentofPhantom) => {
+                if ("velesNode" in childComponentofPhantom) {
+                  if (!isInserted) {
+                    insertAllPhantomChildren(childComponentofPhantom);
+                    isInserted = true;
+                  }
+                  childComponentofPhantom.html.remove();
+                } else {
+                  const { velesElementNode } = getComponentVelesNode(
+                    childComponentofPhantom
+                  );
+                  if (!velesElementNode) {
+                    console.error("can't find HTML tree in a component chain");
+                  } else {
+                    if (!isInserted) {
+                      insertAllPhantomChildren(velesElementNode);
+                      isInserted = true;
+                    }
+                    velesElementNode.html.remove();
+                  }
+                }
+              }
+            );
+          } else {
+            insertAllPhantomChildren(oldVelesElementNode);
+            oldVelesElementNode.html.remove();
+          }
+        } else {
+          if ("velesNode" in oldVelesElementNode && oldVelesElementNode.phantom) {
+            let isInserted = false;
+            oldVelesElementNode.childComponents.forEach(
+              (childComponentofPhantom) => {
+                if ("velesNode" in childComponentofPhantom) {
+                  if (!isInserted) {
+                    childComponentofPhantom.html.before(
+                      newVelesElementNode.html
+                    );
+                    isInserted = true;
+                  }
+                  childComponentofPhantom.html.remove();
+                } else {
+                  const { velesElementNode } = getComponentVelesNode(
+                    childComponentofPhantom
+                  );
+                  if (!velesElementNode) {
+                    console.error("can't find HTML tree in a component chain");
+                  } else {
+                    if (!isInserted) {
+                      velesElementNode.html.before(newVelesElementNode.html);
+                      isInserted = true;
+                    }
+                    velesElementNode.html.remove();
+                  }
+                }
+              }
+            );
+          } else {
+            parentVelesElement.html.replaceChild(
+              newVelesElementNode.html,
+              oldVelesElementNode.html
+            );
+          }
+        }
+        parentVelesElement.childComponents = parentVelesElement.childComponents.map(
+          (childComponent) => childComponent === node ? newNode : node
+        );
+        node._privateMethods._callUnmountHandlers();
+        callMountHandlers(newNode);
+        newNode._privateMethods._addUnmountHandler(() => {
+          trackingSelectorElements = trackingSelectorElements.filter(
+            (el) => el !== newTrackingSelectorElement
+          );
+        });
+      } else {
+        console.log("parent node was not found");
+      }
+      newTrackingSelectorElements.push(newTrackingSelectorElement);
+    });
+    trackingSelectorElements = unique(
+      trackingSelectorElements.concat(newTrackingSelectorElements)
+    );
+    trackingAttributes.forEach(({ cb, htmlElement, attributeName }) => {
+      const newAttributeValue = cb ? cb(value) : value;
+      htmlElement.setAttribute(attributeName, newAttributeValue);
+    });
+    trackingEffects.forEach((trackingEffect) => {
+      const { cb, selectedValue, selector, comparator } = trackingEffect;
+      const newSelectedValue = selector ? selector(value) : value;
+      if (comparator ? comparator(selectedValue, newSelectedValue) : selectedValue === newSelectedValue) {
+        return;
+      }
+      cb(newSelectedValue);
+      trackingEffect.selectedValue = newSelectedValue;
+    });
+    trackingIterators.forEach((trackingIterator) => {
+      const {
+        cb,
+        key,
+        renderedElements,
+        elementsByKey,
+        wrapperComponent,
+        selector
+      } = trackingIterator;
+      if (!wrapperComponent) {
+        console.error("there is no wrapper component for the iterator");
+        return;
+      }
+      const { velesElementNode: wrapperVelesElementNode } = getComponentVelesNode(wrapperComponent);
+      const parentVelesElement = wrapperVelesElementNode.parentVelesElement;
+      if (!parentVelesElement) {
+        console.error("there is no parent Veles node for the iterator wrapper");
+        return;
+      }
+      const elements = selector ? selector(value) : value;
+      if (Array.isArray(elements)) {
+        const newRenderedElements = [];
+        const newElementsByKey = {};
+        const renderedExistingElements = {};
+        elements.forEach((element, index) => {
+          let calculatedKey = "";
+          if (typeof key === "string" && typeof element === "object" && element !== null && key in element) {
+            calculatedKey = element[key];
+          } else if (typeof key === "function") {
+            calculatedKey = key({ element, index });
+          } else {
+          }
+          if (!calculatedKey) {
+            return;
+          }
+          const existingElement = elementsByKey[calculatedKey];
+          if (existingElement) {
+            renderedExistingElements[calculatedKey] = true;
+            const currentValue = existingElement.elementState.getValue();
+            if (currentValue !== element) {
+              existingElement.elementState.setValue(element);
+            }
+            const currentIndex = existingElement.indexState.getValue();
+            if (currentIndex !== index) {
+              existingElement.indexState.setValue(index);
+            }
+            newRenderedElements.push([
+              existingElement.node,
+              calculatedKey,
+              existingElement.elementState
+            ]);
+            newElementsByKey[calculatedKey] = {
+              elementState: existingElement.elementState,
+              indexState: existingElement.indexState,
+              indexValue: index,
+              node: existingElement.node
+            };
+          } else {
+            const elementState = createState(element);
+            const indexState = createState(index);
+            const node = cb({ elementState, indexState });
+            newRenderedElements.push([node, calculatedKey, elementState]);
+            newElementsByKey[calculatedKey] = {
+              elementState,
+              indexState,
+              indexValue: index,
+              node
+            };
+          }
+        });
+        const positioningOffset = {};
+        let newElementsCount = 0;
+        let offset = 0;
+        let currentElement = null;
+        newRenderedElements.forEach((newRenderedElement, index) => {
+          var _a, _b, _c;
+          if (positioningOffset[index]) {
+            offset = offset + positioningOffset[index];
+          }
+          const [newNode, calculatedKey, newState] = newRenderedElement;
+          const existingElement = elementsByKey[calculatedKey];
+          if (existingElement) {
+            const { velesElementNode: existingElementNode } = getComponentVelesNode(existingElement.node);
+            if (existingElement.indexValue + offset === index) {
+              currentElement = existingElementNode.html;
+              return;
+            }
+            if (existingElement.indexValue + offset > index) {
+              if (currentElement) {
+                currentElement.after(existingElementNode.html);
+                positioningOffset[existingElement.indexValue + 1] = -1;
+              } else {
+                const firstRenderedElement = (_a = renderedElements[0]) == null ? void 0 : _a[0];
+                if (firstRenderedElement) {
+                  const { velesElementNode: firstRenderedVelesNode } = getComponentVelesNode(firstRenderedElement);
+                  firstRenderedVelesNode.html.before(existingElementNode.html);
+                } else {
+                }
+              }
+              currentElement = existingElementNode.html;
+              offset = offset + 1;
+            } else {
+              if (currentElement) {
+                currentElement.after(existingElementNode.html);
+                positioningOffset[existingElement.indexValue + 1] = 1;
+              } else {
+                const firstRenderedElement = (_b = renderedElements[0]) == null ? void 0 : _b[0];
+                if (firstRenderedElement) {
+                  const { velesElementNode: firstRenderedVelesNode } = getComponentVelesNode(firstRenderedElement);
+                  firstRenderedVelesNode.html.before(existingElementNode.html);
+                } else {
+                }
+              }
+              currentElement = existingElementNode.html;
+              offset = offset - 1;
+            }
+          } else {
+            const { velesElementNode: newNodeVelesElement } = getComponentVelesNode(newNode);
+            newNodeVelesElement.parentVelesElement = parentVelesElement;
+            if (currentElement) {
+              currentElement.after(newNodeVelesElement.html);
+            } else {
+              const firstRenderedElement = (_c = renderedElements[0]) == null ? void 0 : _c[0];
+              if (firstRenderedElement) {
+                const { velesElementNode: firstRenderedVelesNode } = getComponentVelesNode(firstRenderedElement);
+                firstRenderedVelesNode.html.before(newNodeVelesElement.html);
+              } else {
+                parentVelesElement.html.prepend(newNodeVelesElement.html);
+              }
+            }
+            offset = offset + 1;
+            currentElement = newNodeVelesElement.html;
+            newElementsCount = newElementsCount + 1;
+            callMountHandlers(newNode);
+          }
+        });
+        if (renderedElements.length === newRenderedElements.length + newElementsCount) {
+        } else {
+          renderedElements.forEach(([oldNode, calculatedKey]) => {
+            if (renderedExistingElements[calculatedKey] === true) {
+              return;
+            } else {
+              const { velesElementNode: oldRenderedVelesNode } = getComponentVelesNode(oldNode);
+              oldRenderedVelesNode.html.remove();
+              oldNode._privateMethods._callUnmountHandlers();
+              if ("velesNode" in wrapperVelesElementNode) {
+                wrapperVelesElementNode.childComponents = wrapperVelesElementNode.childComponents.filter(
+                  (childComponent) => childComponent !== oldNode
+                );
+              } else {
+                throw new Error("Wrapper iterator element is a string");
+              }
+            }
+          });
+        }
+        trackingIterator.renderedElements = newRenderedElements;
+        trackingIterator.elementsByKey = newElementsByKey;
+      }
+    });
+  };
   const result = {
     // supposed to be used at the component level
     trackValue: (cb, options = {}) => {
@@ -414,13 +714,15 @@ function createState(initialValue, subscribeCallback) {
         } else {
         }
         const elementState = createState(element);
+        const indexState = createState(index);
         if (!calculatedKey) {
           return;
         }
-        let node = cb({ elementState, index });
+        let node = cb({ elementState, indexState });
         elementsByKey[calculatedKey] = {
           node,
-          index,
+          indexState,
+          indexValue: index,
           elementState
         };
         children.push([node, calculatedKey, elementState]);
@@ -481,227 +783,8 @@ function createState(initialValue, subscribeCallback) {
       if (newValue !== value) {
         previousValue = value;
         value = newValue;
-        result._triggerUpdates();
+        _triggerUpdates();
       }
-    },
-    // TODO: remove it from this object completely
-    // and access it from closure
-    _triggerUpdates: () => {
-      const newTrackingSelectorElements = [];
-      trackingSelectorElements.forEach((selectorTrackingElement) => {
-        const { selectedValue, selector, cb, node, comparator } = selectorTrackingElement;
-        const newSelectedValue = selector ? selector(value) : value;
-        if (comparator(selectedValue, newSelectedValue)) {
-          newTrackingSelectorElements.push(selectorTrackingElement);
-          return;
-        }
-        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(
-            newVelesElementNode.html,
-            oldVelesElementNode.html
-          );
-          parentVelesElement.childComponents = parentVelesElement.childComponents.map(
-            (childComponent) => childComponent === node ? newNode : node
-          );
-          node._privateMethods._callUnmountHandlers();
-          callMountHandlers(newNode);
-          newNode._privateMethods._addUnmountHandler(() => {
-            trackingSelectorElements = trackingSelectorElements.filter(
-              (el) => el !== newTrackingSelectorElement
-            );
-          });
-        } else {
-          console.log("parent node was not found");
-        }
-        newTrackingSelectorElements.push(newTrackingSelectorElement);
-      });
-      trackingSelectorElements = unique(
-        trackingSelectorElements.concat(newTrackingSelectorElements)
-      );
-      trackingAttributes.forEach(({ cb, htmlElement, attributeName }) => {
-        const newAttributeValue = cb ? cb(value) : value;
-        htmlElement.setAttribute(attributeName, newAttributeValue);
-      });
-      trackingEffects.forEach((trackingEffect) => {
-        const { cb, selectedValue, selector, comparator } = trackingEffect;
-        const newSelectedValue = selector ? selector(value) : value;
-        if (comparator ? comparator(selectedValue, newSelectedValue) : selectedValue === newSelectedValue) {
-          return;
-        }
-        cb(newSelectedValue);
-        trackingEffect.selectedValue = newSelectedValue;
-      });
-      trackingIterators.forEach((trackingIterator) => {
-        const {
-          cb,
-          key,
-          renderedElements,
-          elementsByKey,
-          wrapperComponent,
-          selector
-        } = trackingIterator;
-        if (!wrapperComponent) {
-          console.error("there is no wrapper component for the iterator");
-          return;
-        }
-        const { velesElementNode: wrapperVelesElementNode } = getComponentVelesNode(wrapperComponent);
-        const parentVelesElement = wrapperVelesElementNode.parentVelesElement;
-        if (!parentVelesElement) {
-          console.error(
-            "there is no parent Veles node for the iterator wrapper"
-          );
-          return;
-        }
-        const elements = selector ? selector(value) : value;
-        if (Array.isArray(elements)) {
-          const newRenderedElements = [];
-          const newElementsByKey = {};
-          const renderedExistingElements = {};
-          elements.forEach((element, index) => {
-            let calculatedKey = "";
-            if (typeof key === "string" && typeof element === "object" && element !== null && key in element) {
-              calculatedKey = element[key];
-            } else if (typeof key === "function") {
-              calculatedKey = key({ element, index });
-            } else {
-            }
-            if (!calculatedKey) {
-              return;
-            }
-            const existingElement = elementsByKey[calculatedKey];
-            if (existingElement) {
-              renderedExistingElements[calculatedKey] = true;
-              const currentValue = existingElement.elementState.getValue();
-              if (currentValue !== element) {
-                existingElement.elementState.setValue(() => element);
-              }
-              newRenderedElements.push([
-                existingElement.node,
-                calculatedKey,
-                existingElement.elementState
-              ]);
-              newElementsByKey[calculatedKey] = {
-                elementState: existingElement.elementState,
-                index,
-                node: existingElement.node
-              };
-            } else {
-              const elementState = createState(element);
-              const node = cb({ elementState, index });
-              newRenderedElements.push([node, calculatedKey, elementState]);
-              newElementsByKey[calculatedKey] = {
-                elementState,
-                index,
-                node
-              };
-            }
-          });
-          const positioningOffset = {};
-          let newElementsCount = 0;
-          let offset = 0;
-          let currentElement = null;
-          newRenderedElements.forEach((newRenderedElement, index) => {
-            var _a, _b, _c;
-            if (positioningOffset[index]) {
-              offset = offset + positioningOffset[index];
-            }
-            const [newNode, calculatedKey, newState] = newRenderedElement;
-            const existingElement = elementsByKey[calculatedKey];
-            if (existingElement) {
-              const { velesElementNode: existingElementNode } = getComponentVelesNode(existingElement.node);
-              if (existingElement.index + offset === index) {
-                currentElement = existingElementNode.html;
-                return;
-              }
-              if (existingElement.index + offset > index) {
-                if (currentElement) {
-                  currentElement.after(existingElementNode.html);
-                  positioningOffset[existingElement.index + 1] = -1;
-                } else {
-                  const firstRenderedElement = (_a = renderedElements[0]) == null ? void 0 : _a[0];
-                  if (firstRenderedElement) {
-                    const { velesElementNode: firstRenderedVelesNode } = getComponentVelesNode(firstRenderedElement);
-                    firstRenderedVelesNode.html.before(
-                      existingElementNode.html
-                    );
-                  } else {
-                  }
-                }
-                currentElement = existingElementNode.html;
-                offset = offset + 1;
-              } else {
-                if (currentElement) {
-                  currentElement.after(existingElementNode.html);
-                  positioningOffset[existingElement.index + 1] = 1;
-                } else {
-                  const firstRenderedElement = (_b = renderedElements[0]) == null ? void 0 : _b[0];
-                  if (firstRenderedElement) {
-                    const { velesElementNode: firstRenderedVelesNode } = getComponentVelesNode(firstRenderedElement);
-                    firstRenderedVelesNode.html.before(
-                      existingElementNode.html
-                    );
-                  } else {
-                  }
-                }
-                currentElement = existingElementNode.html;
-                offset = offset - 1;
-              }
-            } else {
-              const { velesElementNode: newNodeVelesElement } = getComponentVelesNode(newNode);
-              newNodeVelesElement.parentVelesElement = parentVelesElement;
-              if (currentElement) {
-                currentElement.after(newNodeVelesElement.html);
-              } else {
-                const firstRenderedElement = (_c = renderedElements[0]) == null ? void 0 : _c[0];
-                if (firstRenderedElement) {
-                  const { velesElementNode: firstRenderedVelesNode } = getComponentVelesNode(firstRenderedElement);
-                  firstRenderedVelesNode.html.before(newNodeVelesElement.html);
-                } else {
-                  parentVelesElement.html.prepend(newNodeVelesElement.html);
-                }
-              }
-              offset = offset + 1;
-              currentElement = newNodeVelesElement.html;
-              newElementsCount = newElementsCount + 1;
-              callMountHandlers(newNode);
-            }
-          });
-          if (renderedElements.length === newRenderedElements.length + newElementsCount) {
-          } else {
-            renderedElements.forEach(([oldNode, calculatedKey]) => {
-              if (renderedExistingElements[calculatedKey] === true) {
-                return;
-              } else {
-                const { velesElementNode: oldRenderedVelesNode } = getComponentVelesNode(oldNode);
-                oldRenderedVelesNode.html.remove();
-                oldNode._privateMethods._callUnmountHandlers();
-                if ("velesNode" in wrapperVelesElementNode) {
-                  wrapperVelesElementNode.childComponents = wrapperVelesElementNode.childComponents.filter(
-                    (childComponent) => childComponent !== oldNode
-                  );
-                } else {
-                  throw new Error("Wrapper iterator element is a string");
-                }
-              }
-            });
-          }
-          trackingIterator.renderedElements = newRenderedElements;
-          trackingIterator.elementsByKey = newElementsByKey;
-        }
-      });
     }
   };
   if (subscribeCallback) {
@@ -713,19 +796,6 @@ function createState(initialValue, subscribeCallback) {
   return result;
 }
 
-// src/hooks/combine-state.ts
-function combineState(...states) {
-  const initialValue = states.map((state) => state.getValue());
-  const combinedState = createState(initialValue);
-  states.forEach((state) => {
-    state.trackValue(() => {
-      const updatedValue = states.map((state2) => state2.getValue());
-      combinedState.setValue(updatedValue);
-    });
-  });
-  return combinedState;
-}
-
 // src/create-ref.ts
 function createRef(initialRefValue = null) {
   return {
@@ -745,7 +815,6 @@ function Fragment({ children }) {
 0 && (module.exports = {
   Fragment,
   attachComponent,
-  combineState,
   createElement,
   createRef,
   createState,

package/dist/index.d.cts

@@ -1,53 +1,12 @@
-import { V as VelesElement, a as VelesComponent, b as VelesStringElement, A as AttributeHelper } from './fragment-CHmQ0MhU.cjs';
-export { F as Fragment, c as createElement } from './fragment-CHmQ0MhU.cjs';
+import { V as VelesElement, a as VelesComponent } from './types.d-DgVBp6oa.cjs';
+export { F as Fragment, c as createElement } from './fragment-CU26z590.cjs';
+export { S as State, c as createState } from './create-state-D1JASFVs.cjs';
 
 declare function attachComponent({ htmlElement, component, }: {
     htmlElement: HTMLElement;
     component: VelesElement | VelesComponent;
 }): () => void;
 
-type State<ValueType> = {
-    trackValue(cb: (value: ValueType) => void | Function, options?: {
-        callOnMount?: boolean;
-        skipFirstCall?: boolean;
-        comparator?: (value1: ValueType, value2: ValueType) => boolean;
-    }): void;
-    trackValueSelector<SelectorValueType>(selector: (value: ValueType) => SelectorValueType, cb: (value: SelectorValueType) => void | Function, options?: {
-        callOnMount?: boolean;
-        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) => any): AttributeHelper<any>;
-    useValueIterator<Element>(options: {
-        key: string | ((options: {
-            element: Element;
-            index: number;
-        }) => string);
-        selector?: (value: ValueType) => Element[];
-    }, cb: (props: {
-        elementState: State<Element>;
-        index: number;
-    }) => VelesElement | VelesComponent): VelesComponent | VelesElement | null;
-    getValue(): ValueType;
-    getPreviousValue(): undefined | ValueType;
-    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>;
-
-type createdState<StateType> = ReturnType<typeof createState<StateType>>;
-declare function combineState<A, B>(state1: createdState<A>, state2: createdState<B>): createdState<[A, B]>;
-declare function combineState<A, B, C>(state1: createdState<A>, state2: createdState<B>, state3: createdState<C>): createdState<[A, B, C]>;
-declare function combineState<A, B, C, D>(state1: createdState<A>, state2: createdState<B>, state3: createdState<C>, state4: createdState<D>): createdState<[A, B, C, D]>;
-declare function combineState<A, B, C, D, E>(state1: createdState<A>, state2: createdState<B>, state3: createdState<C>, state4: createdState<D>, state5: createdState<E>): createdState<[A, B, C, D, E]>;
-declare function combineState<A, B, C, D, E, F>(state1: createdState<A>, state2: createdState<B>, state3: createdState<C>, state4: createdState<D>, state5: createdState<E>, state6: createdState<F>): createdState<[A, B, C, D, E, F]>;
-declare function combineState<A, B, C, D, E, F, G>(state1: createdState<A>, state2: createdState<B>, state3: createdState<C>, state4: createdState<D>, state5: createdState<E>, state6: createdState<F>, state7: createdState<G>): createdState<[A, B, C, D, E, F, G]>;
-declare function combineState<A, B, C, D, E, F, G, H>(state1: createdState<A>, state2: createdState<B>, state3: createdState<C>, state4: createdState<D>, state5: createdState<E>, state6: createdState<F>, state7: createdState<G>, state8: createdState<H>): createdState<[A, B, C, D, E, F, G, H]>;
-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: () => void | Function): void;
 declare function onUnmount(cb: Function): void;
 
@@ -56,4 +15,4 @@ declare function createRef<T>(initialRefValue?: T | null): {
     current: T | null;
 };
 
-export { type State, attachComponent, combineState, createRef, createState, onMount, onUnmount };
+export { attachComponent, createRef, onMount, onUnmount };