From 94fee0f83d2ca470e9b9b5f974f7bb4625473137 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Thu, 3 Feb 2022 20:31:54 -0500 Subject: [PATCH 01/72] flexsearch --- pnpm-lock.yaml | 6 + sites/kit.svelte.dev/package.json | 1 + sites/kit.svelte.dev/src/lib/docs/index.js | 4 +- .../src/lib/search/Search.svelte | 253 ++++++++++++++++++ .../kit.svelte.dev/src/routes/__layout.svelte | 7 +- .../kit.svelte.dev/src/routes/content.json.js | 98 +++++++ sites/kit.svelte.dev/svelte.config.js | 8 +- 7 files changed, 372 insertions(+), 5 deletions(-) create mode 100644 sites/kit.svelte.dev/src/lib/search/Search.svelte create mode 100644 sites/kit.svelte.dev/src/routes/content.json.js diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index eac50fe20bf0..9de571d37cc0 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -317,6 +317,7 @@ importers: '@sveltejs/kit': workspace:* '@sveltejs/site-kit': ^2.0.0 '@types/node': ^16.6.1 + flexsearch: ^0.7.21 marked: ^4.0.5 prism-svelte: ^0.4.7 prismjs: ^1.26.0 @@ -327,6 +328,7 @@ importers: '@sveltejs/kit': link:../../packages/kit '@sveltejs/site-kit': 2.0.0 '@types/node': 16.11.11 + flexsearch: 0.7.21 marked: 4.0.5 prism-svelte: 0.4.7 prismjs: 1.26.0 @@ -3058,6 +3060,10 @@ packages: resolution: {integrity: sha512-8/sOawo8tJ4QOBX8YlQBMxL8+RLZfxMQOif9o0KUKTNTjMYElWPE0r/m5VNFxTRd0NSw8qSy8dajrwX4RYI1Hw==} dev: true + /flexsearch/0.7.21: + resolution: {integrity: sha512-W7cHV7Hrwjid6lWmy0IhsWDFQboWSng25U3VVywpHOTJnnAZNPScog67G+cVpeX9f7yDD21ih0WDrMMT+JoaYg==} + dev: true + /foreground-child/2.0.0: resolution: {integrity: sha512-dCIq9FpEcyQyXKCkyzmlPTFNgrCzPudOe+mhvJU5zAtlBnGVy2yKxtfsxK2tQBThwq225jcvBjpw1Gr40uzZCA==} engines: {node: '>=8.0.0'} diff --git a/sites/kit.svelte.dev/package.json b/sites/kit.svelte.dev/package.json index 9baf21864637..96156b198e97 100644 --- a/sites/kit.svelte.dev/package.json +++ b/sites/kit.svelte.dev/package.json @@ -12,6 +12,7 @@ "@sveltejs/kit": "workspace:*", "@sveltejs/site-kit": "^2.0.0", "@types/node": "^16.6.1", + "flexsearch": "^0.7.21", "marked": "^4.0.5", "prism-svelte": "^0.4.7", "prismjs": "^1.26.0", diff --git a/sites/kit.svelte.dev/src/lib/docs/index.js b/sites/kit.svelte.dev/src/lib/docs/index.js index 1f35017b6128..8f60d47415b1 100644 --- a/sites/kit.svelte.dev/src/lib/docs/index.js +++ b/sites/kit.svelte.dev/src/lib/docs/index.js @@ -111,7 +111,7 @@ function parse(markdown, file) { }; } -function extract_frontmatter(markdown) { +export function extract_frontmatter(markdown) { const match = /---\r?\n([\s\S]+?)\r?\n---/.exec(markdown); const frontmatter = match[1]; const body = markdown.slice(match[0].length); @@ -125,7 +125,7 @@ function extract_frontmatter(markdown) { return { metadata, body }; } -function slugify(title) { +export function slugify(title) { return title .toLowerCase() .replace(/[^a-z0-9-$]/g, '-') diff --git a/sites/kit.svelte.dev/src/lib/search/Search.svelte b/sites/kit.svelte.dev/src/lib/search/Search.svelte new file mode 100644 index 000000000000..0c2880a6b990 --- /dev/null +++ b/sites/kit.svelte.dev/src/lib/search/Search.svelte @@ -0,0 +1,253 @@ + + + { + if (e.code === 'KeyK' && e.metaKey) { + e.preventDefault(); + searching = !searching; + } + }} +/> + +
+ { + searching = true; + query = e.target.value; + e.target.value = ''; + }} + on:click={() => (searching = true)} + type="search" + placeholder="Search (Cmd-K)" + /> +
+ +{#if searching} +
(searching = false)}> +
e.stopPropagation()}> + + { + if (e.key === 'Tab' && results.length > 0) { + console.log('preventing default'); + e.preventDefault(); + } + + if (e.key === 'ArrowDown' || (e.key === 'Tab' && !e.shiftKey)) { + selected += 1; + selected %= results.length; + scroll_into_view(); + } + + if (e.key === 'ArrowUp' || (e.key === 'Tab' && e.shiftKey)) { + selected -= 1; + if (selected === -1) selected = results.length - 1; + scroll_into_view(); + } + + if (e.key === 'Escape') { + searching = false; + } + + if (e.key === 'Enter') { + const a = ul.querySelector('[aria-current="true"] a'); + + if (a) { + a.click(); + searching = false; + } + } + }} + on:input={update} + /> + + +
+
+{/if} + + diff --git a/sites/kit.svelte.dev/src/routes/__layout.svelte b/sites/kit.svelte.dev/src/routes/__layout.svelte index 81e30f01667e..8877221304de 100644 --- a/sites/kit.svelte.dev/src/routes/__layout.svelte +++ b/sites/kit.svelte.dev/src/routes/__layout.svelte @@ -2,6 +2,7 @@ import '@sveltejs/site-kit/base.css'; import { page, navigating } from '$app/stores'; import { Icon, Icons, Nav, NavItem, PreloadingIndicator, SkipLink } from '@sveltejs/site-kit'; + import Search from '$lib/search/Search.svelte'; @@ -13,9 +14,11 @@ +{#if browser} + +{/if} +
From a47fcd23708f9cae3b85a575a9be64da345ccfee Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 4 Feb 2022 16:34:55 -0500 Subject: [PATCH 16/72] fix mobile sizing --- sites/kit.svelte.dev/src/lib/search/SearchBox.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte b/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte index 1eac40b44ab2..a070fd5f056b 100644 --- a/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte +++ b/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte @@ -194,7 +194,7 @@ .search-box { width: calc(100vw - 2rem); - height: calc(100vh - 2rem); + height: calc(100% - 2rem); max-width: 50rem; max-height: 50rem; background: white; From 3ce2ac18d90a5c2f3995968b622c66b449dc10e8 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 4 Feb 2022 16:36:00 -0500 Subject: [PATCH 17/72] tidy up --- .../src/lib/search/SearchBox.svelte | 37 ++++++++----------- 1 file changed, 16 insertions(+), 21 deletions(-) diff --git a/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte b/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte index a070fd5f056b..d9e4a257203a 100644 --- a/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte +++ b/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte @@ -173,10 +173,24 @@ From 6637f801c0f9e33cbc90eeb558e8cb81b5820484 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 4 Feb 2022 17:58:46 -0500 Subject: [PATCH 21/72] use ctrl key on windows --- sites/kit.svelte.dev/src/lib/search/SearchBox.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte b/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte index 9ddb88ed7066..c849dfa67fa8 100644 --- a/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte +++ b/sites/kit.svelte.dev/src/lib/search/SearchBox.svelte @@ -92,7 +92,7 @@ { - if (e.code === 'KeyK' && e.metaKey) { + if (e.code === 'KeyK' && (navigator.platform === 'MacIntel' ? e.metaKey : e.ctrlKey)) { e.preventDefault(); $searching = !$searching; } From 9c303f5a4ee6931a5e7a1c5de25ac1ba52c21121 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Fri, 4 Feb 2022 18:12:05 -0500 Subject: [PATCH 22/72] reinstate links --- .../kit.svelte.dev/src/routes/__layout.svelte | 32 +++++++++++++++++++ 1 file changed, 32 insertions(+) diff --git a/sites/kit.svelte.dev/src/routes/__layout.svelte b/sites/kit.svelte.dev/src/routes/__layout.svelte index 8c169bd31032..40fdef7af22b 100644 --- a/sites/kit.svelte.dev/src/routes/__layout.svelte +++ b/sites/kit.svelte.dev/src/routes/__layout.svelte @@ -22,6 +22,12 @@ + Docs + FAQ + Migrating + + + Svelte @@ -61,6 +67,15 @@ display: none; } + /* duplicating content from