Skip to content

Commit 3ed7467

Browse files
committed
I don't get it
1 parent 378f8fc commit 3ed7467

File tree

27 files changed

+416
-146
lines changed

27 files changed

+416
-146
lines changed

packages/docs/package.json

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -11,21 +11,20 @@
1111
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch"
1212
},
1313
"devDependencies": {
14+
"@skeletonlabs/floating-ui-svelte": "workspace:^",
1415
"@sveltejs/adapter-auto": "^3.0.0",
1516
"@sveltejs/kit": "^2.0.0",
1617
"@sveltejs/vite-plugin-svelte": "^4.0.0",
1718
"autoprefixer": "^10.4.20",
19+
"focus-trap": "^7.6.2",
20+
"lucide-svelte": "^0.469.0",
1821
"pagefind": "^1.3.0",
22+
"shiki": "^1.24.4",
1923
"svelte": "^5.0.0",
2024
"svelte-check": "^4.0.0",
2125
"tailwindcss": "^3.4.9",
2226
"typescript": "^5.0.0",
2327
"vite": "^5.4.11",
2428
"vite-plugin-pagefind": "^0.3.0"
25-
},
26-
"dependencies": {
27-
"@skeletonlabs/floating-ui-svelte": "workspace:^",
28-
"@tailwindcss/forms": "^0.5.9",
29-
"@tailwindcss/typography": "^0.5.15"
3029
}
3130
}
File renamed without changes.

