svelte-docsmith 0.7.0 → 0.9.0

package/dist/components/docs/tabs.svelte

@@ -22,29 +22,65 @@
 	import { setContext, type Snippet } from 'svelte';
 	import * as TabsPrimitive from '../shadcn/tabs/index.js';
 	import TabsPhaseScope from './tabs-phase.svelte';
+	import { syncedValue, setSyncedValue, hydrateSyncedValue } from './tabs-sync.svelte.js';
 
 	const {
 		value,
+		syncKey,
 		children
 	}: {
 		/** Value/label of the tab selected by default. Defaults to the first tab. */
 		value?: string;
+		/**
+		 * Sync group. Every `<Tabs>` with the same `syncKey` shares its selection
+		 * (e.g. `"pkg"` for npm/pnpm/yarn blocks), and the choice is remembered
+		 * across reloads and navigation.
+		 */
+		syncKey?: string;
 		children: Snippet;
 	} = $props();
 
-	// The first <TabItem> to register wins the default selection. Captured during
-	// the collect pass, which renders (below) before <Tabs.Root> reads it — so the
-	// correct panel is already selected in the server-rendered HTML.
-	let firstValue = $state<string | undefined>();
+	// Each <TabItem> registers its value during the collect pass, which renders
+	// (below) before <Tabs.Root> reads them — so the right panel is already
+	// selected in the server-rendered HTML. The first registered value is the
+	// default; the full list validates a restored sync choice against this block.
+	let values = $state<string[]>([]);
 	setContext<TabsContext>(TABS_CTX, {
-		register: (v) => (firstValue ??= v)
+		register: (v) => {
+			if (!values.includes(v)) values.push(v);
+		}
 	});
+	const firstValue = $derived<string | undefined>(values[0]);
+
+	// Restore a persisted selection after mount (client-only), so it does not
+	// diverge from the server's default render until hydration is done. `ready`
+	// gates persistence until then, so any value event the tab primitive fires
+	// while mounting can't overwrite the reader's stored choice before we read it.
+	let ready = $state(false);
+	$effect(() => {
+		if (syncKey) hydrateSyncedValue(syncKey);
+		ready = true;
+	});
+
+	// A restored sync choice (valid for this block) wins, then the explicit
+	// `value`, then the first tab. Reactive, so a sibling group's change or a
+	// storage restore switches this instance too.
+	const selected = $derived.by(() => {
+		const fallback = value ?? firstValue ?? '';
+		if (!syncKey) return fallback;
+		const stored = syncedValue(syncKey);
+		return stored && values.includes(stored) ? stored : fallback;
+	});
+
+	function handleValueChange(next: string) {
+		if (ready && syncKey && next) setSyncedValue(syncKey, next);
+	}
 </script>
 
 <!-- collect: registers each TabItem's value; renders nothing. -->
 <TabsPhaseScope phase="collect">{@render children()}</TabsPhaseScope>
 
-<TabsPrimitive.Root value={value ?? firstValue ?? ''} class="my-6">
+<TabsPrimitive.Root value={selected} onValueChange={handleValueChange} class="my-6">
 	<TabsPrimitive.List class="not-prose mb-3">
 		<TabsPhaseScope phase="list">{@render children()}</TabsPhaseScope>
 	</TabsPrimitive.List>

package/dist/components/docs/tabs.svelte.d.ts

@@ -11,6 +11,12 @@ import { type Snippet } from 'svelte';
 type $$ComponentProps = {
     /** Value/label of the tab selected by default. Defaults to the first tab. */
     value?: string;
+    /**
+     * Sync group. Every `<Tabs>` with the same `syncKey` shares its selection
+     * (e.g. `"pkg"` for npm/pnpm/yarn blocks), and the choice is remembered
+     * across reloads and navigation.
+     */
+    syncKey?: string;
     children: Snippet;
 };
 declare const Tabs: import("svelte").Component<$$ComponentProps, {}, "">;

package/dist/components/landing/action.svelte

