@rokkit/stories 1.0.0-next.123

package/dist/shiki.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Highlight code using Shiki
+ *
+ * @param {string} code - The code to highlight
+ * @param {object} options - Options for highlighting
+ * @param {string} options.lang - The language to highlight
+ * @param {string} options.theme - The theme to use for highlighting
+ * @returns {Promise<string>} - The highlighted code as HTML
+ */
+export function highlightCode(code: string, options?: {
+    lang: string;
+    theme: string;
+}): Promise<string>;
+export function preloadHighlighter(): Promise<void>;

package/dist/stories.d.ts

@@ -0,0 +1,117 @@
+/**
+ * Fetches the content of the sources.
+ *
+ * @param {Object} sources - The modules to fetch the content from.
+ * @returns {Promise<File[]>} - The content of the modules.
+ */
+export function fetchImports(sources: Object): Promise<File[]>;
+/**
+ * Returns the slug of a file.
+ *
+ * @param {string} file - The file to get the slug from.
+ * @returns {string} - The slug of the file.
+ */
+export function getSlug(file: string): string;
+/**
+ * Converts the input content into a group by catgeory
+ * @param {ModuleFile[]} metadata - The metadata to convert.
+ * @returns {Metadata[]} Array of section objects
+ */
+export function getSections(metadata: ModuleFile[]): Metadata[];
+/**
+ *
+ * @param {File[]} files
+ * @returns
+ */
+export function groupFiles(files: File[]): {};
+/**
+ * Fetches the stories.
+ *
+ * @param {Object} sources - The sources to fetch the content from.
+ * @param {Object} modules - The modules to fetch the content from.
+ * @returns {Promise<Object<string, Story>>} - The stories.
+ */
+export function fetchStories(sources: Object, modules: Object): Promise<{
+    [x: string]: Story;
+}>;
+/**
+ * Get all individual sections flattened from groups
+ * @returns {Array} Array of all tutorial sections
+ */
+export function getAllSections(): any[];
+/**
+ * Find a section by its ID
+ * @param {string} slug - The section ID to find
+ * @returns {Object|null} The section object or null if not found
+ */
+export function findSection(sections: any, slug: string): Object | null;
+/**
+ * Get the group that contains a specific section
+ * @param {string} sectionId - The section ID to find the group for
+ * @returns {Object|null} The group object or null if not found
+ */
+export function findGroupForSection(sections: any, sectionId: string): Object | null;
+export type SourceFile = {
+    /**
+     * - The file path.
+     */
+    file: string;
+    /**
+     * - The group name.
+     */
+    group?: string | undefined;
+    /**
+     * - The file name.
+     */
+    name: string;
+    /**
+     * - The language of the file.
+     */
+    language: string;
+    /**
+     * - The content of the file.
+     */
+    content: string;
+};
+export type ModuleFile = {
+    /**
+     * - The file path.
+     */
+    file: string;
+    /**
+     * - The group name.
+     */
+    group?: string | undefined;
+    /**
+     * - The file name.
+     */
+    name: string;
+    /**
+     * - The language of the file.
+     */
+    language: string;
+    /**
+     * - The content of the file.
+     */
+    content: Object;
+};
+export type File = SourceFile | ModuleFile;
+export type Metadata = {
+    title: string;
+    description: string;
+    category: string;
+    tags: string[];
+    depth: number;
+    order: number;
+    children?: Metadata[] | undefined;
+};
+export type Story = {
+    /**
+     * - Array of files.
+     */
+    files: File[];
+    /**
+     * - The preview component.
+     */
+    App?: import("svelte").SvelteComponent<Record<string, any>, any, any> | undefined;
+};

package/dist/stories.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@rokkit/stories",
+  "version": "1.0.0-next.123",
+  "description": "Utilities for building tutorials.",
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "story",
+    "tutorial",
+    "markdown",
+    "svelte",
+    "svelte-kit"
+  ],
+  "author": "Jerry Thomas<me@jerrythomas.name>",
+  "license": "MIT",
+  "type": "module",
+  "exports": {
+    "./package.json": "./package.json",
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./src/index.js"
+    }
+  },
+  "scripts": {
+    "prepublishOnly": "bun clean && bun tsc --project tsconfig.build.json",
+    "clean": "rm -rf dist",
+    "build": "bun prepublishOnly"
+  },
+  "dependencies": {
+    "@vitest/expect": "^3.2.4",
+    "frontmatter": "^0.0.3",
+    "ramda": "^0.31.3",
+    "@rokkit/core": "latest"
+  }
+}

