vaderjs 1.4.1-lv56aadeg5 → 1.4.2-bml56

package/binaries/readme.md

@@ -1,4 +0,0 @@
-#Binaries
-
-Folder contains polyfills for missing functionality within windows
-Folder contains ssg code for generating html pages for each route on the fly

package/binaries/watcher.js

@@ -1,74 +0,0 @@
-/**
-
- * @file watcher.js
-
- * @description This file is used as a polyfill for missing functionality of bun.js fs watch on windows
-
- */
-
-import { watch } from "fs";
-
-import IPC from "../binaries/IPC/index.js";
-
-IPC.NOLISTEN = true;
-
-const s = await IPC.newServer(IPC.typeEnums.WATCHER, { port: process.env.PORT || 3434 });
-
-console = s.Console;
-
-process.cwd = () => {
-  return process.env.PWD;
-};
-
-let folders = process.env.FOLDERS.split(","); 
-
-let hasSent = false;
-
-folders.forEach((folder) => {
-  watch(process.cwd() + "/" + folder, { recursive: true }, (event, filename) => {
-    switch (event) {
-      case "change":
-        if (!hasSent) {
-          console.log({ type: "change", filename });
-
-          hasSent = true;
-
-          setTimeout(() => {
-            hasSent = false;
-          }, 500);
-        }
-
-        break;
-
-      case "add":
-        if (!hasSent) {
-          console.log({ type: "add", filename });
-
-          hasSent = true;
-
-          setTimeout(() => {
-            hasSent = false;
-          }, 500);
-        }
-
-        break;
-
-      case "close":
-        if (!hasSent) {
-          console.log({ type: "close", filename });
-
-          hasSent = true;
-
-          setTimeout(() => {
-            hasSent = false;
-          }, 500);
-        }
-
-        break;
-    }
-  });
-});
-
-process.on("exit", function (code) {
-  console.log("About to exit with code:", code);
-});

package/binaries/win32/check.ps1

@@ -1,7 +0,0 @@
-$chrometest = Test-Path 'HKLM:\SOFTWARE\Microsoft\Windows\CurrentVersion\App Paths\chrome.exe'
-
-if($chrometest -eq $true){
-   Write-Host "Google Chrome is installed"
-}else{
-   Write-Host "Google Chrome is not installed"
-}

package/client/index.js

