valyrian.js 7.2.11 → 7.2.12

package/lib/request/index.ts

@@ -54,7 +54,7 @@ export interface RequestInterface {
 function serialize(obj: Record<string, any>, prefix: string = ""): string {
   return Object.keys(obj)
     .map((prop: string) => {
-      let k = prefix ? `${prefix}[${prop}]` : prop;
+      const k = prefix ? `${prefix}[${prop}]` : prop;
       return typeof obj[prop] === "object"
         ? serialize(obj[prop], k)
         : `${encodeURIComponent(k)}=${encodeURIComponent(obj[prop])}`;
@@ -65,7 +65,7 @@ function serialize(obj: Record<string, any>, prefix: string = ""): string {
 function parseUrl(url: string, options: RequestOptionsWithUrls) {
   let u = /^https?/gi.test(url) ? url : options.urls.base + url;
 
-  let parts = u.split("?");
+  const parts = u.split("?");
   u = parts[0].trim().replace(/^\/\//, "/").replace(/\/$/, "").trim();
 
   if (parts[1]) {
@@ -92,7 +92,7 @@ const defaultOptions: RequestOptions = { allowedMethods: ["get", "post", "put",
 
 // eslint-disable-next-line sonarjs/cognitive-complexity
 function Requester(baseUrl = "", options: RequestOptions = defaultOptions) {
-  let url = baseUrl.replace(/\/$/gi, "").trim();
+  const url = baseUrl.replace(/\/$/gi, "").trim();
   if (!options.urls) {
     options.urls = {
       base: "",
@@ -105,7 +105,7 @@ function Requester(baseUrl = "", options: RequestOptions = defaultOptions) {
     options.allowedMethods = defaultOptions.allowedMethods;
   }
 
-  let opts: RequestOptionsWithUrls = {
+  const opts: RequestOptionsWithUrls = {
     ...(options as RequestOptionsWithUrls),
     urls: {
       node: options.urls.node || null,
@@ -115,7 +115,7 @@ function Requester(baseUrl = "", options: RequestOptions = defaultOptions) {
   };
 
   const request = async function request(method: string, url: string, data?: Record<string, any>, options = {}) {
-    let innerOptions: SendOptions = {
+    const innerOptions: SendOptions = {
       method: method.toUpperCase(),
       headers: {},
       resolveWithFullResponse: false,
@@ -127,8 +127,8 @@ function Requester(baseUrl = "", options: RequestOptions = defaultOptions) {
       innerOptions.headers.Accept = "application/json";
     }
 
-    let acceptType = innerOptions.headers.Accept;
-    let contentType = innerOptions.headers["Content-Type"] || innerOptions.headers["content-type"] || "";
+    const acceptType = innerOptions.headers.Accept;
+    const contentType = innerOptions.headers["Content-Type"] || innerOptions.headers["content-type"] || "";
 
     if (innerOptions.allowedMethods.indexOf(method) === -1) {
       throw new Error("Method not allowed");
@@ -148,7 +148,7 @@ function Requester(baseUrl = "", options: RequestOptions = defaultOptions) {
             formData = data;
           } else {
             formData = new FormData();
-            for (let i in data) {
+            for (const i in data) {
               formData.append(i, data[i]);
             }
           }
@@ -157,10 +157,10 @@ function Requester(baseUrl = "", options: RequestOptions = defaultOptions) {
       }
     }
 
-    let response = await fetch(parseUrl(url, opts), innerOptions);
+    const response = await fetch(parseUrl(url, opts), innerOptions);
     let body = null;
     if (!response.ok) {
-      let err = new Error(response.statusText) as Error & { response?: any; body?: any };
+      const err = new Error(response.statusText) as Error & { response?: any; body?: any };
       err.response = response;
       if (/text/gi.test(acceptType)) {
         err.body = await response.text();
@@ -203,15 +203,15 @@ function Requester(baseUrl = "", options: RequestOptions = defaultOptions) {
   request.setOption = (key: string, value: any) => {
     let result = opts;
 
-    let parsed = key.split(".");
+    const parsed = key.split(".");
     let next;
 
     while (parsed.length) {
       next = parsed.shift() as string;
 
-      let nextIsArray = next.indexOf("[") > -1;
+      const nextIsArray = next.indexOf("[") > -1;
       if (nextIsArray) {
-        let idx = next.replace(/\D/gi, "");
+        const idx = next.replace(/\D/gi, "");
         next = next.split("[")[0];
         parsed.unshift(idx);
       }
@@ -236,15 +236,15 @@ function Requester(baseUrl = "", options: RequestOptions = defaultOptions) {
     }
 
     let result = opts;
-    let parsed = key.split(".");
+    const parsed = key.split(".");
     let next;
 
     while (parsed.length) {
       next = parsed.shift() as string;
 
-      let nextIsArray = next.indexOf("[") > -1;
+      const nextIsArray = next.indexOf("[") > -1;
       if (nextIsArray) {
-        let idx = next.replace(/\D/gi, "");
+        const idx = next.replace(/\D/gi, "");
         next = next.split("[")[0];
         parsed.unshift(idx);
       }

package/lib/router/index.ts

@@ -104,15 +104,15 @@ const addPath = ({
   }
 
   // Trim trailing slashes from the path
-  let realpath = path.replace(/(\S)(\/+)$/, "$1");
+  const realpath = path.replace(/(\S)(\/+)$/, "$1");
 
   // Find the express-like params in the path
-  let params = (realpath.match(/:(\w+)?/gi) || [])
+  const params = (realpath.match(/:(\w+)?/gi) || [])
     // Set the names of the params found
     .map((param) => param.slice(1));
 
   // Generate a regular expression to match the path
-  let regexpPath = "^" + realpath.replace(/:(\w+)/gi, "([^\\/\\s]+)") + "$";
+  const regexpPath = "^" + realpath.replace(/:(\w+)/gi, "([^\\/\\s]+)") + "$";
 
   router.paths.push({
     method,
@@ -126,12 +126,12 @@ const addPath = ({
 // Parse a query string into an object
 function parseQuery(queryParts?: string): Record<string, string> {
   // Split the query string into an array of name-value pairs
-  let parts = queryParts ? queryParts.split("&") : [];
-  let query: Record<string, string> = {};
+  const parts = queryParts ? queryParts.split("&") : [];
+  const query: Record<string, string> = {};
 
   // Iterate over the name-value pairs and add them to the query object
-  for (let nameValue of parts) {
-    let [name, value] = nameValue.split("=", 2);
+  for (const nameValue of parts) {
+    const [name, value] = nameValue.split("=", 2);
     query[name] = value || "";
   }
 
@@ -140,13 +140,13 @@ function parseQuery(queryParts?: string): Record<string, string> {
 
 // Search for middlewares that match a given path
 function searchMiddlewares(router: RouterInterface, path: string): Middlewares {
-  let middlewares: Middlewares = [];
-  let params: Record<string, any> = {};
-  let matches = [];
+  const middlewares: Middlewares = [];
+  const params: Record<string, any> = {};
+  const matches = [];
 
   // Search for middlewares
-  for (let item of router.paths) {
-    let match = item.regexp.exec(path);
+  for (const item of router.paths) {
+    const match = item.regexp.exec(path);
 
     // If we found middlewares
     if (Array.isArray(match)) {
@@ -154,7 +154,7 @@ function searchMiddlewares(router: RouterInterface, path: string): Middlewares {
       match.shift();
 
       // Parse params
-      for (let [index, key] of item.params.entries()) {
+      for (const [index, key] of item.params.entries()) {
         params[key] = match[index];
       }
 
@@ -228,13 +228,13 @@ export class Router implements RouterInterface {
   }
 
   add(path: string, ...middlewares: Middlewares): Router {
-    let pathWithoutLastSlash = getPathWithoutLastSlash(`${this.pathPrefix}${path}`);
+    const pathWithoutLastSlash = getPathWithoutLastSlash(`${this.pathPrefix}${path}`);
     addPath({ router: this, method: "add", path: pathWithoutLastSlash, middlewares });
     return this;
   }
 
   use(...middlewares: Middlewares | Router[] | string[]): Router {
-    let path = getPathWithoutLastSlash(
+    const path = getPathWithoutLastSlash(
       `${this.pathPrefix}${typeof middlewares[0] === "string" ? middlewares.shift() : "/"}`
     );
 
@@ -273,7 +273,7 @@ export class Router implements RouterInterface {
       throw new Error("router.url.required");
     }
 
-    let constructedPath = getPathWithoutLastSlash(`${this.pathPrefix}${path}`);
+    const constructedPath = getPathWithoutLastSlash(`${this.pathPrefix}${path}`);
     const parts = constructedPath.split("?", 2);
     this.url = constructedPath;
     this.query = parseQuery(parts[1]);
@@ -337,15 +337,16 @@ export function mountRouter(elementContainer: string | any, router: Router): voi
 
   if (!isNodeJs) {
     function onPopStateGoToRoute(): void {
-      let pathWithoutPrefix = getPathWithoutPrefix(document.location.pathname, router.pathPrefix);
+      const pathWithoutPrefix = getPathWithoutPrefix(document.location.pathname, router.pathPrefix);
       (router as unknown as Router).go(pathWithoutPrefix, undefined, true);
     }
     window.addEventListener("popstate", onPopStateGoToRoute, false);
     onPopStateGoToRoute();
   }
 
-  directive("route", (url: string, vnode: VnodeWithDom, oldnode?: VnodeWithDom): void => {
-    setAttribute("href", url, vnode, oldnode);
-    setAttribute("onclick", router.getOnClickHandler(url), vnode, oldnode);
+  directive("route", (vnode: VnodeWithDom): void => {
+    const url = vnode.props["v-route"];
+    setAttribute("href", url, vnode);
+    setAttribute("onclick", router.getOnClickHandler(url), vnode);
   });
 }

package/lib/signal/index.ts

@@ -1,161 +1,86 @@
-import { VnodeWithDom, current, onUnmount, updateVnode, v } from "valyrian.js";
-
-interface GetterInterface {
-  (): any;
-}
-
-interface SetterInterface {
-  (value: any): void;
-}
-
-interface SubscribeInterface {
-  (callback: Function): void;
-}
-
-interface SubscriptionsInterface extends Array<Function> {}
-
-export interface SignalInterface extends Array<any> {
-  0: GetterInterface;
-  1: SetterInterface;
-  2: SubscribeInterface;
-  3: SubscriptionsInterface;
-}
-
-// eslint-disable-next-line sonarjs/cognitive-complexity
-export function Signal(initialValue: any): SignalInterface {
-  // Create a copy of the current context object
-  const { vnode, component } = { ...current };
-
-  // Check if the context object has a vnode property
-  if (vnode && component) {
-    // Is first call
-    if (!vnode.components) {
-      // Set the components property to an empty array
-      vnode.components = [];
+import { updateVnode, current, VnodeWithDom, onCleanup, POJOComponent, Component, onUnmount } from "valyrian.js";
+
+type getter = () => any;
+type setter = (newValue: any) => void;
+type unsubscribe = () => void;
+type subscribe = (callback: () => void) => unsubscribe;
+type subscriptions = Set<() => void>;
+type signal = [getter, setter, subscribe, subscriptions];
+
+type SignalCalls = {
+  signals: signal[];
+  signal_calls: number;
+};
+
+const componentToSignalsWeakMap = new WeakMap<Component | POJOComponent, SignalCalls>();
+
+// Signal is a generic function that creates a reactive state with a getter, setter, and subscribe mechanism.
+export function Signal<T>(initialValue: T): signal {
+  if (current.component) {
+    if (componentToSignalsWeakMap.has(current.component) === false) {
+      const SignalCalls = { signals: [], signal_calls: -1 };
+      componentToSignalsWeakMap.set(current.component, SignalCalls);
+      onUnmount(() => componentToSignalsWeakMap.delete(current.component as Component | POJOComponent));
     }
 
-    // Check if the components array of the vnode object does not contain the component object
-    if (vnode.components.indexOf(component) === -1) {
-      // Set the calls property to -1
-      vnode.signal_calls = -1;
-      // Add the component to the components array
-      vnode.components.push(component);
-
-      // Check if the component object has a signals property
-      if (!component.signals) {
-        // Set the signals property of the component object to an empty array
-        component.signals = [];
-        // Add a function to the cleanup stack that removes the signals property from the component object
-        onUnmount(() => Reflect.deleteProperty(component, "signals"));
-      }
-    }
+    const SignalCalls = componentToSignalsWeakMap.get(current.component) as SignalCalls;
+    onCleanup(() => (SignalCalls.signal_calls = -1));
 
-    // Assign the signal variable to the signal stored at the index of the vnode object's calls property in the vnode's signals array
-    let signal: SignalInterface = component.signals[++vnode.signal_calls];
+    const signal = SignalCalls.signals[++SignalCalls.signal_calls];
 
-    // If a signal has already been assigned to the signal variable, return it
     if (signal) {
-      // Remove all subscriptions because we come from a new render
-      signal[3].length = 0;
-
-      // Return the signal
-      return signal;
+      // Return the signal if it already exists.
+      // But without the subscribe function. This is to prevent the subscribe function from being called multiple times.
+      const fakeSubscribe = (() => {}) as unknown as subscribe;
+      return [signal[0], signal[1], fakeSubscribe, signal[3]];
     }
   }
 
-  // Declare a variable to store the current value of the Signal
-  let value = initialValue;
-
-  // Create an array to store functions that have subscribed to changes to the Signal's value
-  const subscriptions: SubscriptionsInterface = [];
+  // The current value of the signal is stored in a closure to maintain state.
+  let value: T = initialValue;
+  // Subscribers is a Set of functions to be called whenever the value changes.
+  const subscribers: subscriptions = new Set();
 
-  // Define a function that allows other parts of the code to subscribe to changes to the Signal's value
-  const subscribe = (callback: Function) => {
-    // Add the callback function to the subscriptions array if it is not already in the array
-    if (subscriptions.indexOf(callback) === -1) {
-      subscriptions.push(callback);
-    }
+  // subscribe is a function that allows a subscriber to listen to changes in the signal's value.
+  // It returns an unsubscribe function to stop listening to changes.
+  const subscribe = (callback: () => void) => {
+    subscribers.add(callback);
+    return () => subscribers.delete(callback);
   };
 
-  // Set the vnodes to update when the Signal's value changes
-  let vnodesToUpdate: Array<VnodeWithDom> = [];
-
-  // This is the function that will be called when the Signal's value changes
-  const updateVnodes = () => {
-    // Create a copy of the vnodesToUpdate array and filter out any duplicate vnodes
-    let vnodesToUpdateCopy = vnodesToUpdate.filter((vnode, index, self) => {
-      return self.findIndex((v) => v.dom === vnode.dom) === index;
-    });
-
-    // Loop through the vnodesToUpdate array
-    for (let i = 0, l = vnodesToUpdateCopy.length; i < l; i++) {
-      const vnode2 = vnodesToUpdateCopy[i];
-      // If it does, create a new vnode object based on the original vnode, its children, and its DOM and SVG properties
-      let newVnode = v(vnode2.tag, vnode2.props, ...vnode2.initialChildren) as VnodeWithDom;
-      newVnode.dom = vnode2.dom; // Set the new vnode object's DOM property to the old vnode object's DOM property
-      newVnode.isSVG = vnode2.isSVG; // Set the new vnode object's isSVG property to the old vnode object's isSVG property
-
-      // Update the vnode object
-      updateVnode(newVnode, vnode2);
-    }
-  };
+  const domToVnodesToUpdate: Map<Node, VnodeWithDom> = new Map();
+  const updateVnodes = () => domToVnodesToUpdate.forEach((vnode) => updateVnode(vnode));
 
-  // Define a function that returns the current value of the Signal
-  function get() {
-    // Get the current vnode from the context object
-    const { vnode: vnode2 } = current;
-
-    // If we have a current vnode, it means that a get function is being called from within a component
-    // so we subscribe the vnode to be updated when the Signal's value changes
-    if (vnode2 && vnodesToUpdate.indexOf(vnode2) === -1) {
-      // We set the initialChildren to a copy of the vnode's children array
-      // This is the case when the vnode is a component that has not been rendered yet and we need the initial children
-      // because they could have the components that are using the Signal
-      if (!vnode2.initialChildren) {
-        vnode2.initialChildren = [...vnode2.children];
-      }
-
-      // Add the vnode to the vnodesToUpdate array
-      vnodesToUpdate.push(vnode2);
-
-      // Subscribe the updateVnodes function to the Signal
+  // getValue is a function that returns the current value of the signal.
+  const getValue = () => {
+    if (current.vnode) {
+      const vnode = current.vnode as VnodeWithDom;
+      domToVnodesToUpdate.set(vnode.dom, vnode);
       subscribe(updateVnodes);
     }
-
-    // Return the current value of the Signal
     return value;
-  }
+  };
 
-  // Define a function that allows the value of the Signal to be updated and notifies any subscribed functions of the change
-  const set = (newValue: any) => {
-    // If we have a current event on going, prevent the default action
+  // setValue is a function that updates the value of the signal and notifies subscribers.
+  const setValue = (newValue: any) => {
     if (current.event) {
       current.event.preventDefault();
     }
 
-    // Just return if the new value is the same as the current value
-    if (newValue === value) {
+    if (value === newValue) {
       return;
     }
-
-    // Update the value of the Signal
     value = newValue;
-
-    // Call each subscribed function with the new value of the Signal as an argument
-    for (let i = 0, l = subscriptions.length; i < l; i++) {
-      subscriptions[i](value);
-    }
+    // Notify all subscribers by invoking their callback functions.
+    subscribers.forEach((subscriber) => subscriber());
   };
 
-  // Assign the signal variable an array containing the get, set, and subscribe functions
-  let signal: SignalInterface = [get, set, subscribe, subscriptions];
+  const signal: signal = [getValue, setValue, subscribe, subscribers];
 
-  // If the context object has a vnode property, add the signal to the vnode's signals array
-  // and add the subscriptions array to the vnode's subscriptions array
-  if (vnode && component) {
-    component.signals.push(signal);
+  if (current.component) {
+    const SignalCalls = componentToSignalsWeakMap.get(current.component) as SignalCalls;
+    SignalCalls.signals.push(signal);
   }
 
-  // Return the signal
   return signal;
 }

package/lib/store/index.ts

@@ -31,7 +31,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]]);
       }
@@ -60,7 +60,7 @@ export const Store = function Store(
     }
   }
 
-  let localState = typeof state === "function" ? state() : state;
+  const localState = typeof state === "function" ? state() : state;
 
   this.state = new Proxy(localState || {}, {
     get: (state, prop: string) => deepFreeze(state[prop]),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "valyrian.js",
-  "version": "7.2.11",
+  "version": "7.2.12",
   "description": "Lightweight steel to forge PWAs. (Minimal Frontend Framework with server side rendering and other capabilities)",
   "repository": "git@github.com:Masquerade-Circus/valyrian.js.git",
   "author": "Masquerade <christian@masquerade-circus.net>",
@@ -20,8 +20,15 @@
       "import": "./dist/index.mjs",
       "require": "./dist/index.js"
     },
+    "./lib": {
+      "types": "./lib/index.ts",
+      "import": "./lib/index.ts",
+      "require": "./lib/index.ts"
+    },
     "./lib/*": {
-      "import": "./lib/*/index.ts"
+      "types": "./lib/*/index.ts",
+      "import": "./lib/*/index.ts",
+      "require": "./lib/*/index.ts"
     },
     "./*": {
       "types": "./dist/*.d.ts",
@@ -60,7 +67,7 @@
   },
   "scripts": {
     "dev:source": "NODE_ENV=development nodemon --enable-source-maps -e tsx,ts,json,css -w ./lib -w ./www source.js",
-    "dev:test": "nodemon --enable-source-maps -e mjs,js,ts,json,css,tsx,jsx -w ./lib -w ./test -w ./dist --exec 'mocha --bail --timeout 15000 --slow 0 --require ./register --enable-source-maps \"test/**/*_test.js\"'",
+    "dev:test": "nodemon --enable-source-maps -e mjs,js,ts,json,css,tsx,jsx -w ./lib -w ./test -w ./dist --exec 'mocha --bail --timeout 15000 --slow 0 --require ./register --enable-source-maps --reporter ./test/reporter.js \"test/**/*_test.js\"'",
     "dev:test:nyc": "nodemon --enable-source-maps -w ./test -w ./lib -w ./plugins --exec 'nyc --reporter=text --reporter=lcov mocha --timeout 15000 --slow 0 --require ./register \"test/**/*_test.js\"'",
     "dev:web": "browser-sync start --config 'www/bs-config.js'",
     "build": "npm run build:source && npm run remark",

package/lib/interfaces.ts.bak

@@ -1,141 +0,0 @@
-/* eslint-disable no-use-before-define */
-/* eslint-disable no-unused-vars */
-declare module "valyrian.js" {
-  interface DefaultRecord extends Record<string | number | symbol, any> {}
-
-  // The VnodeProperties interface represents properties that can be passed to a virtual node.
-  export interface VnodeProperties extends DefaultRecord {
-    // A unique key for the virtual node, which can be a string or a number.
-    // This is useful for optimizing updates in a list of nodes.
-    key?: string | number;
-    // A state object that is associated with the virtual node.
-    state?: any;
-  }
-
-  // The DomElement interface extends the Element interface with an index signature.
-  // This allows for any additional properties to be added to DOM elements.
-  export interface DomElement extends Element, DefaultRecord {}
-
-  // The VnodeInterface represents a virtual node. It has a number of optional fields,
-  // including a tag, props, children, and a DOM element.
-  export interface VnodeInterface extends DefaultRecord {
-    // The constructor for the virtual node. It takes a tag, props, and children as arguments.
-    // The tag can be a string, a component, or a POJO component.
-    // eslint-disable-next-line no-unused-vars
-    new (tag: string | Component | POJOComponent, props: VnodeProperties, children: Children): VnodeInterface;
-    // The tag for the virtual node. It can be a string, a component, or a POJO component.
-    tag: string | Component | POJOComponent;
-    // The props for the virtual node.
-    props: VnodeProperties;
-    // The children for the virtual node.
-    children: Children;
-    // A boolean indicating whether the virtual node is an SVG element.
-    isSVG?: boolean;
-    // The DOM element that corresponds to the virtual node.
-    dom?: DomElement;
-    // A boolean indicating whether the virtual node has been processed in the keyed diffing algorithm.
-    processed?: boolean;
-  }
-
-  // The VnodeWithDom interface represents a virtual node that has a DOM element associated with it.
-  export interface VnodeWithDom extends VnodeInterface {
-    dom: DomElement;
-  }
-
-  // The Component interface represents a function that returns a virtual node or a list of virtual nodes.
-  // It can also have additional properties.
-  export interface Component extends DefaultRecord {
-    // The function that returns a virtual node or a list of virtual nodes.
-    // It can take props and children as arguments.
-    // eslint-disable-next-line no-unused-vars
-    (props?: VnodeProperties | null, ...children: any[]): VnodeInterface | Children | any;
-  }
-
-  // The POJOComponent interface represents a "plain old JavaScript object" (POJO) component.
-  // It has a view function that returns a virtual node or a list of virtual nodes,
-  // as well as optional props and children.
-  // It can be used also to identify class instance components.
-  export interface POJOComponent extends DefaultRecord {
-    // The view function that returns a virtual node or a list of virtual nodes.
-    view: Component;
-    // The props for the component.
-    props?: VnodeProperties | null;
-    // The children for the component.
-    children?: any[];
-  }
-
-  // The VnodeComponentInterface represents a virtual node that has a component as its tag.
-  // It has props and children, just like a regular virtual node.
-  export interface VnodeComponentInterface extends VnodeInterface {
-    tag: Component | POJOComponent;
-    props: VnodeProperties;
-    children: Children;
-  }
-
-  // The Children interface represents a list of virtual nodes or other values.
-  export interface Children extends Array<VnodeInterface | VnodeComponentInterface | any> {}
-
-  // The Directive interface represents a function that can be applied to a virtual node.
-  // It receives the value, virtual node, and old virtual node as arguments, and can return a boolean value.
-  // If only the virtual node is passed, it means its the on create phase for the v-node.
-  // If the old virtual node is also passed, it means its the on update phase for the v-node.
-  export interface Directive {
-    // eslint-disable-next-line no-unused-vars
-    (value: any, vnode: VnodeWithDom, oldVnode?: VnodeWithDom): void | boolean;
-  }
-
-  // The Directives interface is a mapping of directive names to Directive functions.
-  export interface Directives extends Record<string, Directive> {}
-
-  // The ReservedProps interface is a mapping of reserved prop names to the value `true`.
-  // These prop names cannot be used as custom prop names.
-  export interface ReservedProps extends Record<string, true> {}
-
-  // The Current interface represents the current component and virtual node that are being processed.
-  export interface Current {
-    // The current component. It can be a component, a POJO component, or null.
-    component: Component | POJOComponent | null;
-    // The current virtual node. It must have a DOM element associated with it.
-    vnode: VnodeWithDom | null;
-    // The old virtual node. It must have a DOM element associated with it.
-    oldVnode?: VnodeWithDom | null;
-    // The current event. It can be an event or null.
-    event: Event | null;
-  }
-
-  // The V function is the main function for creating virtual nodes.
-  // It takes a tag or component, props, and children as arguments, and returns a virtual node.
-  export interface V {
-    // eslint-disable-next-line no-unused-vars, no-use-before-define
-    (tagOrComponent: string | Component | POJOComponent, props: VnodeProperties | null, ...children: Children):
-      | VnodeInterface
-      | VnodeComponentInterface;
-    // eslint-disable-next-line no-unused-vars, no-use-before-define
-    fragment(_: any, ...children: Children): Children;
-  }
-
-  export let isNodeJs: boolean;
-  export function createDomElement(tag: string, isSVG?: boolean): DomElement;
-  export const Vnode: VnodeInterface;
-  export function isComponent(component: any): component is Component;
-  export const isVnode: (object?: unknown | VnodeInterface) => object is VnodeInterface;
-  export const isVnodeComponent: (object?: unknown | VnodeComponentInterface) => object is VnodeComponentInterface;
-  export function domToVnode(dom: any): VnodeWithDom;
-  export function trust(htmlString: string): any;
-  export const current: Current;
-  export const reservedProps: Record<string, true>;
-  export function onMount(callback: any): void;
-  export function onUpdate(callback: any): void;
-  export function onCleanup(callback: any): void;
-  export function onUnmount(callback: any): void;
-  export const directives: Directives;
-  export function directive(name: string, directive: Directive): void;
-  export function setAttribute(name: string, value: any, newVnode: VnodeWithDom, oldVnode?: VnodeWithDom): void;
-  export function updateAttributes(newVnode: VnodeWithDom, oldVnode?: VnodeWithDom): void;
-  export function patch(newVnode: VnodeWithDom, oldVnode?: VnodeWithDom): void;
-  export function update(): void | string;
-  export function updateVnode(vnode: VnodeWithDom, oldVnode: VnodeWithDom): string | void;
-  export function unmount(): string | void;
-  export function mount(dom: any, component: any): string | void;
-  export const v: V;
-}