diff --git a/sites/svelte.dev/src/lib/actions/focus.js b/sites/svelte.dev/src/lib/actions/focus.js deleted file mode 100644 index 0bbbe36429..0000000000 --- a/sites/svelte.dev/src/lib/actions/focus.js +++ /dev/null @@ -1,68 +0,0 @@ -/** @param {HTMLElement} node */ -export function focusable_children(node) { - const nodes = Array.from( - node.querySelectorAll( - 'a[href], button, input, textarea, select, details, [tabindex]:not([tabindex="-1"])' - ) - ); - - const index = nodes.indexOf(document.activeElement); - - const update = (d) => { - let i = index + d; - i += nodes.length; - i %= nodes.length; - - // @ts-expect-error - nodes[i].focus(); - }; - - return { - /** @param {string} [selector] */ - next: (selector) => { - const reordered = [...nodes.slice(index + 1), ...nodes.slice(0, index + 1)]; - - for (let i = 0; i < reordered.length; i += 1) { - if (!selector || reordered[i].matches(selector)) { - reordered[i].focus(); - return; - } - } - }, - /** @param {string} [selector] */ - prev: (selector) => { - const reordered = [...nodes.slice(index + 1), ...nodes.slice(0, index + 1)]; - - for (let i = reordered.length - 2; i >= 0; i -= 1) { - if (!selector || reordered[i].matches(selector)) { - reordered[i].focus(); - return; - } - } - }, - update, - }; -} - -export function trap(node) { - const handle_keydown = (e) => { - if (e.key === 'Tab') { - e.preventDefault(); - - const group = focusable_children(node); - if (e.shiftKey) { - group.prev(); - } else { - group.next(); - } - } - }; - - node.addEventListener('keydown', handle_keydown); - - return { - destroy: () => { - node.removeEventListener('keydown', handle_keydown); - }, - }; -} diff --git a/sites/svelte.dev/src/lib/search/Search.svelte b/sites/svelte.dev/src/lib/search/Search.svelte deleted file mode 100644 index b501a6f441..0000000000 --- a/sites/svelte.dev/src/lib/search/Search.svelte +++ /dev/null @@ -1,130 +0,0 @@ - - -
- { - $searching = true; - $query = e.currentTarget.value; - e.currentTarget.value = ''; - }} - on:mousedown|preventDefault={() => ($searching = true)} - on:touchend|preventDefault={() => ($searching = true)} - type="search" - name="q" - placeholder="Search" - aria-label="Search" - spellcheck="false" - /> - - {#if browser} -
- {navigator.platform === 'MacIntel' ? '⌘' : 'Ctrl'} K -
- {/if} -
- - diff --git a/sites/svelte.dev/src/lib/search/SearchBox.svelte b/sites/svelte.dev/src/lib/search/SearchBox.svelte deleted file mode 100644 index b456db9464..0000000000 --- a/sites/svelte.dev/src/lib/search/SearchBox.svelte +++ /dev/null @@ -1,420 +0,0 @@ - - - { - if (e.key === 'k' && (navigator.platform === 'MacIntel' ? e.metaKey : e.ctrlKey)) { - e.preventDefault(); - $query = ''; - - if ($searching) { - close(); - } else { - $searching = true; - } - } - - if (e.code === 'Escape') { - close(); - } - }} -/> - -{#if $searching && ready} -
e.key === ' ' && close()} /> - -
{ - if (e.key === 'ArrowDown' || e.key === 'ArrowUp') { - e.preventDefault(); - const group = focusable_children(e.currentTarget); - - // when using arrow keys (as opposed to tab), don't focus buttons - const selector = 'a, input'; - - if (e.key === 'ArrowDown') { - group.next(selector); - } else { - group.prev(selector); - } - } - }} - use:trap - > -
- - { - if (e.key === 'Enter') { - modal.querySelector('a[data-has-node]')?.click(); - } - }} - on:input={(e) => ($query = e.currentTarget.value)} - value={$query} - placeholder="Search" - aria-describedby="search-description" - aria-label="Search" - spellcheck="false" - /> - - - - - -
- {#if search?.query} -
($searching = false)} - on:keydown={(e) => e.key === ' ' && ($searching = false)} - > - { - navigate(e.detail.href); - }} - /> -
- {:else} -

- {recent_searches.length ? 'Recent searches' : 'No recent searches'} -

- {#if recent_searches.length} -
- -
- {/if} - {/if} -
-
-
-{/if} - - - - diff --git a/sites/svelte.dev/src/lib/search/SearchResultList.svelte b/sites/svelte.dev/src/lib/search/SearchResultList.svelte deleted file mode 100644 index 7bf64e8542..0000000000 --- a/sites/svelte.dev/src/lib/search/SearchResultList.svelte +++ /dev/null @@ -1,163 +0,0 @@ - - - - - diff --git a/sites/svelte.dev/src/lib/search/SearchResults.svelte b/sites/svelte.dev/src/lib/search/SearchResults.svelte deleted file mode 100644 index 43b270e97e..0000000000 --- a/sites/svelte.dev/src/lib/search/SearchResults.svelte +++ /dev/null @@ -1,28 +0,0 @@ - - -{#if results.length > 0} - -{:else if query} -

No results

-{/if} - - diff --git a/sites/svelte.dev/src/lib/search/search.js b/sites/svelte.dev/src/lib/search/search.js deleted file mode 100644 index 590f82a59c..0000000000 --- a/sites/svelte.dev/src/lib/search/search.js +++ /dev/null @@ -1,107 +0,0 @@ -import flexsearch from 'flexsearch'; - -// @ts-expect-error -const Index = /** @type {import('flexsearch').Index} */ (flexsearch.Index ?? flexsearch); - -export let inited = false; - -/** @type {import('flexsearch').Index[]} */ -let indexes; - -/** @type {Map} */ -const map = new Map(); - -/** @type {Map} */ -const hrefs = new Map(); - -/** @param {import('./types').Block[]} blocks */ -export function init(blocks) { - if (inited) return; - - // we have multiple indexes, so we can rank sections (migration guide comes last) - const max_rank = Math.max(...blocks.map((block) => block.rank ?? 0)); - - indexes = Array.from({ length: max_rank + 1 }, () => new Index({ tokenize: 'forward' })); - - for (const block of blocks) { - const title = block.breadcrumbs.at(-1); - map.set(block.href, block); - // NOTE: we're not using a number as the ID here, but it is recommended: - // https://github.com/nextapps-de/flexsearch#use-numeric-ids - // If we were to switch to a number we would need a second map from ID to block - // We need to keep the existing one to allow looking up recent searches by URL even if docs change - // It's unclear how much browsers do string interning and how this might affect memory - // We'd probably want to test both implementations across browsers if memory usage becomes an issue - // TODO: fix the type by updating flexsearch after - // https://github.com/nextapps-de/flexsearch/pull/364 is merged and released - indexes[block.rank ?? 0].add(block.href, `${title} ${block.content}`); - - hrefs.set(block.breadcrumbs.join('::'), block.href); - } - - inited = true; -} - -/** - * @param {string} query - * @returns {import('./types').Block[]} - */ -export function search(query) { - const escaped = query.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'); - const regex = new RegExp(`(^|\\b)${escaped}`, 'i'); - - const blocks = indexes - .map((index) => index.search(query)) - .flat() - .map(lookup) - .map((block, rank) => ({ block, rank })) - .sort((a, b) => { - const a_title_matches = regex.test(a.block.breadcrumbs.at(-1)); - const b_title_matches = regex.test(b.block.breadcrumbs.at(-1)); - - // massage the order a bit, so that title matches - // are given higher priority - if (a_title_matches !== b_title_matches) { - return a_title_matches ? -1 : 1; - } - - return a.block.breadcrumbs.length - b.block.breadcrumbs.length || a.rank - b.rank; - }) - .map(({ block }) => block); - - const results = tree([], blocks).children; - - return results; -} - -/** @param {string} href */ -export function lookup(href) { - return map.get(href); -} - -/** - * @param {string[]} breadcrumbs - * @param {import('./types').Block[]} blocks - */ -function tree(breadcrumbs, blocks) { - const depth = breadcrumbs.length; - - const node = blocks.find((block) => { - if (block.breadcrumbs.length !== depth) return false; - return breadcrumbs.every((part, i) => block.breadcrumbs[i] === part); - }); - - const descendants = blocks.filter((block) => { - if (block.breadcrumbs.length <= depth) return false; - return breadcrumbs.every((part, i) => block.breadcrumbs[i] === part); - }); - - const child_parts = Array.from(new Set(descendants.map((block) => block.breadcrumbs[depth]))); - - return { - breadcrumbs, - href: hrefs.get(breadcrumbs.join('::')), - node, - children: child_parts.map((part) => tree([...breadcrumbs, part], descendants)), - }; -} diff --git a/sites/svelte.dev/src/lib/search/stores.js b/sites/svelte.dev/src/lib/search/stores.js deleted file mode 100644 index 2f306d0270..0000000000 --- a/sites/svelte.dev/src/lib/search/stores.js +++ /dev/null @@ -1,8 +0,0 @@ -import { writable } from 'svelte/store'; -import { persisted } from 'svelte-local-storage-store'; - -export const searching = writable(false); -export const query = writable(''); - -/** @type {import('svelte/store').Writable} */ -export const recent = persisted('recent_searches', []); diff --git a/sites/svelte.dev/src/lib/search/types.d.ts b/sites/svelte.dev/src/lib/search/types.d.ts deleted file mode 100644 index fbbbdba23f..0000000000 --- a/sites/svelte.dev/src/lib/search/types.d.ts +++ /dev/null @@ -1,13 +0,0 @@ -export interface Block { - breadcrumbs: string[]; - href: string; - content: string; - rank: number; -} - -export interface Tree { - breadcrumbs: string[]; - href: string; - node: Block; - children: Tree[]; -} diff --git a/sites/svelte.dev/src/lib/workers/search.js b/sites/svelte.dev/src/lib/workers/search.js deleted file mode 100644 index 2cb5227745..0000000000 --- a/sites/svelte.dev/src/lib/workers/search.js +++ /dev/null @@ -1,26 +0,0 @@ -import { init, search, lookup } from '../search/search.js'; - -addEventListener('message', async (event) => { - const { type, payload } = event.data; - - if (type === 'init') { - const res = await fetch(`${payload.origin}/content.json`); - const { blocks } = await res.json(); - init(blocks); - - postMessage({ type: 'ready' }); - } - - if (type === 'query') { - const query = payload; - const results = search(query); - - postMessage({ type: 'results', payload: { results, query } }); - } - - if (type === 'recents') { - const results = payload.map(lookup).filter(Boolean); - - postMessage({ type: 'recents', payload: results }); - } -}); diff --git a/sites/svelte.dev/src/routes/(authed)/apps/+page.svelte b/sites/svelte.dev/src/routes/(authed)/apps/+page.svelte index 01f53b1229..df5d7d51fa 100644 --- a/sites/svelte.dev/src/routes/(authed)/apps/+page.svelte +++ b/sites/svelte.dev/src/routes/(authed)/apps/+page.svelte @@ -1,6 +1,6 @@ - - -{#if $navigating && $navigating.to} - -{/if} + + {#if $page.route.id !== '/blog/[slug]'} + + + + {/if} + -{#if $page.url.pathname !== '/repl/embed'} - -