@@ -1,441 +0,0 @@
-/**
- * @file Vader.js - A lightweight, modern, and fast front-end framework for building web applications.
- * @copyright - Malikwhitten67 
- * @license MIT
- */
-
-
-/**
- * @class Component
- * @description Base class for all components - functional and class components
- * @example 
- * class App extends Component {
- *    constructor(props){
- *     super(props)
- *     this.state = {
- *         count: 0
- *       }
- *    }
- * 
- *    render(){
- *      return  <div>
- *           <h1>Count is {this.state.count}</h1>
- *          <button onClick={()=> this.setState({count: this.state.count + 1})}>Click me</button>
- *      </div>
- *     }
- * }
- * 
- */
-export class Component {
-  /**
-   * @constructor 
-   * @param {object} props - Component props
-   * @param {string} props.key - Unique identifier for the component
-   * @param {object} props.children - Content to be displayed inside the component
-   */
-  constructor() {
-    this.state = {};
-    this.props = {};
-    this.key = Math.random();
-    this.__internalInstance = {};
-  }
-
-  /**
-   * @function
-   * @description  This method allows you to update the state of a component
-   */
-  render() {}
-  /**
-   *  @function
-   * @description  This method allows you to update the state of a component
-   * **/
-  onMount() {}
-
-  /**
-   * @function
-   * @description  This method allows you to update the state of a component 
-   * @param {any} initialValue 
-   * @returns  {[any, Function]}
-   */
-
-  useState(initialValue) {
-    if (!this.state[key]) this.state[key] = initialValue;
-    let state = this.state[key];
-    const setState = (newState) => {
-      state = newState;
-      this.state[key] = newState;
-      this.updateInstance(this.__internalInstance);
-    };
-    const getUpdatedState = () => {
-      return this.state[key] || initialValue;
-    }
-    state = getUpdatedState();
-    return [state, setState];
-  
-  }
-
-  /**
-   * @function useRef
-   * @description  This method allows you to create a reference to a DOM element
-   * @param {string} key
-   * @param {any} initialValue
-   * @returns {current: any}
-   */
-  useRef(initialValue) {
-    return {current: initialValue}
-  }
-
-  /**
-   * @function useReducer
-   * @description  This method allows you to use a reducer to manage state
-   * @param {function} reducer
-   * @param {any} initialState
-   */
-  useReducer(reducer, initialState) {
-    if (!this.state[key]) this.state[key] = initialState;
-    let state = this.state[key];
-    const setState = (newState) => {
-      state = newState;
-      this.state[key] = newState;
-      this.updateInstance(this.__internalInstance);
-    };
-    const getUpdatedState = () => {
-      return this.state[key] || initialState;
-    }
-    state = getUpdatedState();
-    return [state, setState];
-  }
-  
-}
- 
-/**
- * @method Mounted
- * @description  This method allows you to await until the component is mounted before running a callback
- *  
- * @param {function} callback - Function to be called when the component is mounted
- * @param {Component} component - Component to be determined mounted
- * @param {boolean} runOnlyOnce - Run the callback only once - default: true
- */
-export const Mounted = (callback, /**@type {Component} */ component, runOnlyOnce = true) => {
-
-};
- 
- 
-
-/**
- * @function fontmatter
- * @description  This method allows you to get the frontmatter of a markdown file
- * @param {string} path - Path to the markdown file
- * @returns {{title: string, description: string, content: string}}
- */
-
-export const fontmatter = (path) => {
-  return {
-    title: '',
-    description: '',
-    content: Object.keys({}).includes('content') ? '' : ''
-  }
-
-}
-
-
-
-
- 
-
-
-
-/**
-* @class Link
-* @description Allows you to seamlessly navigate to different pages in your application
-* @extends Component
-* @example
-* <Link href="/some-path" class="custom-link" style="color: blue;">Click me!</Link>
-*/
-export class Link extends Component {
-  /**
-     * @constructor
-     * @param {object} props - Component props 
-     * @param {string} props.href - URL for the link 
-     * @param {string} props.action - Action to be performed when the link is clicked - can be function or string
-     * @param {string} [props.class] - CSS class for the link
-     * @param {string} [props.style] - Inline CSS style for the link
-     * @param {string} [props.children] - Content to be displayed inside the link
-     */
-  constructor(props) {
-    super(props);
-    /**
-          * @type {object}
-          * @property {string} href - URL for the link
-          * @property {string} [action] - Action to be performed when the link is clicked
-          * @property {string} [class] - CSS class for the link
-          * @property {string} [style] - Inline CSS style for the link
-          * @property {string} [children] - Content to be displayed inside the link
-          */
-    this.props = {
-      href: props.href,
-      /**
-       * @type {string|function}
-       * @param {string} [action='outside'] - Action to be performed when the link is clicked
-       */
-      action: props.action || 'outside',
-      class: props.class,
-      style: props.style,
-    }
- 
-    /**
-     * @type {HTMLAnchorElement}
-     */
-    this.link = document.createElement('a');
-
-    /**
-     * @type {string}
-     */
-    this.key = props.href + Math.random();
-  }
-
-  /**
-   * @function
-   * @returns {string} - Rendered HTML for the Link component
-   */
-  render() {
-
-    return this.link.outerHTML;
-  }
-}
-
-
-
-/**
-* @class Image
-* @description Image component
-* @extends Component
-* @example
-* <Image src="https://via.placeholder.com/150"  alt="image" />
-*/
-export class Image extends Component {
-  /**
-   * @constructor
-   * @param {object} props - Component props
-   * @param {string} props.src - Image source URL
-   * @param {string} props.class - CSS class for the image
-   * @param {string} props.style - Inline CSS style for the image
-   * @param {number} props.blur - Blur value for the image (optional)
-   * @param {number} props.width - Width of the image (optional)
-   * @param {number} props.height - Height of the image (optional)
-   * @param {boolean} props.optimize - Optimize the image (optional, default: true)
-   * @param {boolean} props.loader - Show a placeholder loader (optional, default: true)
-   * @param {string} props.alt - Alt text for the image (optional, default: 'image')
-   */
-  constructor(props) {
-    super(props);
-
-    /**
-     * @type {object}
-     * @property {string} src - Image source URL 
-     * @property {string} [class] - CSS class for the image
-     * @property {string} [style] - Inline CSS style for the image
-     * @property {number} [blur] - Blur value for the image (optional)
-     * @property {number} [width] - Width of the image (optional)
-     * @property {number} [height] - Height of the image (optional)
-     * @property {boolean} [optimize] - Optimize the image (optional, default: true)
-     * @property {boolean} [loader] - Show a placeholder loader (optional, default: true)
-     * @property {string} [alt] - Alt text for the image (optional, default: 'image')
-     * @property {string} [children] - Content to be displayed inside the image
-     * @property {string} [key] - Unique identifier for the image
-     * @property {string} [onLoad] - Function to be called when the image is loaded
-     */
-    this.props = {
-      src: props.src,
-      class: props.class,
-      style: props.style,
-      blur: props.blur,
-      width: props.width,
-      height: props.height,
-      optimize: props.optimize || true,
-      loader: props.loader || true,
-      alt: props.alt || 'image',
-    };
-
-    /**
-     * @type {string}
-     */
-    this.key = props.src + Math.random();
-
-    /**
-     * @type {HTMLImageElement}
-     * @private
-     */
-    this.img = document.createElement('img');
-
-    /**
-     * @type {HTMLDivElement}
-     * @private
-     */
-    this.placeholder = document.createElement('div');
-  }
-
-  /**
-   * @function
-   * @returns {string} - Rendered JSX for the Image component
-   */
-  render() {
-    // adjust width and height to the user's screen size
-
-
-    return this.img.outerHTML;
-  }
-}
-
-export class Head extends Component {
-  /**
-  * @constructor
-  * @param {object} props - Component props
-  * @param {boolean} props.updateOnReload - update metadata and title when rerendered
-  * @param {string} props.children - Content to be displayed inside the head
-  */
-  constructor(props) {
-    super(props);
-    /**
-* @type {object}
-* @param {object} props - Component props
-* @param {boolean} props.updateOnReload - update metadata and title when rerendered
-* @param {string} props.children - Content to be displayed inside the head
-*/
-    this.props = {
-      children: props.children,
-      updateOnReload: props.updateOnReload
-    }
-    this.key = 'head';
-    this.head = document.createElement('head');
-  }
-
-
-
-  render() {
-    this.head.innerHTML = this.props.children;
-    return this.head.outerHTML;
-  }
-
-  onMount() {
-    document.head.innerHTML = this.head.innerHTML;
-    document.body.querySelector(`[key="${this.key}"]`).remove();
-  }
-}
-
-export class Script extends Component {
-  /**
-  * @constructor
-  * @param {object} props - Component props
-  * @param {string} props.children - Content to be displayed inside the script
-  */
-  constructor(props) {
-    super(props);
-    this.props = {
-      children: props.children,
-    }
-    this.key = 'script';
-    this.script = document.createElement('script');
-  }
-
-
-
-  render() {
-    this.script.innerHTML = this.props.children.split('\n').join(';\n');
-    return this.script.outerHTML;
-  }
-
-  onMount() {
-    document.head.appendChild(this.script);
-    document.body.querySelector(`[key="${this.key}"]`).remove();
-  }
-
-}
-
-/**
- * @class HTML
- * @description HTML component 
- * @extends Component
- */
-export class Html extends Component {
-  /**
-   * @constructor
-   * @param {object} props - Component props
-   * @param {string} props.key - Identifier which is used to check if the component has been mounted
-   * @param {string} props.children - Content to be displayed inside the HTML
-   * @param {string} props.lang - Language for the HTML
-   */
-  constructor(props) {
-    super(props);
-    /**
-     * @type {object}
-     * @property {string} children - Content to be displayed inside the HTML
-     * @property {string} lang - Language for the HTML
-     * @property {object} attributes - Attributes for the HTML
-     */
-    this.props = {
-      children: props.children,
-      lang: props.lang || 'en',
-      attributes: props.attributes || {},
-    }
-    this.key =  props.key || 'html';
-    this.html = document.createElement('html');
-  }
-
-  render() {
-    this.html.innerHTML = this.props.children;
-    return this.html.outerHTML;
-  }
-
-  onMount() {
-    if (window.isServer) {
-      document.documentElement.innerHTML = this.html.outerHTML;
-    }
-    console.log('Document Has Been Mounted')
-  }
-
-}
-/**
- * @function useRef
- * @description  This method allows you to create a reference to a DOM element
- * @param {any} initialValue 
- * @returns 
- */
-export const useRef = (initialValue) => {
-  return {
-    current: initialValue
-  } 
-}
-
-/**
- *  @function useState
- * @description  This method allows you to use to bind state to a component and update on changes
- * @param {any} initialValue 
- * @returns  {[any, Function]}
- */
-export const useState = (initialValue) => {
-  return [initialValue, () => {}]
-}
-/**
- * @function useReducer
- * @description  This method allows you to use a reducer to manage state
- * @param {function} reducer 
- * @param {any} initialState 
- * @returns 
- */
-
-export const useReducer = (reducer, initialState) => {
-  return [initialState, () => {}]
-}
-export default {
-  Component,
-  useRef,
-  useReducer,
-  useState,
-  strictMount,
-  Link,
-  Image,
-  Head,
-  Html,
-
-}