@@ -0,0 +1,50 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	const {
+		href,
+		variant = 'primary',
+		external = false,
+		arrow = variant === 'primary',
+		children
+	}: {
+		href: string;
+		/** `primary` is the filled button, `secondary` the outlined one beside it. */
+		variant?: 'primary' | 'secondary';
+		external?: boolean;
+		/** Trailing arrow that nudges on hover. Defaults on for `primary`. */
+		arrow?: boolean;
+		children: Snippet;
+	} = $props();
+
+	const rel = $derived(external ? 'noopener noreferrer' : undefined);
+	const target = $derived(external ? '_blank' : undefined);
+</script>
+
+<!-- A call-to-action link for <Hero> and <CTA>. Deliberately small: anything more
+     elaborate is better written as a plain anchor in your own page. -->
+<a
+	{href}
+	{rel}
+	{target}
+	class="group inline-flex h-11 items-center gap-2 rounded-lg px-6 font-medium transition-all {variant ===
+	'primary'
+		? 'bg-primary text-primary-foreground hover:bg-primary/90 shadow-sm hover:shadow-md'
+		: 'border-border bg-background hover:bg-accent border'}"
+>
+	{@render children()}
+	{#if arrow}
+		<svg
+			viewBox="0 0 24 24"
+			fill="none"
+			stroke="currentColor"
+			stroke-width="2"
+			stroke-linecap="round"
+			stroke-linejoin="round"
+			class="size-4 transition-transform group-hover:translate-x-0.5"
+			aria-hidden="true"
+		>
+			<path d="M5 12h14M12 5l7 7-7 7" />
+		</svg>
+	{/if}
+</a>

package/dist/components/landing/action.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    href: string;
+    /** `primary` is the filled button, `secondary` the outlined one beside it. */
+    variant?: 'primary' | 'secondary';
+    external?: boolean;
+    /** Trailing arrow that nudges on hover. Defaults on for `primary`. */
+    arrow?: boolean;
+    children: Snippet;
+};
+declare const Action: import("svelte").Component<$$ComponentProps, {}, "">;
+type Action = ReturnType<typeof Action>;
+export default Action;

package/dist/components/landing/cta.svelte

