From 0028f3ca2330d18773a5a6b271886ce27eb39a60 Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Thu, 17 Dec 2020 00:35:11 +0300
Subject: [PATCH 01/12] refactor: better chunk generation condition on if
 route.component is a generated chunk already

---
 src/Router.svelte | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Router.svelte b/src/Router.svelte
index 6b5a37e..5d18f7a 100644
--- a/src/Router.svelte
+++ b/src/Router.svelte
@@ -198,7 +198,7 @@
         }
 
         if (
-          typeof route.component !== "object" &&
+          typeof route.component.chunk === "undefined" &&
           typeof route.chunkGenerated === "undefined"
         ) {
           route.component = ChunkGenerator(
@@ -209,7 +209,7 @@
           route.chunkGenerated = true;
         }
 
-        if (typeof route.component === "object") {
+        if (typeof route.component.chunk !== "undefined") {
           route.component = route.component.chunk;
 
           route.chunkGenerated = true;

From ad1fd5fbfa22b40c192129737f561ddd22fe252f Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Thu, 17 Dec 2020 00:38:11 +0300
Subject: [PATCH 02/12] refactor: add a isClass method to util file and
 refactor isStatic variable in chunks

---
 src/Chunk.svelte  | 8 +++-----
 src/util.js       | 6 ++++++
 test/Chunk.svelte | 8 +++-----
 3 files changed, 12 insertions(+), 10 deletions(-)
 create mode 100644 src/util.js

diff --git a/src/Chunk.svelte b/src/Chunk.svelte
index b42db2b..a5e71ac 100644
--- a/src/Chunk.svelte
+++ b/src/Chunk.svelte
@@ -3,6 +3,8 @@
   import { get } from "svelte/store";
   import { onMount } from "svelte";
 
+  import { isClass } from "./util";
+
   import {
     isPageLoading,
     isRouteLoading,
@@ -33,11 +35,7 @@
     onMounted = true;
   });
 
-  $: try {
-    component();
-  } catch (e) {
-    isStatic = e.toString().includes("new");
-  }
+  $: isStatic = isClass(component);
 
   $: {
     component;
diff --git a/src/util.js b/src/util.js
new file mode 100644
index 0000000..b12af57
--- /dev/null
+++ b/src/util.js
@@ -0,0 +1,6 @@
+export const isClass = (func) => {
+  return (
+    typeof func === "function" &&
+    /^class\s/.test(Function.prototype.toString.call(func))
+  );
+};
diff --git a/test/Chunk.svelte b/test/Chunk.svelte
index c2aab6a..cd9525d 100644
--- a/test/Chunk.svelte
+++ b/test/Chunk.svelte
@@ -3,6 +3,8 @@
   import { get } from "svelte/store";
   import { onMount } from "svelte";
 
+  import { isClass } from "../src/util";
+
   import {
     isPageLoading,
     isRouteLoading,
@@ -33,11 +35,7 @@
     onMounted = true;
   });
 
-  $: try {
-    component();
-  } catch (e) {
-    isStatic = e.toString().includes("new");
-  }
+  $: isStatic = isClass(component);
 
   $: {
     component;

From 1a895c98cb7f01b852f144d21f3b5051aab73026 Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Thu, 17 Dec 2020 00:40:50 +0300
Subject: [PATCH 03/12] feat: added import promise component support, example:
 `import("./TestPage.svelte")`

---
 src/Chunk.svelte      | 22 ++++++++++++++++++++--
 test/Chunk.svelte     | 22 ++++++++++++++++++++--
 test/router.config.js |  3 +--
 3 files changed, 41 insertions(+), 6 deletions(-)

diff --git a/src/Chunk.svelte b/src/Chunk.svelte
index a5e71ac..035ba6c 100644
--- a/src/Chunk.svelte
+++ b/src/Chunk.svelte
@@ -18,6 +18,9 @@
   let isStatic = false;
   let onMounted = false;
   let isLoadableLoaded = false;
+  let isPromiseLoaded = false;
+
+  let isPromise;
 
   function setPageLoaded() {
     isComponentLoading.set(false);
@@ -30,23 +33,38 @@
     isLoadableLoaded = true;
   }
 
+  function setPromiseLoaded() {
+    setPageLoaded();
+    isPromiseLoaded = true;
+  }
+
   onMount(() => {
     if (isStatic) setPageLoaded();
     onMounted = true;
   });
 
+  $: isPromise = component instanceof Promise;
   $: isStatic = isClass(component);
 
   $: {
     component;
     params;
 
-    if ((isStatic && onMounted) || (!isStatic && isLoadableLoaded))
+    if (
+      (isPromise && isPromiseLoaded) ||
+      (isStatic && onMounted) ||
+      (!isStatic && !isPromise && isLoadableLoaded)
+    )
       setPageLoaded();
   }
 </script>
 
-{#if isStatic}
+{#if isPromise}
+  {#await component.then(({ default: C }) => C) then component}
+    <svelte:component this="{component}" {...params} />
+    {setPromiseLoaded() ? '' : ''}
+  {/await}
+{:else if isStatic}
   <svelte:component this="{component}" {...params} />
 {:else}
   <Loadable loader="{component}" delay="{delay}">
diff --git a/test/Chunk.svelte b/test/Chunk.svelte
index cd9525d..0efdc93 100644
--- a/test/Chunk.svelte
+++ b/test/Chunk.svelte
@@ -18,6 +18,9 @@
   let isStatic = false;
   let onMounted = false;
   let isLoadableLoaded = false;
+  let isPromiseLoaded = false;
+
+  let isPromise;
 
   function setPageLoaded() {
     isComponentLoading.set(false);
@@ -30,23 +33,38 @@
     isLoadableLoaded = true;
   }
 
+  function setPromiseLoaded() {
+    setPageLoaded();
+    isPromiseLoaded = true;
+  }
+
   onMount(() => {
     if (isStatic) setPageLoaded();
     onMounted = true;
   });
 
+  $: isPromise = component instanceof Promise;
   $: isStatic = isClass(component);
 
   $: {
     component;
     params;
 
-    if ((isStatic && onMounted) || (!isStatic && isLoadableLoaded))
+    if (
+      (isPromise && isPromiseLoaded) ||
+      (isStatic && onMounted) ||
+      (!isStatic && !isPromise && isLoadableLoaded)
+    )
       setPageLoaded();
   }
 </script>
 
-{#if isStatic}
+{#if isPromise}
+  {#await component.then(({ default: C }) => C) then component}
+    <svelte:component this="{component}" {...params} />
+    {setPromiseLoaded() ? '' : ''}
+  {/await}
+{:else if isStatic}
   <svelte:component this="{component}" {...params} />
 {:else}
   <Loadable loader="{component}" delay="{delay}">
diff --git a/test/router.config.js b/test/router.config.js
index 13850bc..dc00986 100644
--- a/test/router.config.js
+++ b/test/router.config.js
@@ -2,7 +2,6 @@ import { ChunkGenerator } from "../src/index";
 import chunk from "./Chunk.svelte";
 
 import DefaultPage from "./pages/DefaultPage.svelte";
-import TestPage from "./pages/TestPage.svelte";
 
 const instancePage = ChunkGenerator(
   () => import("./pages/MultipleSameInstance/InstancePage.svelte"),
@@ -16,7 +15,7 @@ export default {
       component: DefaultPage,
     },
     "/test-page": {
-      component: TestPage,
+      component: import("./pages/TestPage.svelte"),
     },
     "/test-page-async": {
       component: ChunkGenerator(

From df5862713e79aab80cd8b7778d0d84e0934fca1a Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Thu, 17 Dec 2020 20:16:04 +0300
Subject: [PATCH 04/12] feat: automatically define sub routers, just use
 `<Router/>` in sub routes

---
 src/Chunk.svelte                            | 10 ++++-
 src/Router.svelte                           | 49 +++++++++------------
 src/RouterStore.js                          |  1 -
 test/Chunk.svelte                           | 10 ++++-
 test/components/Navigator.svelte            |  2 +-
 test/pages/MultipleSameInstance.svelte      |  2 +-
 test/pages/NestedRoutePage.svelte           |  2 +-
 test/pages/NestedRouteParamsTestPage.svelte |  2 +-
 8 files changed, 42 insertions(+), 36 deletions(-)

diff --git a/src/Chunk.svelte b/src/Chunk.svelte
index 035ba6c..17ef5ca 100644
--- a/src/Chunk.svelte
+++ b/src/Chunk.svelte
@@ -1,7 +1,7 @@
 <script>
   import Loadable from "svelte-loadable";
   import { get } from "svelte/store";
-  import { onMount } from "svelte";
+  import { onMount, setContext } from "svelte";
 
   import { isClass } from "./util";
 
@@ -14,6 +14,8 @@
   export let component;
   export let delay = 0;
   export let params = {};
+  export let subRoutes = null;
+  export let subBasePath = null;
 
   let isStatic = false;
   let onMounted = false;
@@ -45,6 +47,12 @@
 
   $: isPromise = component instanceof Promise;
   $: isStatic = isClass(component);
+  $: {
+    if (typeof subRoutes !== "undefined") setContext("route", subRoutes);
+  }
+  $: {
+    if (typeof subBasePath !== "undefined") setContext("basePath", subBasePath);
+  }
 
   $: {
     component;
diff --git a/src/Router.svelte b/src/Router.svelte
index 5d18f7a..ced72d1 100644
--- a/src/Router.svelte
+++ b/src/Router.svelte
@@ -56,7 +56,7 @@
 </script>
 
 <script>
-  import { onDestroy } from "svelte";
+  import { onDestroy, getContext } from "svelte";
   import page from "page";
   import Config from "./router.config";
   import ChunkGenerator from "./ChunkGenerator";
@@ -64,27 +64,24 @@
 
   import DefaultChunkComponent from "./Chunk.svelte";
 
-  import {
-    subRouterRoutesByBasePath,
-    isRouteLoading,
-    isComponentLoading,
-  } from "./RouterStore";
+  import { isRouteLoading, isComponentLoading } from "./RouterStore";
 
   export let routerConfig = Config;
   export let hidden = false;
 
   let props = {};
   let component = null;
+  let subRoutes = null;
+  let subBasePath = null;
 
-  const mainBasePath = routerConfig.basePath || "";
-  export let basePath = mainBasePath;
-
-  const nestedRoute = basePath !== mainBasePath;
+  const nestedRoute = typeof getContext("route") !== "undefined";
   export let pageInstance = nestedRoute ? page.create() : basePageInstance;
 
-  export let routes = nestedRoute
-    ? $subRouterRoutesByBasePath[basePath]
-    : routerConfig.routes;
+  export let routes = nestedRoute ? getContext("route") : routerConfig.routes;
+
+  export let basePath = nestedRoute
+    ? getContext("basePath")
+    : routerConfig.basePath || "";
 
   pageInstance.base(basePath);
 
@@ -222,10 +219,10 @@
         }
 
         if (route.children !== null && typeof route.children === "object") {
-          subRouterRoutesByBasePath.update((value) => {
-            value[basePath + path] = route.children;
-            return value;
-          });
+          subBasePath = basePath + path;
+          subRoutes = route.children;
+        } else {
+          subRoutes = null;
         }
 
         let params = {};
@@ -313,22 +310,16 @@
     });
 
     onDestroy(pathUnsubscribe);
-    onDestroy(() =>
-      subRouterRoutesByBasePath.update((list) => {
-        const newList = [];
-
-        Object.keys(list)
-          .filter((key) => key !== pageInstance.base())
-          .forEach((key) => (newList[key] = list[key]));
-
-        return newList;
-      })
-    );
   }
 
   onDestroy(() => pageInstance.stop());
 </script>
 
 <div hidden="{hidden}">
-  <svelte:component this="{component}" {...props} />
+  <svelte:component
+    this="{component}"
+    {...props}
+    subRoutes="{subRoutes}"
+    subBasePath="{subBasePath}"
+  />
 </div>
diff --git a/src/RouterStore.js b/src/RouterStore.js
index ce05acc..e85b0b2 100644
--- a/src/RouterStore.js
+++ b/src/RouterStore.js
@@ -6,5 +6,4 @@ export const isComponentLoading = writable(true);
 export const isRouteLoading = writable(true);
 
 export const path = writable("");
-export const subRouterRoutesByBasePath = writable([]);
 export const basePageInstance = page.create();
diff --git a/test/Chunk.svelte b/test/Chunk.svelte
index 0efdc93..3cec7b3 100644
--- a/test/Chunk.svelte
+++ b/test/Chunk.svelte
@@ -1,7 +1,7 @@
 <script>
   import Loadable from "svelte-loadable";
   import { get } from "svelte/store";
-  import { onMount } from "svelte";
+  import { onMount, setContext } from "svelte";
 
   import { isClass } from "../src/util";
 
@@ -14,6 +14,8 @@
   export let component;
   export let delay = 0;
   export let params = {};
+  export let subRoutes = null;
+  export let subBasePath = null;
 
   let isStatic = false;
   let onMounted = false;
@@ -45,6 +47,12 @@
 
   $: isPromise = component instanceof Promise;
   $: isStatic = isClass(component);
+  $: {
+    if (typeof subRoutes !== "undefined") setContext("route", subRoutes);
+  }
+  $: {
+    if (typeof subBasePath !== "undefined") setContext("basePath", subBasePath);
+  }
 
   $: {
     component;
diff --git a/test/components/Navigator.svelte b/test/components/Navigator.svelte
index e7a59c6..251ba98 100644
--- a/test/components/Navigator.svelte
+++ b/test/components/Navigator.svelte
@@ -1,5 +1,5 @@
 <script>
-  import Router, { route } from "../../src/index";
+  import { route } from "../../src/index";
 </script>
 
 <h3>Navigator</h3>
diff --git a/test/pages/MultipleSameInstance.svelte b/test/pages/MultipleSameInstance.svelte
index f86d232..932b21d 100644
--- a/test/pages/MultipleSameInstance.svelte
+++ b/test/pages/MultipleSameInstance.svelte
@@ -5,4 +5,4 @@
 Multiple same instance page
 <br />
 
-<Router basePath="/test-multiple-same-instance" />
+<Router />
diff --git a/test/pages/NestedRoutePage.svelte b/test/pages/NestedRoutePage.svelte
index 88e38a1..6357e27 100644
--- a/test/pages/NestedRoutePage.svelte
+++ b/test/pages/NestedRoutePage.svelte
@@ -5,4 +5,4 @@
 Nested Routing example page
 <br />
 
-<Router basePath="/nested-route-page" />
+<Router />
diff --git a/test/pages/NestedRouteParamsTestPage.svelte b/test/pages/NestedRouteParamsTestPage.svelte
index 6a62113..d18abe0 100644
--- a/test/pages/NestedRouteParamsTestPage.svelte
+++ b/test/pages/NestedRouteParamsTestPage.svelte
@@ -5,4 +5,4 @@
 Nested Routing params test example page
 <br />
 
-<Router basePath="/nested-route-params-page" />
+<Router />

From 304f67b8c28efc629cff37dc58dbebb71f953a0a Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Thu, 17 Dec 2020 21:16:13 +0300
Subject: [PATCH 05/12] fix: fix not waiting chunk load if chunk is custom
 chunk

---
 src/Router.svelte | 30 ++++++------------------------
 1 file changed, 6 insertions(+), 24 deletions(-)

diff --git a/src/Router.svelte b/src/Router.svelte
index ced72d1..12584d1 100644
--- a/src/Router.svelte
+++ b/src/Router.svelte
@@ -125,13 +125,11 @@
     }
   }
 
-  function parseAfterRouteEnter(context, isCustomChunk) {
+  function parseAfterRouteEnter(context) {
     const componentLoaderHandler = () => {
       isRouteLoading.set(false);
 
-      if (isCustomChunk) {
-        isPageLoading.set(false);
-      } else if (!get(isComponentLoading)) {
+      if (!get(isComponentLoading)) {
         isPageLoading.set(false);
       }
     };
@@ -186,14 +184,6 @@
       const route = paths[pathInPaths];
 
       const handler = (context) => {
-        let isCustomChunk = false;
-
-        try {
-          route.component();
-        } catch (e) {
-          if (e.toString().includes("new")) route.staticComponent = true;
-        }
-
         if (
           typeof route.component.chunk === "undefined" &&
           typeof route.chunkGenerated === "undefined"
@@ -212,12 +202,6 @@
           route.chunkGenerated = true;
         }
 
-        if (route.component.name === "component" && !route.staticComponent) {
-          isCustomChunk = route.chunk ? true : !!routerConfig.chunk;
-
-          route.isCustomChunk = isCustomChunk;
-        }
-
         if (route.children !== null && typeof route.children === "object") {
           subBasePath = basePath + path;
           subRoutes = route.children;
@@ -267,13 +251,11 @@
 
         component = route.component;
 
-        if (typeof route.component === "function" && !route.staticComponent) {
-          props = {
-            params,
-          };
-        } else props = params;
+        props = {
+          params,
+        };
 
-        if (!nestedRoute) parseAfterRouteEnter(context, isCustomChunk);
+        if (!nestedRoute) parseAfterRouteEnter(context);
       };
 
       pageInstance(

From 7ae4a480d4c49b5ad56fae93b7acc7122ebd7f47 Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Thu, 17 Dec 2020 23:27:18 +0300
Subject: [PATCH 06/12] fix: fix dispatching page with wrong configuration on
 sub router

---
 src/Router.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/Router.svelte b/src/Router.svelte
index 12584d1..3a35b69 100644
--- a/src/Router.svelte
+++ b/src/Router.svelte
@@ -287,7 +287,7 @@
   if (nestedRoute) {
     const pathUnsubscribe = path.subscribe((value) => {
       if (value.startsWith(pageInstance.base())) {
-        pageInstance.redirect(value);
+        pageInstance.show(value, false, true, false);
       }
     });
 

From 3d2515a08fa4d3488c81c32a9f061c98cd483c9f Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Fri, 18 Dec 2020 00:57:00 +0300
Subject: [PATCH 07/12] refactor: collect contexts under subRouterContext

---
 src/Chunk.svelte  |  9 +++------
 src/Router.svelte | 33 +++++++++++++++++++--------------
 test/Chunk.svelte |  9 +++------
 3 files changed, 25 insertions(+), 26 deletions(-)

diff --git a/src/Chunk.svelte b/src/Chunk.svelte
index 17ef5ca..5661c19 100644
--- a/src/Chunk.svelte
+++ b/src/Chunk.svelte
@@ -14,8 +14,7 @@
   export let component;
   export let delay = 0;
   export let params = {};
-  export let subRoutes = null;
-  export let subBasePath = null;
+  export let subRouterContext = null;
 
   let isStatic = false;
   let onMounted = false;
@@ -48,10 +47,8 @@
   $: isPromise = component instanceof Promise;
   $: isStatic = isClass(component);
   $: {
-    if (typeof subRoutes !== "undefined") setContext("route", subRoutes);
-  }
-  $: {
-    if (typeof subBasePath !== "undefined") setContext("basePath", subBasePath);
+    if (typeof subRouterContext !== "undefined")
+      setContext("routve.context", subRouterContext);
   }
 
   $: {
diff --git a/src/Router.svelte b/src/Router.svelte
index 3a35b69..1148e61 100644
--- a/src/Router.svelte
+++ b/src/Router.svelte
@@ -66,22 +66,24 @@
 
   import { isRouteLoading, isComponentLoading } from "./RouterStore";
 
-  export let routerConfig = Config;
-  export let hidden = false;
-
   let props = {};
   let component = null;
-  let subRoutes = null;
-  let subBasePath = null;
+  let subRouterContext = null;
 
-  const nestedRoute = typeof getContext("route") !== "undefined";
-  export let pageInstance = nestedRoute ? page.create() : basePageInstance;
+  export let routerConfig = Config;
 
-  export let routes = nestedRoute ? getContext("route") : routerConfig.routes;
+  const routerContext = getContext("routve.context");
+  const nestedRoute =
+    routerConfig === Config && typeof routerContext !== "undefined";
 
+  export let pageInstance = nestedRoute ? page.create() : basePageInstance;
+  export let routes = nestedRoute
+    ? routerContext.subRoutes
+    : routerConfig.routes;
   export let basePath = nestedRoute
-    ? getContext("basePath")
+    ? routerContext.basePath + routerContext.parentPath
     : routerConfig.basePath || "";
+  export let hidden = false;
 
   pageInstance.base(basePath);
 
@@ -203,10 +205,14 @@
         }
 
         if (route.children !== null && typeof route.children === "object") {
-          subBasePath = basePath + path;
-          subRoutes = route.children;
+          subRouterContext = {
+            basePath,
+            parentPath: path,
+            subRoutes: route.children,
+            parentContext: routerContext,
+          };
         } else {
-          subRoutes = null;
+          subRouterContext = null;
         }
 
         let params = {};
@@ -301,7 +307,6 @@
   <svelte:component
     this="{component}"
     {...props}
-    subRoutes="{subRoutes}"
-    subBasePath="{subBasePath}"
+    subRouterContext="{subRouterContext}"
   />
 </div>
diff --git a/test/Chunk.svelte b/test/Chunk.svelte
index 3cec7b3..ebebe32 100644
--- a/test/Chunk.svelte
+++ b/test/Chunk.svelte
@@ -14,8 +14,7 @@
   export let component;
   export let delay = 0;
   export let params = {};
-  export let subRoutes = null;
-  export let subBasePath = null;
+  export let subRouterContext = null;
 
   let isStatic = false;
   let onMounted = false;
@@ -48,10 +47,8 @@
   $: isPromise = component instanceof Promise;
   $: isStatic = isClass(component);
   $: {
-    if (typeof subRoutes !== "undefined") setContext("route", subRoutes);
-  }
-  $: {
-    if (typeof subBasePath !== "undefined") setContext("basePath", subBasePath);
+    if (typeof subRouterContext !== "undefined")
+      setContext("routve.context", subRouterContext);
   }
 
   $: {

From ed363002ff28770646d3428a9400aa13640df5be Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Fri, 18 Dec 2020 01:36:38 +0300
Subject: [PATCH 08/12] feat: add hashbang (#!/login hash routing) support

---
 src/Router.svelte     | 40 +++++++++++++++++++++++++++++++++++-----
 src/RouterStore.js    |  2 +-
 test/router.config.js |  1 +
 3 files changed, 37 insertions(+), 6 deletions(-)

diff --git a/src/Router.svelte b/src/Router.svelte
index 1148e61..d6ce2f5 100644
--- a/src/Router.svelte
+++ b/src/Router.svelte
@@ -1,7 +1,8 @@
 <script context="module">
   import { basePageInstance } from "./RouterStore";
-  import { get, readable } from "svelte/store";
+  import { get, readable, writable } from "svelte/store";
   import { path, isPageLoading } from "./RouterStore";
+  const pathName = writable("");
 
   let beforeRouteEnterCallbacks = [];
   let afterRouteEnterCallbacks = [];
@@ -76,17 +77,24 @@
   const nestedRoute =
     routerConfig === Config && typeof routerContext !== "undefined";
 
+  export let hashbang = nestedRoute
+    ? routerContext.hashbang
+    : !!routerConfig.hashbang
+    ? routerConfig.hashbang
+    : false;
   export let pageInstance = nestedRoute ? page.create() : basePageInstance;
   export let routes = nestedRoute
     ? routerContext.subRoutes
     : routerConfig.routes;
   export let basePath = nestedRoute
-    ? routerContext.basePath + routerContext.parentPath
+    ? routerContext.basePath + (hashbang ? "#!" : "") + routerContext.parentPath
     : routerConfig.basePath || "";
   export let hidden = false;
 
   pageInstance.base(basePath);
 
+  if (!hashbang) isPageLoading.set(true);
+
   function parseBeforeRouteEnter(context, next) {
     if (get(path) !== context.canonicalPath) {
       isPageLoading.set(true);
@@ -94,6 +102,7 @@
       isComponentLoading.set(true);
 
       path.set(context.canonicalPath);
+      pathName.set(context.pathname);
 
       if (beforeRouteEnterCallbacks.length > 0) {
         let currentCallbackIndex = 0;
@@ -210,6 +219,7 @@
             parentPath: path,
             subRoutes: route.children,
             parentContext: routerContext,
+            hashbang,
           };
         } else {
           subRouterContext = null;
@@ -287,13 +297,27 @@
       click: false,
       popstate: false,
       dispatch: false,
+      hashbang,
     });
-  else pageInstance.start();
+  else pageInstance.start({ hashbang });
 
   if (nestedRoute) {
     const pathUnsubscribe = path.subscribe((value) => {
-      if (value.startsWith(pageInstance.base())) {
-        pageInstance.show(value, false, true, false);
+      if (
+        value.startsWith(pageInstance.base()) ||
+        (hashbang &&
+          value.startsWith(routerContext.basePath + routerContext.parentPath))
+      ) {
+        if (hashbang) {
+          if (!value.startsWith(pageInstance.base()))
+            value =
+              routerContext.basePath +
+              value.split(routerContext.basePath)[0] +
+              "#!" +
+              value.split(routerContext.basePath)[1];
+
+          pageInstance.show(value, false, true, false);
+        } else pageInstance.show(value);
       }
     });
 
@@ -303,6 +327,12 @@
   onDestroy(() => pageInstance.stop());
 </script>
 
+<svelte:head>
+  {#if hashbang && !nestedRoute}
+    <base href="{basePath + '/'}" />
+  {/if}
+</svelte:head>
+
 <div hidden="{hidden}">
   <svelte:component
     this="{component}"
diff --git a/src/RouterStore.js b/src/RouterStore.js
index e85b0b2..9491d26 100644
--- a/src/RouterStore.js
+++ b/src/RouterStore.js
@@ -1,7 +1,7 @@
 import { writable } from "svelte/store";
 import page from "page";
 
-export const isPageLoading = writable(true);
+export const isPageLoading = writable(false);
 export const isComponentLoading = writable(true);
 export const isRouteLoading = writable(true);
 
diff --git a/test/router.config.js b/test/router.config.js
index dc00986..d283fc1 100644
--- a/test/router.config.js
+++ b/test/router.config.js
@@ -10,6 +10,7 @@ const instancePage = ChunkGenerator(
 
 export default {
   basePath: "",
+  hashbang: false,
   routes: {
     "/": {
       component: DefaultPage,

From 420d12723b49977750ed37a0f9678f3fc4ba2936 Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Fri, 18 Dec 2020 10:38:53 +0300
Subject: [PATCH 09/12] refactor: remove unnecessary pathName in router

---
 src/Router.svelte | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/Router.svelte b/src/Router.svelte
index d6ce2f5..06e1e6b 100644
--- a/src/Router.svelte
+++ b/src/Router.svelte
@@ -2,7 +2,6 @@
   import { basePageInstance } from "./RouterStore";
   import { get, readable, writable } from "svelte/store";
   import { path, isPageLoading } from "./RouterStore";
-  const pathName = writable("");
 
   let beforeRouteEnterCallbacks = [];
   let afterRouteEnterCallbacks = [];
@@ -102,7 +101,6 @@
       isComponentLoading.set(true);
 
       path.set(context.canonicalPath);
-      pathName.set(context.pathname);
 
       if (beforeRouteEnterCallbacks.length > 0) {
         let currentCallbackIndex = 0;

From 9b042b31e68d6e28e1648d606a7745826f80a3ea Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Fri, 18 Dec 2020 12:37:47 +0300
Subject: [PATCH 10/12] refactor: rename option `routerConfig` to `config`
 BREAKING CHANGE: The `routerConfig` option of Router component has renamed,
 use `config` instead.

---
 src/Router.svelte | 18 ++++++++----------
 test/App.svelte   |  2 +-
 2 files changed, 9 insertions(+), 11 deletions(-)

diff --git a/src/Router.svelte b/src/Router.svelte
index 06e1e6b..c89538c 100644
--- a/src/Router.svelte
+++ b/src/Router.svelte
@@ -58,7 +58,7 @@
 <script>
   import { onDestroy, getContext } from "svelte";
   import page from "page";
-  import Config from "./router.config";
+  import RouterConfig from "./router.config";
   import ChunkGenerator from "./ChunkGenerator";
   import qs from "qs";
 
@@ -70,24 +70,22 @@
   let component = null;
   let subRouterContext = null;
 
-  export let routerConfig = Config;
+  export let config = RouterConfig;
 
   const routerContext = getContext("routve.context");
   const nestedRoute =
-    routerConfig === Config && typeof routerContext !== "undefined";
+    config === RouterConfig && typeof routerContext !== "undefined";
 
   export let hashbang = nestedRoute
     ? routerContext.hashbang
-    : !!routerConfig.hashbang
-    ? routerConfig.hashbang
+    : !!config.hashbang
+    ? config.hashbang
     : false;
   export let pageInstance = nestedRoute ? page.create() : basePageInstance;
-  export let routes = nestedRoute
-    ? routerContext.subRoutes
-    : routerConfig.routes;
+  export let routes = nestedRoute ? routerContext.subRoutes : config.routes;
   export let basePath = nestedRoute
     ? routerContext.basePath + (hashbang ? "#!" : "") + routerContext.parentPath
-    : routerConfig.basePath || "";
+    : config.basePath || "";
   export let hidden = false;
 
   pageInstance.base(basePath);
@@ -199,7 +197,7 @@
         ) {
           route.component = ChunkGenerator(
             route.component,
-            route.chunk || routerConfig.chunk || DefaultChunkComponent
+            route.chunk || config.chunk || DefaultChunkComponent
           ).chunk;
 
           route.chunkGenerated = true;
diff --git a/test/App.svelte b/test/App.svelte
index f8cd47a..de9bca7 100644
--- a/test/App.svelte
+++ b/test/App.svelte
@@ -43,4 +43,4 @@
 
 {#if $isPageLoading}Loading: {$isPageLoading}{/if}
 
-<Router routerConfig="{RouterConfig}" hidden="{$isPageLoading}" />
+<Router config="{RouterConfig}" hidden="{$isPageLoading}" />

From 369db25f156e67449045877bddc75b1e13284cd9 Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Fri, 18 Dec 2020 15:20:14 +0300
Subject: [PATCH 11/12] chore(dependencies): update svelte-loadable to v1.5.1

---
 package.json | 2 +-
 yarn.lock    | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/package.json b/package.json
index 3194ee2..9d4c798 100644
--- a/package.json
+++ b/package.json
@@ -51,7 +51,7 @@
   },
   "dependencies": {
     "page": "^1.11.6",
-    "svelte-loadable": "^1.5.0",
+    "svelte-loadable": "^1.5.1",
     "qs": "^6.9.4"
   },
   "devDependencies": {
diff --git a/yarn.lock b/yarn.lock
index f848e0b..1ee8133 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6172,10 +6172,10 @@ supports-hyperlinks@^2.1.0:
     has-flag "^4.0.0"
     supports-color "^7.0.0"
 
-svelte-loadable@^1.5.0:
-  version "1.5.0"
-  resolved "https://registry.yarnpkg.com/svelte-loadable/-/svelte-loadable-1.5.0.tgz#98176b2e62a46eb456a882a310951250e37fb2bf"
-  integrity sha512-ZuDIpPA8SZaJ2UgSe97ZN0Ft67WmUGl2ZcbdibVQJQgA7HlEje2pYEMRT3z4AuBRUPW5rTJA0zCFnB6nuNGkZw==
+svelte-loadable@^1.5.1:
+  version "1.5.1"
+  resolved "https://registry.yarnpkg.com/svelte-loadable/-/svelte-loadable-1.5.1.tgz#0048e740a386f1826e5ab88cdfde943fbd3fcb7f"
+  integrity sha512-vQd9Wj4wfEuMF/LkbYkqyGbgNkeVOURIPHWhPtC4Cxds0g/2jUFPRdjbMs/gji4bj30B87GubrkQgRf8xItw5g==
 
 svelte@^3.22.2:
   version "3.29.4"

From 0ae91936279c56d19c1f8afd5195d0b28c4c5b4f Mon Sep 17 00:00:00 2001
From: kahverengi <ahmet.duruer@yandex.com>
Date: Fri, 18 Dec 2020 15:23:25 +0300
Subject: [PATCH 12/12] chore(release): prepare v2.0.0

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 9d4c798..c110224 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "routve",
-  "version": "1.1.18",
+  "version": "2.0.0",
   "description": "Routve is an advanced Svelte 3 router.",
   "main": "src/index.js",
   "svelte": "src/index.js",