package/config/index.js

@@ -1,36 +0,0 @@
-/**
- * @function defineConfig
- * @description Define the configuration for the application
- * @param {Object} config 
- * @param {Object} config.host -  Important metadata
- * @param {string} config.host.hostname - The hostname for your webapplication
- * @param {Object} config.host.prod - Define data for production use
- * @param {Number} config.host.prod.port - The production port for your webapp
- * @param {('vercel'|'netlify'|'cloudflare')} config.host.provider - Helps vader to generate routes for your webapp
- * @param {Object} config.dev - The development server configuration
- * @param {Number} config.dev.port - The port to use for the development server
- * @param {('localhost')} config.dev.host - The hostname to use for the development server
- * @param {Array} config.integrations - Additional integrations to enhance vaderjs
- * @param {Function} config.integrations[0] - The integration to use for the application
- * @returns {Object} The defined configuration
- */
-export const defineConfig = (config = {
-    host: {
-        provider: '',
-        hostname:'',
-        prod:{
-          port:3000, 
-        }
-    },
-    dev: {
-        port: 3000, // Default port for the development server
-        host: 'localhost' // Default hostname for the development server
-    },
-    integrations: []
-}) => {
-    return config;
-};
-
-export default {
-    defineConfig
-};

package/runtime/router.js