packages/docs/src/lib/components/CodeBlock/CodeBlock.svelte

Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script lang="ts">
2-
import { page } from "$app/stores";
3-
import MoonlightDark from "$docs/themes/moonlight-dark.json";
2+
import { page } from "$app/state";
3+
import MoonlightDark from "$lib/themes/moonlight-dark.json";
44
import type { BuiltinLanguage, SpecialLanguage } from "shiki";
55
66
interface Props {
@@ -24,9 +24,7 @@ const highlightedLineNumbers = $derived(
2424
2525
// Process Language
2626
const renderedCode = $derived(
27-
// FIXME: https://github.com/sveltejs/eslint-plugin-svelte/issues/652
28-
// eslint-disable-next-line svelte/valid-compile
29-
$page.data.highlighter.codeToHtml(code.trim(), {
27+
page.data.highlighter.codeToHtml(code.trim(), {
3028
lang,
3129
themes: {
3230
// @ts-expect-error - Shiki theme type is annoyingly strict

packages/docs/src/lib/components/Dialog/SearchDialog.svelte

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script lang="ts">
2-
import { page } from "$app/stores";
2+
import { page } from "$app/state";
33
import LoaderIcon from "lucide-svelte/icons/loader";
44
import SearchIcon from "lucide-svelte/icons/search";
55
import Dialog from "./Dialog.svelte";
@@ -11,15 +11,10 @@ const searchPromise = $derived.by(async () => {
1111
if (query === "") {
1212
return [];
1313
}
14-
15-
// FIXME: https://github.com/sveltejs/eslint-plugin-svelte/issues/652
16-
// eslint-disable-next-line svelte/valid-compile
17-
const result = await $page.data.pagefind.debouncedSearch(query, {}, 250);
18-
14+
const result = await page.data.pagefind.debouncedSearch(query, {}, 250);
1915
if (result === null) {
2016
return [];
2117
}
22-
2318
return await Promise.all(result.results.map((result) => result.data()));
2419
});
2520

packages/docs/src/lib/components/Navigation/Navigation.svelte

Lines changed: 24 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<script lang="ts">
2-
import { page } from "$app/stores";
2+
import { page } from "$app/state";
33
// Components
4-
import Logo from "$docs/components/Logo/Logo.svelte";
5-
import { getDrawer } from "$docs/stores.svelte";
4+
import Logo from "$lib/components/Logo/Logo.svelte";
5+
import { getDrawer } from "$lib/stores.svelte";
66
import IconUseDismiss from "lucide-svelte/icons/circle-x";
77
// Icons (API)
88
import IconUseFloating from "lucide-svelte/icons/cloud";
@@ -20,6 +20,7 @@ import IconContextMenus from "lucide-svelte/icons/square-menu";
2020
import IconUseHover from "lucide-svelte/icons/square-mouse-pointer";
2121
import IconFloatingArrow from "lucide-svelte/icons/triangle";
2222
import IconUtils from "lucide-svelte/icons/wand-sparkles";
23+
import { on } from "svelte/events";
2324
2425
// Props
2526
let { classes = "" } = $props();
@@ -30,7 +31,7 @@ const navigation = [
3031
label: "Docs",
3132
links: [
3233
{
33-
icon: IconGetStarted,
34+
Icon: IconGetStarted,
3435
href: "/docs/getting-started",
3536
label: "Getting Started",
3637
},
@@ -39,11 +40,11 @@ const navigation = [
3940
{
4041
label: "Examples",
4142
links: [
42-
{ icon: IconTooltips, href: "/examples/tooltips", label: "Tooltips" },
43-
{ icon: IconPopovers, href: "/examples/popovers", label: "Popovers" },
44-
{ icon: IconModals, href: "/examples/modals", label: "Modals" },
43+
{ Icon: IconTooltips, href: "/examples/tooltips", label: "Tooltips" },
44+
{ Icon: IconPopovers, href: "/examples/popovers", label: "Popovers" },
45+
{ Icon: IconModals, href: "/examples/modals", label: "Modals" },
4546
{
46-
icon: IconContextMenus,
47+
Icon: IconContextMenus,
4748
href: "/examples/context-menus",
4849
label: "Context Menus",
4950
},
@@ -53,43 +54,39 @@ const navigation = [
5354
label: "API Reference",
5455
links: [
5556
{
56-
icon: IconUseFloating,
57+
Icon: IconUseFloating,
5758
href: "/api/use-floating",
5859
label: "useFloating",
5960
},
6061
{
61-
icon: IconUseInteractions,
62+
Icon: IconUseInteractions,
6263
href: "/api/use-interactions",
6364
label: "useInteractions",
6465
},
65-
{ icon: IconUseHover, href: "/api/use-hover", label: "useHover" },
66-
{ icon: IconUseFocus, href: "/api/use-focus", label: "useFocus" },
67-
{ icon: IconUseClick, href: "/api/use-click", label: "useClick" },
68-
{ icon: IconUseRole, href: "/api/use-role", label: "useRole" },
69-
{ icon: IconUseDismiss, href: "/api/use-dismiss", label: "useDismiss" },
66+
{ Icon: IconUseHover, href: "/api/use-hover", label: "useHover" },
67+
{ Icon: IconUseFocus, href: "/api/use-focus", label: "useFocus" },
68+
{ Icon: IconUseClick, href: "/api/use-click", label: "useClick" },
69+
{ Icon: IconUseRole, href: "/api/use-role", label: "useRole" },
70+
{ Icon: IconUseDismiss, href: "/api/use-dismiss", label: "useDismiss" },
7071
{
71-
icon: IconFloatingArrow,
72+
Icon: IconFloatingArrow,
7273
href: "/api/floating-arrow",
7374
label: "Floating Arrow",
7475
},
75-
{ icon: IconUtils, href: "/api/utilities", label: "Utilities" },
76+
{ Icon: IconUtils, href: "/api/utilities", label: "Utilities" },
7677
],
7778
},
78-
];
79+
] as const;
7980
8081
const drawer = getDrawer();
8182
82-
// FIXME: Remove when Svelte 5 supports $page, see: https://github.com/sveltejs/eslint-plugin-svelte/issues/652
83-
// eslint-disable-next-line svelte/valid-compile
8483
const navActive = (href: string) =>
85-
$page.route.id?.replace("/(inner)", "") === href;
84+
page.route.id?.replace("/(inner)", "") === href;
8685
8786
$effect(() => {
88-
const close = () => (drawer.open = false);
89-
window.addEventListener("resize", close);
90-
return () => {
91-
window.removeEventListener("resize", close);
92-
};
87+
return on(window, "resize", () => {
88+
drawer.open = false;
89+
});
9390
});
9491
</script>
9592

@@ -118,7 +115,7 @@ $effect(() => {
118115
class:nav-active={navActive(link.href)}
119116
onclick={() => (drawer.open = false)}
120117
>
121-
<svelte:component this={link.icon} size={24} />
118+
<link.Icon size={24}></link.Icon>
122119
<span>{link.label}</span>
123120
</a>
124121
</li>

packages/docs/src/lib/components/PageHeader/PageHeader.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts">
22
import { version } from "$app/environment";
33
4-
import { getDrawer } from "$docs/stores.svelte.js";
4+
import { getDrawer } from "$lib/stores.svelte.js";
55
// Icons
66
import IconMenu from "lucide-svelte/icons/menu";
77
import SearchDialog from "../Dialog/SearchDialog.svelte";

packages/docs/src/lib/components/Table/Table.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script lang="ts">
2-
import type { TableData } from "$docs/types.js";
2+
import type { TableData } from "$lib/types.js";
33
interface Props {
44
data: TableData[];
55
}

packages/docs/src/routes/(inner)/+layout.svelte

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<script lang="ts">
22
// Components
3-
import Navigation from "$docs/components/Navigation/Navigation.svelte";
4-
import PageFooter from "$docs/components/PageFooter/PageFooter.svelte";
5-
import PageHeader from "$docs/components/PageHeader/PageHeader.svelte";
3+
import Navigation from "$lib/components/Navigation/Navigation.svelte";
4+
import PageFooter from "$lib/components/PageFooter/PageFooter.svelte";
5+
import PageHeader from "$lib/components/PageHeader/PageHeader.svelte";
66
77
// Props
88
let { children } = $props();

packages/docs/src/routes/(inner)/api/floating-arrow/+page.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script lang="ts">
2-
import CodeBlock from "$docs/components/CodeBlock/CodeBlock.svelte";
3-
import Table from "$docs/components/Table/Table.svelte";
2+
import CodeBlock from "$lib/components/CodeBlock/CodeBlock.svelte";
3+
import Table from "$lib/components/Table/Table.svelte";
44
import { tableProps } from "./data.js";
55
</script>
66

packages/docs/src/routes/(inner)/api/use-click/+page.svelte

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script lang="ts">
2-
import CodeBlock from "$docs/components/CodeBlock/CodeBlock.svelte";
3-
import Table from "$docs/components/Table/Table.svelte";
2+
import CodeBlock from "$lib/components/CodeBlock/CodeBlock.svelte";
3+
import Table from "$lib/components/Table/Table.svelte";
44
import ExampleRaw from "./Example.svelte?raw";
55
import { tableOptions } from "./data.js";
66
</script>

0 commit comments

Comments
 (0)