From 3dd9594bc5b013dd0b68e3f9a560eddf2015ee0b Mon Sep 17 00:00:00 2001
From: k <rostislavkaleta@gmail.com>
Date: Sat, 16 Sep 2023 09:27:25 +0200
Subject: [PATCH] - add state

---
 src/Blog.svelte   |  8 ++++++++
 src/Home.svelte   |  9 ++++++++-
 src/lib/Elegua.ts | 15 +++++++++++----
 3 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/src/Blog.svelte b/src/Blog.svelte
index e3e1deb..6fe26b4 100644
--- a/src/Blog.svelte
+++ b/src/Blog.svelte
@@ -1,6 +1,11 @@
 <script lang="ts">
 	import type { Post } from './posts';
+	import {state} from "./lib/Elegua"
 	export let posts: Post[];
+
+	if($state.inputValue === undefined) {
+		$state.inputValue = ""
+	}
 </script>
 
 <svelte:head>
@@ -9,6 +14,9 @@
 <h1>Blog page</h1>
 <p>This is a static route</p>
 
+<p>State only for this page</p>
+<input bind:value={$state.inputValue}/>
+
 <h2>Posts</h2>
 <p>These will be matched using named routes, i.e. <code>/blog/:slug</code>:</p>
 <ul>
diff --git a/src/Home.svelte b/src/Home.svelte
index bc14917..64ca0a6 100644
--- a/src/Home.svelte
+++ b/src/Home.svelte
@@ -1,9 +1,16 @@
 <script lang="ts">
-  import { goto, path, url } from './lib/Elegua';
+  import {goto, path, state, url} from './lib/Elegua'
   import * as package_json from '../package.json';
+
+  if($state.inputValue === undefined) {
+    $state.inputValue = ""
+  }
 </script>
 
 <h1>This is the home page.</h1>
+
+<p>State only for this page</p>
+<input bind:value={$state.inputValue}/>
 <p>
   <b
     >This is the demo application for <a href="https://github.com/howesteve/elegua">Elegua v{package_json.version}</a>,
diff --git a/src/lib/Elegua.ts b/src/lib/Elegua.ts
index 6ce82ec..233047d 100644
--- a/src/lib/Elegua.ts
+++ b/src/lib/Elegua.ts
@@ -1,5 +1,8 @@
 import type { ComponentType } from 'svelte';
-import { derived, get, readable, writable, type Subscriber } from 'svelte/store';
+import {derived, get, readable, writable, type Subscriber} from 'svelte/store'
+import type {Writable} from 'svelte/store'
+
+export const state: Writable<Record<any, any>> = writable({})
 
 let pathSetter: Subscriber<string>;
 export const path = (() => {
@@ -43,13 +46,13 @@ export const url = (() => {
     u.searchParams.set = (name, value) => {
       const res = sset.call(u.searchParams, name, value);
       set_(u);
-      history.pushState({}, '', u.toString());
+      history.pushState(get(state), '', u.toString());
       return res;
     };
     u.searchParams.delete = (name) => {
       const res = sdel.call(u.searchParams, name);
       set_(u);
-      history.pushState({}, '', u.toString());
+      history.pushState(get(state), '', u.toString());
       return res;
     };
     oldUrlSetter(get(url));
@@ -60,7 +63,10 @@ export const url = (() => {
   return {
     subscribe,
     set: (u: URL) => {
-      history.pushState(null, '', u);
+      history.replaceState(get(state), '', get(url));
+      history.pushState({}, '', u);
+      state.set({});
+
       urlSetter(u);
     },
     update
@@ -185,6 +191,7 @@ window?.addEventListener('load', () => {
     const u = new URL(window.location.href);
     urlSetter(u);
     event.preventDefault();
+    state.set(event.state);
   });
   
   let lastKbdEv: KeyboardEvent|undefined