@@ -1 +0,0 @@
-import t from"./vader.js";let e=[];export default class Router{constructor(t,e){this.routes=[],this.middlewares=[],this.errorMiddlewares=[],this.listeners=[],this.basePath=t}get(t,e){this.routes.push({method:"get",path:t,handler:e})}use(t){this.middlewares.push(t)}matchingRoute(){return routes.find((t=>t.url===window.location.pathname||window.location.pathname.split("/")[1]===t.url.split("/")[1]||void 0))}listen(t,e){t||(t=Math.random().toString(36).substring(7)),this.listeners.push(t),window.onpopstate=async t=>{let e=window.location.pathname;if(e.includes("#noNavigation"))return;let r=`/${e.split("/")[1]}`,n=(new DOMParser).parseFromString(await fetch(r,{cache:"reload"}).then((t=>t.text())),"text/html").documentElement,o=(n.querySelector("head"),n.querySelector("body"));document.querySelector("#app").innerHTML=o.querySelector("#app").innerHTML;let s=document.createElement("script");s.id="router",s.innerHTML=o.querySelector('script[id="router"]').innerHTML,s.setAttribute("type","module"),document.body.removeChild(document.getElementById("router")),document.body.appendChild(s)},window.location.pathname.includes("#noNavigation")||(console.log("no navigation"),this.handleRoute(window.location.pathname)),e&&e()}render(e){document.querySelector("#app").innerHTML="",t.render(e,document.querySelector("#app"))}extractParams(t,e){const r=t.split("/").filter((t=>""!==t)),n=e.split("/").filter((t=>""!==t)),o={};return r.forEach(((t,e)=>{if(t.startsWith(":")){const r=t.slice(1);o[r]=n[e]}else if(t.startsWith("*")){n.slice(e).forEach(((t,e)=>{o[e]=t}))}})),o}extractQueryParams(t){const e=t.split("?")[1];if(!e)return{};const r={};return e.split("&").forEach((t=>{const[e,n]=t.split("=");r[e]=n})),r}checkroute(t){return(t=t.endsWith("/")?t.slice(0,-1):t).includes("index.html")&&(t=t.replace("index.html","")),t.includes("?")&&(t=t.split("?")[0]),this.routes.find((e=>{if(console,e.path===t)return!0;if(""===t&&"/"===e.path)return!0;if(e.path.includes("*")||e.path.includes(":")){const r=e.path.split("/").filter((t=>""!==t)),n=t.split("/").filter((t=>""!==t));if(this.basePath&&n.shift(),console.log(r,n),r.length!==n.length&&!e.path.endsWith("*"))return!1;for(let t=0;t<r.length;t++){const e=r[t],o=n[t];if(!e.startsWith(":")&&!e.startsWith("*")&&e!==o)return!1}return!0}const r=this.extractParams(e.path,t);return Object.keys(r).length>0}))}handleRoute(r){let n=200,o={},s=r,a=this.checkroute(r);a||(n=404,a=this.routes.find((t=>"*"===t.path)),a&&(o=this.extractParams(a.path,r)));const i=this.extractQueryParams(s),l=a&&a.path?this.extractParams(a.path,s):o;Object.keys(l).forEach((t=>{l[t]=l[t].split("?")?l[t].split("?")[0]:l[t]}));const c={headers:{},params:l,query:i,path:r,fileUrl:window.location.href.split(window.location.origin)[1],url:window.location.href,method:a?a.method:"get",pause:!1,timestamp:Date.now()};window.$CURRENT_URL=c.path,window.$basePath=" ",window.$FULL_URL=window.location.href.replace("#","");const h={status:n,log:t=>{void 0===t?console.log(`${c.path} ${c.method} ${h.status} ${c.timestamp}`):console.table({"Request Path":c.path,"Request Method":a.method,"Response Status":h.status,"Request Timestamp":c.timestamp})},refresh:()=>{this.handleRoute(window.location.pathname)},redirect:t=>{!t.startsWith("/")&&(t=`/${t}`),window.history.pushState({},"",t),window.dispatchEvent(new Event("popstate"))},render:async e=>{e?.default&&(e=e.default),document.querySelector("#app").innerHTML="",t.render(e,document.querySelector("#app"),{passProps:{router:{req:c,res:h}}})},setQuery:t=>{if($SERVER)return;let e="";Object.keys(t).forEach(((r,n)=>{e+=`${0===n?"?":"&"}${r}=${t[r]}`}));let r=window.location.pathname.split("?")[0];e=e.replace("/","-").replaceAll("/","-"),c.query={...c.query,...t},window.history.pushState({},"",`${r}${e}`)},getQuery:t=>{let e=window.location.search,r=new URLSearchParams(e);return t?r.get(t.key):r},send:t=>{document.querySelector("#app").innerHTML=t},json:t=>{const e=document.querySelector("#app");e.innerHTML="";const r=document.createElement("pre");r.textContent=JSON.stringify(t,null,2),e.appendChild(r)}};e.forEach((t=>{t(c,h)})),a?h.render(a.handler):h.status(404).send("Not Found")}}