@@ -0,0 +1,52 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	const {
+		title,
+		description,
+		actions,
+		children
+	}: {
+		title: string;
+		/** Supporting line below the heading. */
+		description?: string;
+		/** Call-to-action buttons. */
+		actions?: Snippet;
+		/** Anything to sit below the actions, e.g. a note or a callout. */
+		children?: Snippet;
+	} = $props();
+</script>
+
+<!-- The closing panel of a landing page: a bordered card with a soft glow behind
+     the heading, so the page ends on the primary colour rather than trailing off. -->
+<section class="mx-auto max-w-7xl px-4 py-20 md:px-6 lg:px-8 lg:py-28">
+	<div
+		class="border-border bg-card relative isolate overflow-hidden rounded-2xl border px-6 py-16 text-center shadow-sm md:px-12"
+	>
+		<div class="pointer-events-none absolute inset-0 -z-10" aria-hidden="true">
+			<div
+				class="bg-primary/15 absolute top-0 left-1/2 h-75 w-150 -translate-x-1/2 rounded-full opacity-50 blur-[100px]"
+			></div>
+		</div>
+
+		<h2 class="mx-auto max-w-2xl text-3xl font-semibold tracking-tight text-balance sm:text-4xl">
+			{title}
+		</h2>
+
+		{#if description}
+			<p class="text-muted-foreground mx-auto mt-4 max-w-xl text-lg leading-relaxed text-pretty">
+				{description}
+			</p>
+		{/if}
+
+		{#if actions}
+			<div class="mt-8 flex flex-wrap items-center justify-center gap-3">
+				{@render actions()}
+			</div>
+		{/if}
+
+		{#if children}
+			<div class="mx-auto mt-10 max-w-xl text-left">{@render children()}</div>
+		{/if}
+	</div>
+</section>

package/dist/components/landing/cta.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    title: string;
+    /** Supporting line below the heading. */
+    description?: string;
+    /** Call-to-action buttons. */
+    actions?: Snippet;
+    /** Anything to sit below the actions, e.g. a note or a callout. */
+    children?: Snippet;
+};
+declare const Cta: import("svelte").Component<$$ComponentProps, {}, "">;
+type Cta = ReturnType<typeof Cta>;
+export default Cta;

package/dist/components/landing/feature-grid.svelte

@@ -0,0 +1,51 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	const {
+		title,
+		description,
+		columns = 3,
+		background = 'default',
+		children
+	}: {
+		/** Section heading above the grid. */
+		title?: string;
+		/** Supporting line below the heading. */
+		description?: string;
+		/** Columns at the widest breakpoint; the grid steps down on smaller screens. */
+		columns?: 2 | 3;
+		/**
+		 * `muted` gives the section a tinted band with rules above and below, for
+		 * alternating against neighbouring sections.
+		 */
+		background?: 'default' | 'muted';
+		/** The `<Feature>` cells. */
+		children: Snippet;
+	} = $props();
+</script>
+
+<section class={background === 'muted' ? 'border-border/50 bg-muted/20 border-y' : ''}>
+	<div class="mx-auto max-w-7xl px-4 py-16 md:px-6 lg:px-8 lg:py-24">
+		{#if title || description}
+			<div class="mx-auto max-w-2xl text-center">
+				{#if title}
+					<h2 class="text-3xl font-semibold tracking-tight text-balance sm:text-4xl">{title}</h2>
+				{/if}
+				{#if description}
+					<p class="text-muted-foreground mt-4 text-lg leading-relaxed text-pretty">
+						{description}
+					</p>
+				{/if}
+			</div>
+		{/if}
+
+		<div
+			class="grid gap-x-10 gap-y-10 sm:grid-cols-2 {columns === 3 ? 'lg:grid-cols-3' : ''} {title ||
+			description
+				? 'mt-14'
+				: ''}"
+		>
+			{@render children()}
+		</div>
+	</div>
+</section>

package/dist/components/landing/feature-grid.svelte.d.ts

@@ -0,0 +1,19 @@
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    /** Section heading above the grid. */
+    title?: string;
+    /** Supporting line below the heading. */
+    description?: string;
+    /** Columns at the widest breakpoint; the grid steps down on smaller screens. */
+    columns?: 2 | 3;
+    /**
+     * `muted` gives the section a tinted band with rules above and below, for
+     * alternating against neighbouring sections.
+     */
+    background?: 'default' | 'muted';
+    /** The `<Feature>` cells. */
+    children: Snippet;
+};
+declare const FeatureGrid: import("svelte").Component<$$ComponentProps, {}, "">;
+type FeatureGrid = ReturnType<typeof FeatureGrid>;
+export default FeatureGrid;

package/dist/components/landing/feature.svelte

@@ -0,0 +1,33 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	const {
+		title,
+		icon,
+		children
+	}: {
+		title: string;
+		/** Optional leading icon, rendered in a tinted square. */
+		icon?: Snippet;
+		/** The description. */
+		children?: Snippet;
+	} = $props();
+</script>
+
+<!-- One cell of a <FeatureGrid>. Icon beside the text rather than above it, so a
+     row of features stays compact as the column count grows. -->
+<div class="flex gap-4">
+	{#if icon}
+		<div
+			class="bg-primary/10 text-primary flex size-10 shrink-0 items-center justify-center rounded-lg"
+		>
+			{@render icon()}
+		</div>
+	{/if}
+	<div class="min-w-0">
+		<h3 class="font-semibold">{title}</h3>
+		{#if children}
+			<p class="text-muted-foreground mt-1 text-sm leading-relaxed">{@render children()}</p>
+		{/if}
+	</div>
+</div>

package/dist/components/landing/feature.svelte.d.ts

@@ -0,0 +1,11 @@
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    title: string;
+    /** Optional leading icon, rendered in a tinted square. */
+    icon?: Snippet;
+    /** The description. */
+    children?: Snippet;
+};
+declare const Feature: import("svelte").Component<$$ComponentProps, {}, "">;
+type Feature = ReturnType<typeof Feature>;
+export default Feature;

package/dist/components/landing/hero.svelte

@@ -0,0 +1,70 @@
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	const {
+		title,
+		description,
+		eyebrow,
+		actions,
+		media
+	}: {
+		/** The headline. Pass a snippet instead of a string to mark part of it up. */
+		title: string | Snippet;
+		/** Supporting paragraph below the headline. */
+		description?: string | Snippet;
+		/** A pill, badge, or announcement link sitting above the headline. */
+		eyebrow?: Snippet;
+		/** Call-to-action buttons. */
+		actions?: Snippet;
+		/**
+		 * The second column: a code sample, screenshot, or live demo. Without it the
+		 * hero collapses to a single centred column.
+		 */
+		media?: Snippet;
+	} = $props();
+</script>
+
+<!-- Renders either a plain string or a snippet, so simple pages stay simple. -->
+{#snippet content(value: string | Snippet)}
+	{#if typeof value === 'string'}{value}{:else}{@render value()}{/if}
+{/snippet}
+
+<section
+	class="mx-auto grid max-w-7xl items-center gap-12 px-4 pt-16 pb-20 md:px-6 lg:gap-10 lg:px-8 lg:pt-24 lg:pb-28 {media
+		? 'lg:grid-cols-[1.05fr_1fr]'
+		: 'max-w-3xl text-center'}"
+>
+	<div class="min-w-0">
+		{#if eyebrow}
+			{@render eyebrow()}
+		{/if}
+
+		<h1
+			class="text-5xl font-semibold tracking-[-0.03em] text-balance sm:text-6xl lg:text-[4.25rem] lg:leading-[1.02] {eyebrow
+				? 'mt-6'
+				: ''}"
+		>
+			{@render content(title)}
+		</h1>
+
+		{#if description}
+			<p
+				class="text-muted-foreground mt-6 max-w-xl text-lg leading-relaxed text-pretty {media
+					? ''
+					: 'mx-auto'}"
+			>
+				{@render content(description)}
+			</p>
+		{/if}
+
+		{#if actions}
+			<div class="mt-8 flex flex-wrap items-center gap-3 {media ? '' : 'justify-center'}">
+				{@render actions()}
+			</div>
+		{/if}
+	</div>
+
+	{#if media}
+		<div class="min-w-0">{@render media()}</div>
+	{/if}
+</section>

package/dist/components/landing/hero.svelte.d.ts

@@ -0,0 +1,19 @@
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    /** The headline. Pass a snippet instead of a string to mark part of it up. */
+    title: string | Snippet;
+    /** Supporting paragraph below the headline. */
+    description?: string | Snippet;
+    /** A pill, badge, or announcement link sitting above the headline. */
+    eyebrow?: Snippet;
+    /** Call-to-action buttons. */
+    actions?: Snippet;
+    /**
+     * The second column: a code sample, screenshot, or live demo. Without it the
+     * hero collapses to a single centred column.
+     */
+    media?: Snippet;
+};
+declare const Hero: import("svelte").Component<$$ComponentProps, {}, "">;
+type Hero = ReturnType<typeof Hero>;
+export default Hero;

package/dist/components/layouts/docs-header.svelte

@@ -4,10 +4,14 @@
 	import { Separator } from '../shadcn/separator/index.js';
 	import GithubIcon from '../icons/github.svelte';
 	import SearchTrigger from '../chrome/search-trigger.svelte';
+	import { useSearch } from '../../search/context.svelte.js';
 	import ThemeToggle from '../chrome/theme-toggle.svelte';
-	import type { DocsmithConfig } from '../../core/index.js';
+	import type { DocsmithConfig, DocsmithLink } from '../../core/index.js';
 	import BookOpenText from '@lucide/svelte/icons/book-open-text';
 	import type { Snippet } from 'svelte';
+	import { page } from '$app/state';
+	import { cn } from '../../utils/cn.js';
+	import { normalizePath } from '../../utils/normalize-path.js';
 
 	const {
 		config,
@@ -21,6 +25,26 @@
 		actions?: Snippet;
 	} = $props();
 
+	// Present only when the consumer passed a `search` loader to DocsShell.
+	const search = useSearch();
+
+	const current = $derived(normalizePath(page.url.pathname));
+
+	/**
+	 * A header link is usually the entry point to a whole section rather than a
+	 * page you sit on: "Docs" points at `/docs/introduction`, and should stay lit
+	 * while the reader moves through `/docs/*`. So match the link's first segment,
+	 * not the exact path. The root is exempt, since every path starts with `/`.
+	 */
+	function isActive(link: DocsmithLink): boolean {
+		if (link.external) return false;
+		const href = normalizePath(link.href);
+		if (href === current) return true;
+		if (href === '/') return false;
+		const section = '/' + href.split('/').filter(Boolean)[0];
+		return current === section || current.startsWith(section + '/');
+	}
+
 	let isScrolled = $state(false);
 </script>
 
@@ -55,7 +79,11 @@
 							href={link.href}
 							target={link.external ? '_blank' : undefined}
 							rel={link.external ? 'noopener noreferrer' : undefined}
-							class="text-muted-foreground hover:text-foreground rounded-md px-3 py-1.5 text-sm font-medium transition-colors"
+							aria-current={isActive(link) ? 'page' : undefined}
+							class={cn(
+								'hover:text-foreground rounded-md px-3 py-1.5 text-sm font-medium transition-colors',
+								isActive(link) ? 'text-foreground bg-muted/60' : 'text-muted-foreground'
+							)}
 						>
 							{link.label}
 						</a>
@@ -76,7 +104,12 @@
 
 			<SearchTrigger />
 
-			<Separator orientation="vertical" class="bg-border/40 mx-1 min-h-0 h-6" />
+			<!-- The separator divides the search trigger from the action icons, so
+			     it only earns its place when there is a trigger to divide from.
+			     Without this a site that hasn't wired search shows a stray rule. -->
+			{#if search}
+				<Separator orientation="vertical" class="bg-border/40 mx-1 min-h-0 h-6" />
+			{/if}
 
 			<div class="flex items-center gap-0.5">
 				{#if actions}

package/dist/components/layouts/docs-shell.svelte

@@ -3,6 +3,8 @@
 	import { afterNavigate } from '$app/navigation';
 	import {
 		navFromContent,
+		flattenNav,
+		navTrail,
 		type DocsContentItem,
 		type DocsmithConfig,
 		type SearchDoc
@@ -13,6 +15,7 @@
 	import Search from '../chrome/search.svelte';
 	import BackgroundPattern from '../chrome/background-pattern.svelte';
 	import ThemeProvider from '../chrome/theme-provider.svelte';
+	import AnnouncementBar from '../chrome/announcement-bar.svelte';
 	import DocsHeader from './docs-header.svelte';
 	import DocsFooter from './docs-footer.svelte';
 	import DocsMobileHeader from './docs-mobile-header.svelte';
@@ -128,8 +131,8 @@
 		readingTime && currentEntry?.readingTime ? `${currentEntry.readingTime} min read` : undefined
 	);
 
-	// Ordered flat page list drives the prev/next links.
-	const flatNav = $derived(nav.flatMap((group) => group.items));
+	// Ordered flat page list (leaves in sidebar reading order) drives prev/next.
+	const flatNav = $derived(flattenNav(nav));
 	const pageIndex = $derived(flatNav.findIndex((item) => item.url === pathname));
 	const prev = $derived(pageIndex > 0 ? flatNav[pageIndex - 1] : undefined);
 	const next = $derived(
@@ -137,13 +140,10 @@
 	);
 	const currentTitle = $derived(pageIndex >= 0 ? flatNav[pageIndex].title : config.title);
 
-	// Breadcrumb trail: the current page's sidebar group, then the page itself.
-	const currentGroup = $derived(
-		nav.find((group) => group.items.some((item) => item.url === pathname))
-	);
+	// Breadcrumb trail: the current page's sidebar group path, then the page
+	// itself (so a nested page reads e.g. Guides > Advanced > Middleware).
 	const breadcrumbs = $derived.by(() => {
-		const crumbs: Crumb[] = [];
-		if (currentGroup) crumbs.push({ title: currentGroup.title });
+		const crumbs: Crumb[] = (navTrail(nav, pathname) ?? []).map((title) => ({ title }));
 		if (pageIndex >= 0) crumbs.push({ title: currentTitle });
 		return crumbs;
 	});
@@ -189,6 +189,12 @@
 		<BackgroundPattern />
 	{/if}
 
+	<!-- Announcement bar (if configured) sits above the sticky header, so it
+	     scrolls away while the header stays pinned. -->
+	{#if config.announcement}
+		<AnnouncementBar announcement={config.announcement} />
+	{/if}
+
 	<!-- One header system everywhere: DocsHeader on desktop, DocsMobileHeader
 	     below lg. The `page` layout just omits the sidebar nav and in-page TOC. -->
 	<DocsHeader {config} {logo} {actions} />

package/dist/components/layouts/docs-sidebar.svelte

@@ -1,35 +1,69 @@
 <script lang="ts">
 	import { page } from '$app/state';
+	import ChevronRight from '@lucide/svelte/icons/chevron-right';
 	import { cn } from '../../utils/cn.js';
 	import { normalizePath } from '../../utils/normalize-path.js';
-	import type { NavGroup } from '../../core/index.js';
+	import { isNavGroup, type NavGroup, type NavNode } from '../../core/index.js';
 
 	const { nav, class: className = '' }: { nav: NavGroup[]; class?: string } = $props();
+
+	const current = $derived(normalizePath(page.url.pathname));
+
+	// Whether a subtree contains the current page — drives which nested groups
+	// start open. Recomputes on navigation, so navigating into a collapsed branch
+	// (e.g. via prev/next) opens it, while manual toggles on other branches stick.
+	function containsCurrent(node: NavNode): boolean {
+		return isNavGroup(node) ? node.items.some(containsCurrent) : node.url === current;
+	}
 </script>
 
+{#snippet tree(items: NavNode[])}
+	<ul class="space-y-1">
+		{#each items as node (isNavGroup(node) ? 'g:' + node.title : node.url)}
+			{#if isNavGroup(node)}
+				<li>
+					<details class="group/nav" open={containsCurrent(node)}>
+						<summary
+							class="text-muted-foreground hover:text-foreground flex cursor-pointer list-none items-center gap-2 rounded-md px-2 py-1.5 text-sm font-medium transition-colors select-none [&::-webkit-details-marker]:hidden"
+						>
+							<span class="truncate">{node.title}</span>
+							<ChevronRight
+								class="ml-auto size-3.5 shrink-0 opacity-70 transition-transform duration-200 ease-out group-open/nav:rotate-90 motion-reduce:transition-none"
+								aria-hidden="true"
+							/>
+						</summary>
+						<div class="border-border/60 mt-1 ml-2 border-l pl-3">
+							{@render tree(node.items)}
+						</div>
+					</details>
+				</li>
+			{:else}
+				<li>
+					<a
+						href={node.url}
+						aria-current={current === node.url ? 'page' : undefined}
+						class={cn(
+							'hover:text-primary hover:bg-primary/20 block rounded-md px-2 py-1.5 text-sm transition-colors',
+							current === node.url
+								? 'text-primary bg-primary/20 font-medium'
+								: 'text-muted-foreground'
+						)}
+					>
+						{node.title}
+					</a>
+				</li>
+			{/if}
+		{/each}
+	</ul>
+{/snippet}
+
 <aside class={cn('sticky top-24 hidden h-screen w-56 shrink-0 bg-transparent lg:block', className)}>
 	<div class="max-h-[calc(100vh-10rem)] overflow-y-auto px-4">
 		<nav aria-label="Documentation" class="space-y-6">
 			{#each nav as group (group.title)}
 				<div class="space-y-3">
 					<h4 class="text-foreground px-2 text-sm font-semibold">{group.title}</h4>
-					<ul class="space-y-1">
-						{#each group.items as item (item.url)}
-							<li>
-								<a
-									href={item.url}
-									class={cn(
-										'hover:text-primary hover:bg-primary/20 block rounded-md px-2 py-1.5 text-sm transition-colors',
-										normalizePath(page.url.pathname) === item.url
-											? 'text-primary bg-primary/20 font-medium'
-											: 'text-muted-foreground'
-									)}
-								>
-									{item.title}
-								</a>
-							</li>
-						{/each}
-					</ul>
+					{@render tree(group.items)}
 				</div>
 			{/each}
 		</nav>

package/dist/components/layouts/docs-sidebar.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { NavGroup } from '../../core/index.js';
+import { type NavGroup } from '../../core/index.js';
 type $$ComponentProps = {
     nav: NavGroup[];
     class?: string;