feat(website): add exports to sidebar

website/src/lib/Codeblock.svelte

@@ -8,7 +8,7 @@
 </script>
 
 {#await codeToHtml(code, { theme: 'vesper', lang, transformers: [{ pre(node) {
-				this.addClassToHast(node, 'not-prose overflow-x-auto');
+				this.addClassToHast(node, 'not-prose overflow-x-auto px-4 py-2 rounded-md');
 			} }] }) then highlightedCode}
 	{@html highlightedCode}
 {/await}

website/src/routes/+layout.svelte

@@ -46,7 +46,7 @@
 	});
 </script>
 
-<div class="flex flex-col px-8 lg:px-16 py-4 gap-8 items-center lg:*:max-w-6xl">
+<div class="flex flex-col px-8 lg:px-16 py-4 gap-12 items-center lg:*:max-w-6xl">
 	<header
 		class="flex-0 flex flex-col lg:flex-row relative items-center gap-4 lg:gap-0 min-h-12 w-full"
 	>

website/src/routes/docs/+page.svelte

@@ -24,10 +24,7 @@
 		<Note>
 			If you are using pesde with the `wally` feature enabled (true on releases from the GitHub
 			repository) then you can use <Codeblock code="pesde convert" /> to convert your wally.toml file
-			to pesde.yaml. This will leave you with an empty default index, so you will need to add a URL (such
-			as the default `<a href="https://github.com/daimond113/pesde-index"
-				>https://github.com/daimond113/pesde-index</a
-			>`) yourself.
+			to pesde.yaml.
 		</Note>
 	</section>
 

website/src/routes/packages/[scope]/[name]/[version]/+page.svelte

@@ -17,6 +17,8 @@
 	import ChevronDown from 'lucide-svelte/icons/chevron-down';
 	import Mail from 'lucide-svelte/icons/mail';
 	import Globe from 'lucide-svelte/icons/globe';
+	import Check from 'lucide-svelte/icons/check';
+	import X from 'lucide-svelte/icons/x';
 
 	export let data: PageData;
 
@@ -38,20 +40,10 @@
 			]
 		});
 
-	const parseAuthor = (author: string) => {
-		const authorRegex =
-			/^(?<name>.+?)(?:\s*<(?<email>.+?)>)?(?:\s*\((?<url>.+?)\))?(?:\s*<(?<email2>.+?)>)?(?:\s*\((?<url2>.+?)\))?$/;
-		const { groups } = author.match(authorRegex) ?? {};
-		return {
-			name: groups?.name ?? author,
-			email: groups?.email ?? groups?.email2,
-			url: groups?.url ?? groups?.url2
-		};
-	};
-
 	$: publishedAt = new Date(
 		(data.versions.find(([version]) => version === data.version)?.[1] ?? 0) * 1000
 	);
+
 	$: allDependencies = [
 		[data.dependencies, 'Dependencies'],
 		[data.peerDependencies, 'Peer Dependencies']
@@ -131,19 +123,18 @@
 					<div class="section-title">Authors</div>
 					<ul class="not-prose">
 						{#each data.authors as author}
-							{@const parsedAuthor = parseAuthor(author)}
 							<li class="flex">
 								<span class="overflow-text pr-2">
-									{parsedAuthor.name}
+									{author.name}
 								</span>
 								<div class="ml-auto flex items-center gap-4">
-									{#if parsedAuthor.email}
-										<a href="mailto:{parsedAuthor.email}" title="Email {parsedAuthor.name}">
+									{#if author.email}
+										<a href="mailto:{author.email}" title="Email {author.name}">
 											<Mail class="size-6" />
 										</a>
 									{/if}
-									{#if parsedAuthor.url}
-										<a href={parsedAuthor.url} title="Website of {parsedAuthor.name}">
+									{#if author.url}
+										<a href={author.url} title="Website of {author.name}">
 											<Globe class="size-6" />
 										</a>
 									{/if}
@@ -160,7 +151,7 @@
 				</section>
 			{/if}
 			{#each allDependencies as [dependencies, title]}
-				{#if dependencies}
+				{#if dependencies && dependencies.length > 0}
 					<section>
 						<div class="section-title">{title}</div>
 						<ul class="not-prose">
@@ -188,6 +179,31 @@
 					</section>
 				{/if}
 			{/each}
+			<section>
+				<div class="section-title">Exports</div>
+				<ul class="not-prose">
+					<li>
+						<div class="flex items-center">
+							Library:
+							{#if data.exports.lib}
+								<Check class="size-6 text-green-500 inline-block ml-auto" />
+							{:else}
+								<X class="size-6 text-red-500 inline-block ml-auto" />
+							{/if}
+						</div>
+					</li>
+					<li>
+						<div class="flex items-center">
+							Binary:
+							{#if data.exports.bin}
+								<Check class="size-6 text-green-500 inline-block ml-auto" />
+							{:else}
+								<X class="size-6 text-red-500 inline-block ml-auto" />
+							{/if}
+						</div>
+					</li>
+				</ul>
+			</section>
 		</div>
 	</div>
 </div>

website/src/routes/packages/[scope]/[name]/[version]/+page.ts

@@ -8,6 +8,17 @@ export const ssr = false;
 
 type Dependencies = ({ name: string; version: string } | { repo: string; rev: string })[];
 
+const parseAuthor = (author: string) => {
+	const authorRegex =
+		/^(?<name>.+?)(?:\s*<(?<email>.+?)>)?(?:\s*\((?<url>.+?)\))?(?:\s*<(?<email2>.+?)>)?(?:\s*\((?<url2>.+?)\))?$/;
+	const { groups } = author.match(authorRegex) ?? {};
+	return {
+		name: groups?.name ?? author,
+		email: groups?.email ?? groups?.email2,
+		url: groups?.url ?? groups?.url2
+	};
+};
+
 export const load: PageLoad = async ({ params, fetch }) => {
 	const res = await fetch(
 		`${import.meta.env.VITE_API_URL}/v0/packages/${params.scope}/${params.name}/${params.version}`
@@ -79,6 +90,7 @@ export const load: PageLoad = async ({ params, fetch }) => {
 		realm?: string;
 		dependencies?: Dependencies;
 		peer_dependencies?: Dependencies;
+		exports?: { lib?: string; bin?: string };
 	};
 
 	if (params.version.toLowerCase() === 'latest') {
@@ -102,13 +114,17 @@ export const load: PageLoad = async ({ params, fetch }) => {
 		name: params.name,
 		version: parsed.version,
 		versions,
-		authors: parsed.authors,
+		authors: parsed.authors?.map(parseAuthor),
 		description: parsed.description,
 		license: parsed.license,
 		readme,
 		repository: parsed.repository,
 		realm: parsed.realm,
 		dependencies: parsed.dependencies,
-		peerDependencies: parsed.peer_dependencies
+		peerDependencies: parsed.peer_dependencies,
+		exports: {
+			lib: !!parsed.exports?.lib,
+			bin: !!parsed.exports?.bin
+		}
 	};
 };