package/runtime/vader.js

@@ -1 +0,0 @@
-let e=[],t={},s={};export const Mounted=(t,s,r=!1)=>{let n=setInterval((()=>{switch(!0){case r&&e.includes(s.key):return clearInterval(n);case r&&!e.includes(s.key):e.push(s.key),t();break;case!document.querySelector(`[key="${s.key}"]`):return;default:t(),clearInterval(n)}}),100)};export class Component{constructor(e){this.state=s[this.constructor.name]||{},this.__internalInstance=null,this.key=e?.key||Math.random(),this.checkMount(),this.mounted=!1,this.props=e,this.useKey=e=>{this.props.key=e,this.key=e}}setState(e){this.state=Object.assign({},this.state,e),this.updateInstance(this.__internalInstance)}useState(e,t){this.state[e]||(this.state[e]=t);let s=this.state[e];const state=()=>this.state[e];return[state,t=>{this.state[e]=t,this.updateInstance(this.__internalInstance),s=state()}]}useRef(e,t){return this.state[e]||(this.state[e]=t),{current:this.state[e]}}onMount(){}domDifference(e,t){let s=[];for(let r=0;r<e.length;r++){let n=e[r],a=t[r];n&&a&&n.childNodes.length>0&&a.childNodes.length>0&&s.push(...this.domDifference(Array.from(n.childNodes),Array.from(a.childNodes))),n.nodeValue!==a.nodeValue&&s.push({type:"replace",old:n,new:a})}return s}checkMount(){if(this.mounted)return;setInterval((()=>{document.querySelector(`[key="${this.key}"]`)&&!this.mounted&&(this.mounted=!0,this.onMount())}))}updateChangedElements(e){e.forEach((e=>{if(e)switch(e.type){case"replace":if(e.old.panrntNode&&"BODY"===e.old.parentNode.nodeName)return;e.old.replaceWith(e.new.cloneNode(!0));break;case"remove":e.old.remove();break;case"attributeSwap":let t=Array.from(e.old.attributes),s=Array.from(e.new.attributes);t.forEach((t=>{e.old.removeAttribute(t.name)})),s.forEach((t=>{e.old.setAttribute(t.name,t.value)}));break;case"add":e.old.appendChild(e.new.cloneNode(!0))}}))}updateInstance(e){let t=document.querySelector(`[key="${this.key}"]`)||document.querySelector("#app").firstChild,s=r.render(e,t,{return:!0}),n=this.domDifference(Array.from(t.childNodes),Array.from(s.childNodes));console.log(n),this.updateChangedElements(n)}parseStyle(e,t,s={useImportant:!1}){let r="",n=document.head.querySelector("#vader-stylesheet")||document.createElement("style");return n.setAttribute("id","vader-stylesheet"),Object.keys(e).forEach((a=>{let i=e[a],o="",l="";switch(!0){case a.includes("hover"):return o=a.split("hover(")[1].replace(/\)/g,""),l=`.${o}:hover{${this.parseStyle(i,t,{useImportant:!0})}};`,n.innerHTML.includes(l)||(n.innerHTML+=l),void t.classList.add(o);case a.includes("transition"):let e=`transition:${i} ${s.useImportant?" !important":""};`;r+=e;break;case a.includes("@mobile"):o=a.split("@mobile")[1].replace(/\(/g,"").replace(/\)/g,""),l=`@media (max-width: 768px){.${o}{${this.parseStyle(i,t,{useImportant:!0})}};}`,document.querySelector("#vader-stylesheet").innerHTML.includes(l)||(document.head.querySelector("#vader-stylesheet").innerHTML+=l),t.classList.add(o);break;case a.includes("@tablet"):o=a.split("@tablet")[1].replace(/\(/g,"").replace(/\)/g,""),l=`@media (min-width: 769px) and (max-width: 1024px){.${o}{${this.parseStyle(i,t,{useImportant:!0})}};}`,document.querySelector("#vader-stylesheet").innerHTML.includes(l)||(document.head.querySelector("#vader-stylesheet").innerHTML+=l),t.classList.add(o);break;case a.includes("@desktop"):o=a.split("@desktop")[1].replace(/\(/g,"").replace(/\)/g,""),l=`@media (min-width: 1025px){.${o}{${this.parseStyle(i,t,{useImportant:!0})}};}`,document.querySelector("#vader-stylesheet").innerHTML.includes(l)||(document.head.querySelector("#vader-stylesheet").innerHTML+=l),t.classList.add(o);break;case a.includes("transform"):let c=`transform:${i} ${s.useImportant?" !important":""};`;r+=c;break;case a.includes("animation"):r+=`animation:${i};`;break;case a.includes("active"):o=a.split("active(")[1].replace(/\)/g,""),l=`.${o}:active{${this.parseStyle(i,t,{useImportant:!0})}};`,n.innerHTML.includes(l)||(n.innerHTML+=l),t.classList.add(o);break;case a.includes("body"):let d=`body{${this.parseStyle(i,t)}};`;return void(document.head.querySelector("#vader-stylesheet").innerHTML.includes(`body{${this.parseStyle(i,t)}};`)||(document.head.querySelector("#vader-stylesheet").innerHTML+=d));case a.includes("focus"):o=a.split("focus(")[1].replace(/\)/g,"");let p=`.${o}:focus{${this.parseStyle(i,t,{useImportant:!0,noReturn:!0})}};`;n.innerHTML.includes(p)||(n.innerHTML+=p),t.classList.add(o);break;case a.includes("before"):o=a.split("before(")[1].replace(/\)/g,"");let h=`.${o}::before{${this.parseStyle(i,t,{useImportant:!0,noReturn:!0})}};`;n.innerHTML.includes(h)||(n.innerHTML+=h),t.classList.add(o);break;case a.includes("after"):o=a.split("after(")[1].replace(/\)/g,"");let u=`.${o}::after{${this.parseStyle(i,t,{useImportant:!0,noReturn:!0})}};`;n.innerHTML.includes(u)||(n.innerHTML+=u),t.classList.add(o);break;case a.includes("placeholder"):o=a.split("placeholder(")[1].replace(/\)/g,"");let y=`.${o}::placeholder{${this.parseStyle(i,t,{useImportant:!0,noReturn:!0})}};`;n.innerHTML.includes(y)||(n.innerHTML+=y),t.classList.add(o);break;case a.includes("first-child"):o=a.split("first-child(")[1].replace(/\)/g,"");let m=`.${o}:first-child{${this.parseStyle(i,t,{useImportant:!0,noReturn:!0})}};`;n.innerHTML.includes(m)||(n.innerHTML+=m),t.classList.add(o);break;case a.includes("last-child"):o=a.split("last-child(")[1].replace(/\)/g,"");let f=`.${o}:last-child{${this.parseStyle(i,t,{useImportant:!0,noReturn:!0})}};`;n.innerHTML.includes(f)||(n.innerHTML+=f),t.classList.add(o);break;case a.includes("nth-child"):o=a.split("nth-child(")[1].replace(/\)/g,"").split("(")[0];let k=`.${o}:nth-child(${a.split("nth-child(")[1].replace(/\)/g,"").split("(")[1]}){${this.parseStyle(i,t,{useImportant:!0,noReturn:!0})}};`;n.innerHTML.includes(k)||(n.innerHTML+=k),t.classList.add(o);break;case a.includes(">"):let b=`${a}{${this.parseStyle(i,t)}};`;n.innerHTML.includes(b)||(n.innerHTML+=b),t.classList.add(o)}a=a.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g,"$1-$2").toLowerCase(),r+=`${a}:${i} ${s.useImportant?" !important":""};`})),document.head.querySelector("#vader-stylesheet")||document.head.appendChild(n),r}}export const useState=e=>{this.state[key]||(this.state[key]=e);let t=this.state[key];const getUpdatedState=()=>this.state[key]||e;return t=getUpdatedState(),[getUpdatedState,e=>{t=e,this.state[key]=e,this.updateInstance(this.__internalInstance)}]};export const useReducer=(e,t)=>{const[s,r]=useState(t);return[s,t=>{const n=e(s,t);r(n)}]};export const useRef=e=>{this.state[key]||(this.state[key]=e);let t=this.state[key];return t=(()=>this.state[key]||e)(),[t,e=>{t=e,this.state[key]=e,this.updateInstance(this.__internalInstance)}]};export class Html extends Component{constructor(e){super(e),this.key=e?.key||"DOCUMENT_ROOT",this.props=e,this.checkMount()}render(){return $SERVER?(this.props.lang&&document.documentElement.setAttribute("lang",this.props.lang),r.createElement("div",{children:this.props.children,key:this.key})):r.createElement("div",{children:this.props.children,key:this.key})}onMount(){this.props?.parent&&this.props?.parent&&this.props.parent.onMount()}}export class Head extends Component{constructor(e){super(e),this.head=document.createElement("div"),this.useKey("head"),this.hasRefreshed=!1}render(){if($SERVER||this.props.refresh&&!t[this.key]){Array.isArray(this.props.children)&&this.props.children.forEach((e=>{let s=r.render(e,this.head,{return:!0}),n=this.head.querySelectorAll("*");for(let e=0;e<n.length;e++)n[e].isEqualNode(s)&&console.log("Equal");console.log(this.key,"key"),this.head.appendChild(s),t[this.key]=!0})),Object.keys(this.props).includes("children")&&!Array.isArray(this.props.children)&&this.head.appendChild(r.render(this.props.children,this.head,{return:!0}));let e=document.head;this.head.querySelectorAll("*").forEach((t=>{switch(t.tagName){case"TITLE":e.querySelector("title")&&e.querySelector("title").remove(),e.appendChild(t);break;case"META":return void(e.querySelector(`meta[name="${t.name}"]`)||e.appendChild(t));case"LINK":if($SERVER)return console.log("Server"),void(e.querySelector(`link[href="${t.href}"]`)||e.appendChild(t));case"SCRIPT":if(!t.hasAttribute("eager"))return void(document.querySelector(`script[src="${t.src}"]`)||e.appendChild(t));if(document.querySelector(`script[srcid="${t.src}"]`))return;fetch(t.src).then((e=>e.text())).then((s=>{let r=document.createElement("script");r.innerHTML=s,r.setAttribute("srcid",t.src),r.setAttribute("type",t.type),r.setAttribute("async",t.async||!1),r.setAttribute("defer",t.defer||!1),e.querySelector(`script[srcid="${t.src}"]`)||e.prepend(r)})).catch((e=>{console.warn("Error fetching script",e)}));break;default:console.warn("Unknown tag",t.tagName)}}))}return""}}export class Link extends Component{constructor(e){super(e),this.key=e?.key||Math.random(),this.props=e,this.checkMount()}render(){let e={...this.props,href:this.props?.href,onClick:e=>{switch(e.preventDefault(),!0){case"outside"===this.props.action:console.log("Outside"),e.preventDefault(),window.open(this.props.href,"_blank");break;case"function"==typeof this.props.action:this.props.action(e);break;default:e.preventDefault(),window.history.pushState({},"",this.props.href),window.dispatchEvent(new Event("popstate"))}},key:this.key};return r.createElement("a",e,this.props?.key,null)}}let r=new class vjsx{constructor(){this._vjsx=!0}isClass(e){return/^\s*class\s+/.test(e.toString())}instanizeClass(e,t={}){if("string"==typeof e||"object"==typeof e)return e;switch(this.isClass(e)){case!0:let r=new e(t);return s[e.name]=r.state,r.state=s[e.name],r.$$typeof="vjsx",r.type=e.name,r.key=t?.key||r.name,r.props=t,r.__internalInstance=()=>r.render(r.props),r.render();case!1:let n=new Component;n.key=e.name+Math.random(),e.$$typeof="vjsx",e.useState=n.useState.bind(n),e.setState=n.setState.bind(n),s[e.name]=n.state,n.state=s[e.name],e.state=n.state;let a={},i={};return t?.router&&(a=t.router.req,i=t.router.res),n.__internalInstance=()=>e.bind(n)(t,a,i),e.apply?e.apply(n,[t,a,i]):e}}createElement(e,t,s,...r){let n="function"==typeof e,a=r.find((e=>"vjsx"===e?.$$typeof));if(n)return t.key=s||t?.key||Math.random(),t.parent=a,this.instanizeClass(e,t);let i={type:e,RootParent:a,props:{...t,key:t?.key||Math.random(),children:Array.isArray(t.children)?t.children:[t.children]}};return"TEXT_ELEMENT"===("string"==typeof i?"TEXT_ELEMENT":i.type)?function createTextElement(e){return{type:"TEXT_ELEMENT",props:{nodeValue:e,children:[]}}}(i):i}render(e,t,s){let r=this.instanizeClass(e,s?.passProps);if(s&&s?.passProps&&s?.passProps?.router){let e=s.passProps.router.req;s.passProps.router.res;e.pause}if(!r.type)return;let n="TEXT_ELEMENT"===r.type?document.createTextNode(""):document.createElement(r.type),isListener=e=>e.startsWith("on");if(r.props&&(r.props.key&&(r.key=r.props.key),Object.keys(r.props).filter(isListener).forEach((e=>{let t=e.toLowerCase().substring(2);n.addEventListener(t,r.props[e].bind(r))})),Object.keys(r.props).filter((e=>!isListener(e))).forEach((e=>{switch(!0){case"className"===e||"class"===e||"classname"===e:n.setAttribute("class",r.props[e]),delete r.props[e];break;case"ref"===e:if(Array.isArray(r.props[e].current))return void r.props[e].current.push(n);r.props[e].current=n,n.removeAttribute("ref");break;case"htmlFor"===e:n.setAttribute("for",r.props[e]);break;case"style"===e:n.setAttribute("style",Component.prototype.parseStyle(r.props[e],n));break;default:"children"!==e&&n.setAttribute(e,r.props[e])}"TEXT_ELEMENT"!==r.type||(n.nodeValue=r.props[e])}))),r.props&&r.props.children&&Array.isArray(r.props.children)&&r.props?.children&&r.props.children.forEach((e=>{if("number"!=typeof e&&"string"!=typeof e||(e=e.toString()),Array.isArray(e))return void e.forEach((e=>{null!==e&&this.render(e,n,!0)}));if(!e)return;let t="function"==typeof e?this.instanizeClass(e):e;"TEXT_ELEMENT"!==(t?.type?t.type:"TEXT_ELEMENT")?this.render(t,n):n.appendChild(document.createTextNode(t))})),s?.return)return n;r.key&&n.setAttribute("key",r.key),!s?.return&&document.body.contains(t)&&(r?.RootParent?.onMount(),t.innerHTML=""),t.appendChild(n)}},n={createElement:r.createElement,useState:useState,instanizeClass:r.instanizeClass,render:r.render,useRef:useRef,isClass:r.isClass,Head:Head,Html:Html,Mounted:Mounted,Component:Component,Link:Link};export default n;