olova-router 1.0.0

package/README.md

@@ -0,0 +1,18 @@
+# olova
+
+```html
+<div id="app">
+  <template>
+    <div i-data="{count : 0}">
+      <div>{ count }</div>
+      <button @click="count++">Increment</button>
+    </div>
+  </template>
+</div>
+
+<script type="module">
+  import { createApp } from "//unpkg.com/olova";
+  const app = createApp();
+  app.mount("#app");
+</script>
+```

package/dist/router.d.ts

@@ -0,0 +1 @@
+declare module "router";

package/dist/router.js

@@ -0,0 +1,40 @@
+import { createApp } from "olova";
+class Router {
+  constructor() {
+    (this.routes = new Map()), (this.currentApp = null), this.init();
+  }
+  init() {
+    window.addEventListener("popstate", () => this.handleRoute()),
+      document.addEventListener("click", (t) => {
+        if (t.target.matches("a")) {
+          t.preventDefault();
+          const e = t.target.getAttribute("href");
+          this.navigate(e);
+        }
+      }),
+      window.addEventListener("load", () => {
+        this.handleRoute();
+      });
+  }
+  add(t, e) {
+    return this.routes.set(t, e), this;
+  }
+  navigate(t) {
+    window.history.pushState(null, "", t), this.handleRoute();
+  }
+  handleRoute() {
+    const t = window.location.pathname,
+      e = this.routes.get(t),
+      n = document.querySelector("[i-view]");
+    if (n)
+      if (e) {
+        this.currentApp && (n.innerHTML = "");
+        const t = document.createElement("div");
+        (t.id = "route-container"),
+          n.appendChild(t),
+          (this.currentApp = createApp({ ...e })),
+          this.currentApp.mount("#route-container");
+      } else n.innerHTML = "<h1>404 Not Found</h1>";
+  }
+}
+export const router = new Router();

package/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "olova-router",
+  "version": "1.0.0",
+  "description": " olova-router for olovaJs",
+  "main": "dist/router.js",
+  "keywords": [
+    "javascript",
+    "framework",
+    "reactive",
+    "olova",
+    "olovajs"
+  ],
+  "author": "Nazmul Hossain",
+  "license": "MIT",
+  "dependencies": {
+    "olova": "latest"
+  }
+}