package/src/Code.svelte

@@ -0,0 +1,21 @@
+<script>
+	import { vibe } from '@rokkit/states'
+	import { highlightCode } from './shiki.js'
+	import CopyToClipboard from './CopyToClipboard.svelte'
+
+	let { content, language } = $props()
+	let theme = $derived(vibe.mode == 'dark' ? 'github-dark' : 'github-light')
+	let highlightedCode = $derived(highlightCode(content, { lang: language, theme }))
+</script>
+
+<div data-code-root>
+	<CopyToClipboard {content} floating={true} />
+	{#await highlightedCode}
+		<div class="text-surface-z7 p-4">Highlighting code...</div>
+	{:then code}
+		<!-- eslint-disable svelte/no-at-html-tags -->
+		{@html code}
+	{:catch error}
+		<div class="p-4 text-red-500">Error highlighting code: {error.message}</div>
+	{/await}
+</div>

package/src/CodeViewer.svelte

@@ -0,0 +1,11 @@
+<script>
+	import { Tabs } from '@rokkit/ui'
+	import Code from './Code.svelte'
+	let { files = [] } = $props()
+	let current = $state(files[0])
+	let fields = { text: 'name', icon: 'language' }
+</script>
+
+<Tabs items={files} {fields} bind:value={current} class="no-padding">
+	<Code content={current?.content} language={current?.language} />
+</Tabs>

package/src/CopyToClipboard.svelte

@@ -0,0 +1,26 @@
+<script>
+	import { defaultStateIcons } from '@rokkit/core'
+	import { Icon, Button } from '@rokkit/ui'
+	let { content, class: className = 'absolute right-2 top-2 z-10', title = 'Copy code' } = $props()
+	let copySuccess = $state(false)
+
+	async function copyToClipboard() {
+		try {
+			await navigator.clipboard.writeText(content || '')
+			copySuccess = true
+			setTimeout(() => {
+				copySuccess = false
+			}, 2000)
+		} catch (err) {
+			console.error('Failed to copy code:', err)
+		}
+	}
+</script>
+
+<Button onclick={copyToClipboard} class={className} {title}>
+	{#if copySuccess}
+		<Icon name={defaultStateIcons.action.copysuccess} />
+	{:else}
+		<Icon name={defaultStateIcons.action.copy} />
+	{/if}
+</Button>

package/src/Notes.svelte

@@ -0,0 +1,57 @@
+<script>
+	import { Icon, BreadCrumbs } from '@rokkit/ui'
+	import { getContext } from 'svelte'
+	import { goto } from '$app/navigation'
+	import { page } from '$app/state'
+	const site = getContext('site')()
+
+	let { content, crumbs, previous, next } = $props()
+	/**
+	 *
+	 * @param {string} route
+	 */
+	async function gotoPage(route) {
+		if (route) {
+			const location = '/' + page.params.segment + '/' + route
+			await goto(location)
+		}
+	}
+	function toggle() {
+		site.sidebar = !site.sidebar
+	}
+</script>
+
+<aside class="border-r-surface-z0 flex h-full w-full flex-col border-r">
+	{#if content}
+		<nav class="border-b-surface-z0 box-border flex h-10 items-center gap-1 border-b px-2 text-sm">
+			{#if !site.sidebar}
+				<Icon
+					name="i-rokkit:menu"
+					class="border-r-surface-z2 border-r"
+					role="button"
+					onclick={toggle}
+				/>
+			{/if}
+			<Icon
+				name="i-rokkit:arrow-left"
+				role="button"
+				onclick={() => gotoPage(previous)}
+				class="square"
+			/>
+			<h1 class="w-full">
+				<BreadCrumbs items={crumbs} class="text-xs" />
+			</h1>
+			<Icon
+				name="i-rokkit:arrow-right"
+				role="button"
+				onclick={() => gotoPage(next)}
+				class="square"
+			/>
+		</nav>
+
+		{@const SvelteComponent = content}
+		<notes class="markdown-body h-full w-full overflow-scroll p-8 font-thin">
+			<SvelteComponent />
+		</notes>
+	{/if}
+</aside>

package/src/Preview.svelte

@@ -0,0 +1,10 @@
+<script>
+	let { content } = $props()
+</script>
+
+<section class="flex h-full w-full flex-col gap-4 overflow-scroll p-8">
+	{#if content}
+		{@const Template = content}
+		<Template />
+	{/if}
+</section>

package/src/lib/StoryViewer.svelte

@@ -0,0 +1,16 @@
+<script>
+	import CodeViewer from './CodeViewer.svelte'
+
+	let { App, files } = $props()
+</script>
+
+<div data-story-root>
+	<div data-story-preview>
+		{#if App}
+			<App />
+		{:else}
+			<div>No preview available</div>
+		{/if}
+	</div>
+	<CodeViewer {files} />
+</div>

package/src/lib/shiki.js

@@ -0,0 +1,75 @@
+/**
+ * @fileoverview Shiki syntax highlighting utility for CodeViewer
+ */
+
+import { createHighlighter } from 'shiki'
+
+let highlighter = null
+let isInitializing = false
+
+/**
+ * Initialize Shiki highlighter
+ */
+async function initializeHighlighter() {
+	if (highlighter) return highlighter
+
+	if (isInitializing) {
+		while (isInitializing) {
+			await new Promise((resolve) => setTimeout(resolve, 50))
+		}
+		return highlighter
+	}
+
+	isInitializing = true
+
+	try {
+		highlighter = await createHighlighter({
+			themes: ['github-light', 'github-dark'],
+			langs: ['svelte', 'javascript', 'typescript', 'css', 'html', 'json', 'bash', 'shell']
+		})
+
+		isInitializing = false
+		return highlighter
+	} catch (error) {
+		isInitializing = false
+		throw error
+	}
+}
+
+/**
+ * Highlight code using Shiki
+ *
+ * @param {string} code - The code to highlight
+ * @param {object} options - Options for highlighting
+ * @param {string} options.lang - The language to highlight
+ * @param {string} options.theme - The theme to use for highlighting
+ * @returns {Promise<string>} - The highlighted code as HTML
+ */
+export async function highlightCode(code, options = {}) {
+	if (!code || typeof code !== 'string') {
+		throw new Error('Invalid code provided for highlighting')
+	}
+
+	try {
+		const hl = await initializeHighlighter()
+		const lang = options.lang
+		const theme = options.theme
+
+		return hl
+			.codeToHtml(code, {
+				lang,
+				theme
+			})
+			.replace(/(<pre[^>]+) style=".*?"/, '$1') /* remove conflicting background color */
+	} catch (error) {
+		throw new Error(`Failed to highlight code: ${error.message}`)
+	}
+}
+
+export async function preloadHighlighter() {
+	try {
+		await initializeHighlighter()
+	} catch (error) {
+		console.warn('Failed to preload syntax highlighter:', error.message)
+	}
+}

package/src/lib/stories.js

@@ -0,0 +1,193 @@
+import { omit } from 'ramda'
+const LANGUAGE_MAP = {
+	js: 'javascript',
+	ts: 'typescript',
+	md: 'markdown',
+	sh: 'bash',
+	bash: 'bash',
+	shell: 'shell'
+}
+
+/**
+ * @typedef {Object} SourceFile
+ * @property {string} file     - The file path.
+ * @property {string} [group]  - The group name.
+ * @property {string} name     - The file name.
+ * @property {string} language - The language of the file.
+ * @property {string} content  - The content of the file.
+ */
+
+/**
+ * @typedef {Object} ModuleFile
+ * @property {string} file     - The file path.
+ * @property {string} [group]  - The group name.
+ * @property {string} name     - The file name.
+ * @property {string} language - The language of the file.
+ * @property {Object} content  - The content of the file.
+ */
+
+/** @typedef {SourceFile|ModuleFile} File */
+
+/**
+ * @typedef {Object} Metadata
+ * @property {string}     title
+ * @property {string}     description
+ * @property {string}     category
+ * @property {string[]}   tags
+ * @property {number}     depth
+ * @property {number}     order
+ * @property {Metadata[]} [children]
+ */
+
+/**
+ * @typedef {Object} Story
+ * @property {File[]}                           files   - Array of files.
+ * @property {import('svelte').SvelteComponent} [App]     - The preview component.
+ */
+
+/**
+ * Returns the language of a file based on its extension.
+ *
+ * @param {string} file - The file to get the language from.
+ * @returns {string} - The language of the file.
+ */
+function getLanguage(file) {
+	const ext = file.split('.').pop()
+	return LANGUAGE_MAP[ext] || ext
+}
+/**
+ * Fetches the content of the sources.
+ *
+ * @param {Object} sources - The modules to fetch the content from.
+ * @returns {Promise<File[]>} - The content of the modules.
+ */
+export async function fetchImports(sources) {
+	const files = await Promise.all(
+		Object.entries(sources).map(async ([file, content]) => ({
+			file,
+			group: file.split('/').slice(-2)[0],
+			name: file.split('/').pop(),
+			language: getLanguage(file),
+			content: await content()
+		}))
+	)
+	return files
+}
+
+/**
+ * Returns the slug of a file.
+ *
+ * @param {string} file - The file to get the slug from.
+ * @returns {string} - The slug of the file.
+ */
+export function getSlug(file) {
+	const parts = file.split('/').slice(1).slice(0, -1)
+	return `/${parts.join('/')}`
+}
+
+/**
+ * Converts the input content into a group by catgeory
+ * @param {ModuleFile[]} metadata - The metadata to convert.
+ * @returns {Metadata[]} Array of section objects
+ */
+export function getSections(metadata) {
+	/** @type Object<string, Metadata> */
+	const sections = {}
+
+	metadata.forEach(({ content, file, group }) => {
+		const item = {
+			category: group ?? '',
+			order: 99,
+			...content,
+			slug: getSlug(file),
+			depth: file.split('/').length - 2
+		}
+
+		const category = item.category.toLowerCase()
+		if (!sections[category]) {
+			sections[category] = { children: [] }
+		}
+		if (item.depth === 1) {
+			sections[category] = {
+				...sections[category],
+				...item
+			}
+		} else {
+			sections[category].children.push(item)
+		}
+		sections[category].children = sections[category].children.sort((a, b) => a.order - b.order)
+	})
+
+	return Object.values(sections).sort((a, b) => a.order - b.order)
+}
+
+/**
+ *
+ * @param {File[]} files
+ * @returns
+ */
+export function groupFiles(files) {
+	const groups = files
+		.filter((file) => file.group !== '.')
+		.reduce(
+			(acc, file) => ({
+				...acc,
+				[file.group]: [...(acc[file.group] || []), omit(['group'], file)]
+			}),
+			{}
+		)
+
+	return groups
+}
+
+/**
+ * Fetches the stories.
+ *
+ * @param {Object} sources - The sources to fetch the content from.
+ * @param {Object} modules - The modules to fetch the content from.
+ * @returns {Promise<Object<string, Story>>} - The stories.
+ */
+export async function fetchStories(sources, modules) {
+	const components = groupFiles(await fetchImports(modules))
+	const files = groupFiles(await fetchImports(sources))
+
+	/** @type {Object<string, Story>} */
+	const stories = {}
+
+	Object.entries(files).forEach(([group, files]) => {
+		stories[group] = { files }
+		if (components[group]) {
+			stories[group].App = components[group][0].content
+		}
+	})
+	return stories
+}
+/**
+ * Get all individual sections flattened from groups
+ * @returns {Array} Array of all tutorial sections
+ */
+export function getAllSections() {
+	return sections.flatMap((group) => group.children)
+}
+
+/**
+ * Find a section by its ID
+ * @param {string} slug - The section ID to find
+ * @returns {Object|null} The section object or null if not found
+ */
+export function findSection(sections, slug) {
+	for (const group of sections) {
+		const section = group.children.find((child) => child.slug === slug)
+		if (section) return section
+	}
+	return {}
+}
+
+/**
+ * Get the group that contains a specific section
+ * @param {string} sectionId - The section ID to find the group for
+ * @returns {Object|null} The group object or null if not found
+ */
+export function findGroupForSection(sections, sectionId) {
+	return sections.find((group) => group.children.some((child) => child.id === sectionId)) || null
+}

package/src/lib/stories.spec.js

@@ -0,0 +1,298 @@
+import { describe, it, expect, vi, beforeEach } from 'vitest'
+import { getSections, getSlug, fetchImports, fetchStories, groupFiles } from './stories.js'
+
+describe('stories.js', () => {
+	beforeEach(() => {
+		vi.clearAllMocks()
+	})
+
+	describe('getSlug', () => {
+		it('should return the slug from a file path', () => {
+			const file = './welcome/introduction/meta.json'
+			const slug = getSlug(file)
+			expect(slug).toBe('/welcome/introduction')
+		})
+	})
+
+	describe('getSections', () => {
+		it('should combine metadata from categories and components', () => {
+			const result = getSections([])
+			expect(result).toEqual([])
+		})
+		it('should group by categories', () => {
+			const metadata = [
+				,
+				{
+					content: { title: 'Elements', category: 'elements', order: 2 },
+					file: './elements/meta.json'
+				},
+				{
+					content: { title: 'List', order: 2 },
+
+					group: 'elements',
+					file: './elements/list/meta.json'
+				},
+				{
+					content: { title: 'Components', category: 'elements', order: 1 },
+					group: 'elements',
+					file: './elements/components/meta.json'
+				},
+				{
+					content: { title: 'Welcome', category: 'welcome', order: 1 },
+					file: './welcome/meta.json'
+				},
+				{
+					content: { title: 'Getting Started', category: 'welcome', order: 2 },
+					file: './welcome/get/meta.json'
+				},
+				{
+					content: { title: 'Introduction', category: 'welcome', order: 1 },
+					file: './welcome/introduction/meta.json'
+				}
+			]
+			const result = getSections(metadata)
+			expect(result).toEqual([
+				{
+					title: 'Welcome',
+					category: 'welcome',
+					order: 1,
+					depth: 1,
+					slug: '/welcome',
+					children: [
+						{
+							title: 'Introduction',
+							category: 'welcome',
+							order: 1,
+							depth: 2,
+							slug: '/welcome/introduction'
+						},
+						{
+							title: 'Getting Started',
+							category: 'welcome',
+							depth: 2,
+							slug: '/welcome/get',
+							order: 2
+						}
+					]
+				},
+				{
+					title: 'Elements',
+					category: 'elements',
+					order: 2,
+					depth: 1,
+					slug: '/elements',
+					children: [
+						{
+							title: 'Components',
+							order: 1,
+							depth: 2,
+							category: 'elements',
+							slug: '/elements/components'
+						},
+						{
+							title: 'List',
+							order: 2,
+							depth: 2,
+							category: 'elements',
+							slug: '/elements/list'
+						}
+					]
+				}
+			])
+		})
+	})
+
+	describe('fetchImports', () => {
+		it('should process sources and group files correctly', async () => {
+			const mockSources = {
+				'folder1/file1.js': vi.fn().mockResolvedValue('const test = 1;'),
+				'folder1/file2.ts': vi.fn().mockResolvedValue('const test: number = 2;'),
+				'folder2/file3.svelte': vi.fn().mockResolvedValue('<script>let count = 0;</script>'),
+				'./root.js': vi.fn().mockResolvedValue('console.log("root");')
+			}
+
+			const result = await fetchImports(mockSources)
+
+			expect(result).toEqual([
+				{
+					file: 'folder1/file1.js',
+					name: 'file1.js',
+					group: 'folder1',
+					language: 'javascript',
+					content: 'const test = 1;'
+				},
+				{
+					file: 'folder1/file2.ts',
+					name: 'file2.ts',
+					group: 'folder1',
+					language: 'typescript',
+					content: 'const test: number = 2;'
+				},
+
+				{
+					file: 'folder2/file3.svelte',
+					name: 'file3.svelte',
+					group: 'folder2',
+					language: 'svelte',
+					content: '<script>let count = 0;</script>'
+				},
+				{
+					file: './root.js',
+					name: 'root.js',
+					group: '.',
+					language: 'javascript',
+					content: 'console.log("root");'
+				}
+			])
+
+			expect(mockSources['folder1/file1.js']).toHaveBeenCalled()
+			expect(mockSources['folder1/file2.ts']).toHaveBeenCalled()
+			expect(mockSources['folder2/file3.svelte']).toHaveBeenCalled()
+			expect(mockSources['./root.js']).toHaveBeenCalled()
+		})
+
+		it('should handle empty sources', async () => {
+			const result = await fetchImports({})
+			expect(result).toEqual([])
+		})
+		it('should handle unknown file extensions', async () => {
+			const mockSources = {
+				'config/settings.toml': vi.fn().mockResolvedValue('[section]\nkey = "value"')
+			}
+
+			const result = await fetchImports(mockSources)
+
+			expect(result[0].language).toBe('toml')
+		})
+		it('should handle markdown files with correct language mapping', async () => {
+			const mockSources = {
+				'docs/readme.md': vi.fn().mockResolvedValue('# Title\n\nContent')
+			}
+
+			const result = await fetchImports(mockSources)
+
+			expect(result[0].language).toBe('markdown')
+		})
+	})
+	describe('groupFiles', () => {
+		it('should filter out root level files (group === ".")', () => {
+			const mockFiles = [
+				{
+					file: 'folder1/file1.js',
+					name: 'file1.js',
+					group: 'folder1',
+					language: 'javascript',
+					content: 'const test = 1;'
+				},
+				{
+					file: 'folder1/file2.ts',
+					name: 'file2.ts',
+					group: 'folder1',
+					language: 'typescript',
+					content: 'const test: number = 2;'
+				},
+
+				{
+					file: 'folder2/file3.svelte',
+					name: 'file3.svelte',
+					group: 'folder2',
+					language: 'svelte',
+					content: '<script>let count = 0;</script>'
+				},
+				{
+					file: './root.js',
+					name: 'root.js',
+					group: '.',
+					language: 'javascript',
+					content: 'console.log("root");'
+				}
+			]
+
+			const result = groupFiles(mockFiles)
+
+			expect(result).toEqual({
+				folder1: [
+					{
+						content: 'const test = 1;',
+						file: 'folder1/file1.js',
+						language: 'javascript',
+						name: 'file1.js'
+					},
+					{
+						content: 'const test: number = 2;',
+						file: 'folder1/file2.ts',
+						language: 'typescript',
+						name: 'file2.ts'
+					}
+				],
+				folder2: [
+					{
+						content: '<script>let count = 0;</script>',
+						file: 'folder2/file3.svelte',
+						language: 'svelte',
+						name: 'file3.svelte'
+					}
+				]
+			})
+		})
+	})
+
+	describe('fetchStories', () => {
+		it('should combine sources and modules into stories', async () => {
+			const mockSources = {
+				'story1/file1.js': vi.fn().mockResolvedValue('const test = 1;'),
+				'story1/file2.svelte': vi.fn().mockResolvedValue('<h1>Hello</h1>')
+			}
+
+			const mockModules = {
+				'story1/App.svelte': vi.fn().mockResolvedValue({ default: 'MockComponent' })
+			}
+
+			const result = await fetchStories(mockSources, mockModules)
+
+			expect(result).toEqual({
+				story1: {
+					files: [
+						{
+							file: 'story1/file1.js',
+							name: 'file1.js',
+							language: 'javascript',
+							content: 'const test = 1;'
+						},
+						{
+							file: 'story1/file2.svelte',
+							name: 'file2.svelte',
+							language: 'svelte',
+							content: '<h1>Hello</h1>'
+						}
+					],
+					App: { default: 'MockComponent' }
+				}
+			})
+		})
+
+		it('should handle multiple stories', async () => {
+			const mockSources = {
+				'story1/file1.js': vi.fn().mockResolvedValue('const a = 1;'),
+				'story2/file2.js': vi.fn().mockResolvedValue('const b = 2;')
+			}
+
+			const mockModules = {
+				'story1/App.svelte': vi.fn().mockResolvedValue({ default: 'Component1' }),
+				'story2/App.svelte': vi.fn().mockResolvedValue({ default: 'Component2' })
+			}
+
+			const result = await fetchStories(mockSources, mockModules)
+
+			expect(result).toHaveProperty('story1')
+			expect(result).toHaveProperty('story2')
+			expect(result.story1.App).toEqual({ default: 'Component1' })
+			expect(result.story2.App).toEqual({ default: 'Component2' })
+		})
+
+		it('should handle empty sources and modules', async () => {
+			const result = await fetchStories({}, {})
+			expect(result).toEqual({})
+		})
+	})
+})

package/tsconfig.build.json

@@ -0,0 +1,11 @@
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "noEmit": false,
+    "declaration": true,
+    "declarationDir": "./dist",
+    "emitDeclarationOnly": true,
+    "outDir": "./dist"
+  },
+  "exclude": ["**/spec/**", "**/test/**", "dist"]
+}