svelte-docsmith 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 George Daskalakis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,162 @@
+# Svelte DocSmith
+
+[![NPM version](https://img.shields.io/npm/v/svelte-docsmith.svg?style=flat)](https://www.npmjs.com/package/svelte-docsmith)
+[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](https://opensource.org/licenses/MIT)
+
+The documentation framework for Svelte 5 library authors whose interactive
+examples need to live inside one real, stateful SvelteKit app — not sandboxed as
+isolated islands.
+
+Write a markdown file under `src/routes/docs/` and you get a styled page with
+syntax highlighting, heading anchors, a sidebar derived from your content, and a
+live table of contents — no per-page wiring, no content collection to configure.
+
+> **Status: pre-1.0.** Published to npm and usable today. The public API is still
+> stabilising, so minor releases may include breaking changes until v1.0.
+
+## Install
+
+```bash
+npm install svelte-docsmith
+```
+
+Peer dependencies: Svelte 5, SvelteKit 2, and Tailwind v4 — set up the standard
+way in your app.
+
+## Setup
+
+Three small pieces, once.
+
+**1. The markdown pipeline** — in `svelte.config.js`. One call bundles mdsvex,
+Shiki highlighting (dual light/dark themes, a generous language set, plain-text
+fallback for unknown languages), heading anchors, and the packaged page layout:
+
+```js
+// svelte.config.js
+import adapter from '@sveltejs/adapter-auto';
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
+import { docsmith } from 'svelte-docsmith/preprocess';
+
+export default {
+	extensions: ['.svelte', '.md'],
+	preprocess: [vitePreprocess(), docsmith()],
+	kit: { adapter: adapter() }
+};
+```
+
+**2. The Vite plugin** — in `vite.config.ts`. It scans your doc pages'
+frontmatter into the `svelte-docsmith/content` module (so the sidebar is derived
+from content, never hand-written) and powers `LiveExample`:
+
+```ts
+// vite.config.ts
+import { sveltekit } from '@sveltejs/kit/vite';
+import tailwindcss from '@tailwindcss/vite';
+import { docsmith } from 'svelte-docsmith/vite';
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+	plugins: [docsmith(), tailwindcss(), sveltekit()]
+});
+```
+
+By default it scans `src/routes/docs`; pass `docsmith({ content: 'src/routes/guide' })`
+to point elsewhere.
+
+**3. The stylesheet** — in your root `app.css`. Your app needs Tailwind v4 set up
+the standard way (`tailwindcss` + the `@tailwindcss/vite` plugin, stylesheet
+imported in the root layout). After that the whole style contract is one import:
+
+```css
+@import 'tailwindcss';
+@import 'svelte-docsmith/theme.css';
+```
+
+`theme.css` makes Tailwind scan the package, defines the shadcn theme tokens
+(`--background`, `--primary`, `--radius`, …) for `:root` and `.dark`, and pulls
+in the typography and animation plugins. Override any token by redefining it
+after the import.
+
+## The shell
+
+Add `DocsShell` once, in `src/routes/docs/+layout.svelte`. It composes the
+header, sidebar, content area, and table of contents. `docs` is the generated
+content index — no import of a content collection, no alias to configure:
+
+```svelte
+<script lang="ts">
+	import { DocsShell, defineConfig } from 'svelte-docsmith';
+	import { docs } from 'svelte-docsmith/content';
+
+	const config = defineConfig({
+		title: 'My Library',
+		github: 'https://github.com/you/my-library'
+	});
+	const { children } = $props();
+</script>
+
+<DocsShell {config} content={docs}>
+	{@render children()}
+</DocsShell>
+```
+
+## Doc pages
+
+Each page is a `+page.md` under `src/routes/docs/`. Frontmatter drives the
+sidebar; the body is markdown:
+
+````md
+---
+title: Getting Started
+description: Install and configure the library.
+section: Guides
+order: 1
+---
+
+## Installation
+
+```bash
+npm install my-library
+```
+````
+
+`title` names the page. `section` groups pages in the sidebar; `order` sorts
+within a group (and orders the groups by their smallest `order`). Add the file
+and it appears in the sidebar — styled, highlighted, with a table of contents.
+
+## Live examples
+
+`LiveExample` renders a real, interactive component next to its own
+syntax-highlighted source — one file, imported twice, so the demo and its code
+can never drift. The `?source` import is served by the same `docsmith()` Vite
+plugin you already added:
+
+```svelte
+<script>
+	import { LiveExample } from 'svelte-docsmith';
+	import Counter from '$lib/examples/counter.svelte';
+	import counterSource from '$lib/examples/counter.svelte?source';
+</script>
+
+<LiveExample source={counterSource}>
+	<Counter />
+</LiveExample>
+```
+
+## What's exported
+
+| Entry point                  | What it is                                                                                               |
+| ---------------------------- | -------------------------------------------------------------------------------------------------------- |
+| `svelte-docsmith`            | `DocsShell`, `LiveExample`, `Tabs`, `TabItem`, `defineConfig` + `DocsmithConfig`/`DocsContentItem` types |
+| `svelte-docsmith/preprocess` | `docsmith()` — the mdsvex/Shiki pipeline (Node, config time)                                             |
+| `svelte-docsmith/vite`       | `docsmith()` — content index + `?source` (Node, build time)                                              |
+| `svelte-docsmith/content`    | `docs` — the generated sidebar content index                                                             |
+| `svelte-docsmith/theme.css`  | the style contract                                                                                       |
+
+The vendored shadcn primitives and internal helpers (the TOC engine, clipboard
+utility, markdown renderer map) are **not** part of the public API — they can
+change between releases. Get buttons, cards, etc. from `shadcn-svelte` directly.
+
+## License
+
+MIT — see [LICENSE](LICENSE).

package/dist/clipboard.svelte.d.ts

@@ -0,0 +1,6 @@
+export declare function useClipboard(timeout?: number): {
+    readText: (node: HTMLElement) => void;
+    copy: () => void;
+    readonly currentText: string;
+    readonly copied: boolean;
+};

package/dist/clipboard.svelte.js

@@ -0,0 +1,27 @@
+export function useClipboard(timeout = 1500) {
+    let text = $state('');
+    let copied = $state(false);
+    function readText(node) {
+        text = node.innerText.trim();
+    }
+    function copy() {
+        if (text) {
+            navigator.clipboard.writeText(text).then(() => {
+                copied = true;
+                setTimeout(() => {
+                    copied = false;
+                }, timeout);
+            });
+        }
+    }
+    return {
+        readText,
+        copy,
+        get currentText() {
+            return text;
+        },
+        get copied() {
+            return copied;
+        }
+    };
+}

package/dist/config.d.ts

@@ -0,0 +1,79 @@
+/**
+ * Static site configuration passed to `DocsShell`. Content-derived data (the
+ * sidebar nav) is NOT here — it comes from your content collection at runtime.
+ */
+/** A link rendered in the header nav or footer. */
+export type DocsmithLink = {
+    label: string;
+    href: string;
+    /** Open in a new tab with `rel="noopener"`. */
+    external?: boolean;
+};
+/** A titled column of links in the footer. */
+export type DocsmithFooterColumn = {
+    title: string;
+    links: DocsmithLink[];
+};
+export type DocsmithConfig = {
+    /** Site title, shown in the header/sidebar. */
+    title: string;
+    /** Optional GitHub URL; renders a link in the header when set. */
+    github?: string;
+    /** Optional version string, shown in the header (e.g. your library version). */
+    version?: string;
+    /** Optional logo image src; falls back to the built-in book mark. */
+    logo?: string;
+    /** Top-level header navigation links. */
+    nav?: DocsmithLink[];
+    /** Footer content, driven by data. */
+    footer?: {
+        /** Copyright / attribution line. */
+        copyright?: string;
+        /** Titled columns of links. */
+        columns?: DocsmithFooterColumn[];
+    };
+};
+/**
+ * Validate a {@link DocsmithConfig} at build time. Purely a pass-through for
+ * typed callers; the runtime checks catch untyped or dynamically-built configs
+ * with a real error message instead of a blank header.
+ */
+export declare function defineConfig(config: DocsmithConfig): DocsmithConfig;
+/**
+ * The minimal shape `DocsShell` needs from each content entry to build the
+ * sidebar. A velite `docs` collection with title/section/order/path frontmatter
+ * satisfies this structurally.
+ */
+export type DocsContentItem = {
+    title: string;
+    path: string;
+    section?: string;
+    order?: number;
+    description?: string;
+    /**
+     * The page's `h2`/`h3` headings, extracted at build time by the `docsmith()`
+     * vite plugin, so `DocsShell` can render the in-page TOC server-side. The
+     * runtime TOC engine still owns scroll-spy and re-scans the DOM.
+     */
+    toc?: {
+        id: string;
+        title: string;
+        depth: 2 | 3;
+    }[];
+};
+/** A single sidebar link. */
+export type NavItem = {
+    title: string;
+    url: string;
+};
+/** A titled group of sidebar links. */
+export type NavGroup = {
+    title: string;
+    items: NavItem[];
+};
+/**
+ * Derive sidebar nav from a content collection (PLAN.md §2.6): group by
+ * `section`, order by `order` within a group, and order groups by the smallest
+ * `order` they contain. Entries without a `section` fall under "Docs".
+ */
+export declare function navFromContent(content: DocsContentItem[]): NavGroup[];

package/dist/config.js

@@ -0,0 +1,55 @@
+/**
+ * Validate a {@link DocsmithConfig} at build time. Purely a pass-through for
+ * typed callers; the runtime checks catch untyped or dynamically-built configs
+ * with a real error message instead of a blank header.
+ */
+export function defineConfig(config) {
+    if (typeof config !== 'object' || config === null) {
+        throw new Error('[svelte-docsmith] defineConfig expects a config object.');
+    }
+    if (typeof config.title !== 'string' || config.title.trim() === '') {
+        throw new Error('[svelte-docsmith] config.title is required — the site title shown in the sidebar header.');
+    }
+    for (const key of ['github', 'version', 'logo']) {
+        if (config[key] !== undefined && typeof config[key] !== 'string') {
+            throw new Error(`[svelte-docsmith] config.${key} must be a string when set.`);
+        }
+    }
+    if (config.nav !== undefined) {
+        if (!Array.isArray(config.nav)) {
+            throw new Error('[svelte-docsmith] config.nav must be an array of { label, href } links.');
+        }
+        for (const link of config.nav) {
+            if (typeof link?.label !== 'string' || typeof link?.href !== 'string') {
+                throw new Error('[svelte-docsmith] each config.nav entry needs a string `label` and `href`.');
+            }
+        }
+    }
+    if (config.footer !== undefined &&
+        (typeof config.footer !== 'object' || config.footer === null)) {
+        throw new Error('[svelte-docsmith] config.footer must be an object ({ copyright?, columns? }).');
+    }
+    return config;
+}
+/**
+ * Derive sidebar nav from a content collection (PLAN.md §2.6): group by
+ * `section`, order by `order` within a group, and order groups by the smallest
+ * `order` they contain. Entries without a `section` fall under "Docs".
+ */
+export function navFromContent(content) {
+    const groups = new Map();
+    for (const item of content) {
+        const section = item.section ?? 'Docs';
+        const order = item.order ?? 0;
+        const group = groups.get(section) ?? { minOrder: Infinity, items: [] };
+        group.items.push({ title: item.title, url: item.path, order });
+        group.minOrder = Math.min(group.minOrder, order);
+        groups.set(section, group);
+    }
+    return [...groups.entries()]
+        .sort((a, b) => a[1].minOrder - b[1].minOrder)
+        .map(([title, group]) => ({
+        title,
+        items: group.items.sort((a, b) => a.order - b.order).map(({ title, url }) => ({ title, url }))
+    }));
+}

package/dist/content.d.ts

@@ -0,0 +1,10 @@
+/**
+ * `svelte-docsmith/content` — the generated sidebar content index.
+ *
+ * At build time the `docsmith()` Vite plugin (in `vite.config.ts`) intercepts
+ * this import and replaces it with your doc pages' frontmatter. This file is
+ * only the fallback that runs when the plugin is missing — it exists so the
+ * import type-checks and fails with a clear message instead of a mystery.
+ */
+import type { DocsContentItem } from './config.js';
+export declare const docs: DocsContentItem[];

package/dist/content.js

@@ -0,0 +1,4 @@
+export const docs = [];
+throw new Error("[svelte-docsmith] 'svelte-docsmith/content' requires the docsmith() plugin. " +
+    "Add it to your vite.config: import { docsmith } from 'svelte-docsmith/vite'; " +
+    'plugins: [docsmith(), tailwindcss(), sveltekit()]');

package/dist/highlight.d.ts

@@ -0,0 +1,17 @@
+import { type Highlighter } from 'shiki';
+/**
+ * Shared Shiki defaults for the package's two build-time entries
+ * (`svelte-docsmith/preprocess` and `svelte-docsmith/vite`), so the doc
+ * pipeline and the LiveExample source panels can never drift apart.
+ */
+export declare const DEFAULT_THEMES: {
+    light: string;
+    dark: string;
+};
+/** A generous default language set for documentation code fences. */
+export declare const DEFAULT_LANGS: string[];
+/**
+ * Returns a getter that creates the highlighter on first use and caches it.
+ * Build-time only — never import this from component code.
+ */
+export declare function lazyHighlighter(themes: string[], langs: string[]): () => Promise<Highlighter>;

package/dist/highlight.js

@@ -0,0 +1,34 @@
+import { createHighlighter } from 'shiki';
+/**
+ * Shared Shiki defaults for the package's two build-time entries
+ * (`svelte-docsmith/preprocess` and `svelte-docsmith/vite`), so the doc
+ * pipeline and the LiveExample source panels can never drift apart.
+ */
+export const DEFAULT_THEMES = { light: 'github-light', dark: 'github-dark' };
+/** A generous default language set for documentation code fences. */
+export const DEFAULT_LANGS = [
+    'javascript',
+    'typescript',
+    'jsx',
+    'tsx',
+    'svelte',
+    'html',
+    'css',
+    'json',
+    'jsonc',
+    'bash',
+    'shell',
+    'markdown',
+    'yaml',
+    'toml',
+    'python',
+    'diff'
+];
+/**
+ * Returns a getter that creates the highlighter on first use and caches it.
+ * Build-time only — never import this from component code.
+ */
+export function lazyHighlighter(themes, langs) {
+    let promise;
+    return () => (promise ??= createHighlighter({ themes, langs }));
+}

package/dist/index.d.ts

@@ -0,0 +1,20 @@
+export { default as DocsShell } from './ui/layouts/docs-shell.svelte';
+export { default as ThemeProvider } from './ui/theme-provider.svelte';
+export { default as ThemeToggle } from './ui/theme-toggle.svelte';
+export { default as LiveExample } from './ui/live-example.svelte';
+export { default as Tabs } from './ui/tabs.svelte';
+export { default as TabItem } from './ui/tab-item.svelte';
+export { default as Callout } from './ui/callout.svelte';
+export { default as Steps } from './ui/steps.svelte';
+export { default as Step } from './ui/step.svelte';
+export { default as Card } from './ui/card.svelte';
+export { default as CardGrid } from './ui/card-grid.svelte';
+export { default as Accordion } from './ui/accordion.svelte';
+export { default as AccordionItem } from './ui/accordion-item.svelte';
+export { default as Badge, type BadgeVariant } from './ui/badge.svelte';
+export { default as Kbd } from './ui/kbd.svelte';
+export { default as FileTree } from './ui/file-tree.svelte';
+export { default as FileTreeItem } from './ui/file-tree-item.svelte';
+export { default as PropsTable } from './ui/props-table.svelte';
+export { default as Prop } from './ui/prop.svelte';
+export { defineConfig, type DocsmithConfig, type DocsContentItem } from './config.js';

package/dist/index.js

@@ -0,0 +1,26 @@
+// The svelte-docsmith public API. Everything not exported here — the vendored
+// shadcn primitives, the TOC engine, the clipboard helper, the markdown
+// renderer map — is internal and may change between releases.
+// Chrome
+export { default as DocsShell } from './ui/layouts/docs-shell.svelte';
+export { default as ThemeProvider } from './ui/theme-provider.svelte';
+export { default as ThemeToggle } from './ui/theme-toggle.svelte';
+// Docs components (authored inside markdown or composed in pages)
+export { default as LiveExample } from './ui/live-example.svelte';
+export { default as Tabs } from './ui/tabs.svelte';
+export { default as TabItem } from './ui/tab-item.svelte';
+export { default as Callout } from './ui/callout.svelte';
+export { default as Steps } from './ui/steps.svelte';
+export { default as Step } from './ui/step.svelte';
+export { default as Card } from './ui/card.svelte';
+export { default as CardGrid } from './ui/card-grid.svelte';
+export { default as Accordion } from './ui/accordion.svelte';
+export { default as AccordionItem } from './ui/accordion-item.svelte';
+export { default as Badge } from './ui/badge.svelte';
+export { default as Kbd } from './ui/kbd.svelte';
+export { default as FileTree } from './ui/file-tree.svelte';
+export { default as FileTreeItem } from './ui/file-tree-item.svelte';
+export { default as PropsTable } from './ui/props-table.svelte';
+export { default as Prop } from './ui/prop.svelte';
+// Config
+export { defineConfig } from './config.js';

package/dist/markdown-layout.svelte

@@ -0,0 +1,21 @@
+<script lang="ts" module>
+	// mdsvex maps markdown elements to this module's exports (the export names
+	// must match the tag names). `docsmith()` injects this file as the default
+	// layout for every compiled markdown page.
+	import * as markdown from './ui/markdown/index.js';
+	export const pre = markdown.pre;
+	export const code = markdown.code;
+	export const h2 = markdown.h2;
+	export const h3 = markdown.h3;
+	export const table = markdown.table;
+</script>
+
+<script lang="ts">
+	import type { Snippet } from 'svelte';
+
+	const { children }: { children: Snippet } = $props();
+</script>
+
+<article class="prose prose-base dark:prose-invert max-w-none pb-16">
+	{@render children()}
+</article>

package/dist/markdown-layout.svelte.d.ts

@@ -0,0 +1,18 @@
+export declare const pre: import("svelte").Component<{
+    children: Snippet;
+}, {}, "">;
+export declare const code: import("svelte").Component<{
+    children: Snippet;
+}, {}, "">;
+export declare const h2: import("svelte").Component<import("./ui/markdown/types.js").HeadingProps, {}, "">;
+export declare const h3: import("svelte").Component<import("./ui/markdown/types.js").HeadingProps, {}, "">;
+export declare const table: import("svelte").Component<{
+    children: Snippet;
+}, {}, "">;
+import type { Snippet } from 'svelte';
+type $$ComponentProps = {
+    children: Snippet;
+};
+declare const MarkdownLayout: import("svelte").Component<$$ComponentProps, {}, "">;
+type MarkdownLayout = ReturnType<typeof MarkdownLayout>;
+export default MarkdownLayout;

package/dist/preprocess.d.ts

@@ -0,0 +1,33 @@
+import { type MdsvexOptions } from 'mdsvex';
+import type { PreprocessorGroup } from 'svelte/compiler';
+export interface DocsmithPreprocessOptions {
+    /** File extensions compiled as markdown. Default: `['.md']`. */
+    extensions?: string[];
+    /** Shiki themes for the dual light/dark render. Default: github-light/github-dark. */
+    themes?: {
+        light: string;
+        dark: string;
+    };
+    /** Extra Shiki languages to load on top of the defaults. */
+    langs?: string[];
+    /**
+     * Absolute path to a custom mdsvex layout, or `false` for no layout.
+     * Default: the packaged layout, which wraps pages in a `prose` article and
+     * maps `pre`/`code`/`h2`/`h3` to the svelte-docsmith markdown components.
+     * A custom layout must export a `pre` component from its module script —
+     * code fences render through it (re-export `markdown.pre` if in doubt).
+     */
+    layout?: string | false;
+    /** Extra remark plugins, appended after docsmith's own. */
+    remarkPlugins?: MdsvexOptions['remarkPlugins'];
+    /** Extra rehype plugins, appended after docsmith's own (slug, sectionize). */
+    rehypePlugins?: MdsvexOptions['rehypePlugins'];
+}
+/**
+ * Build the svelte-docsmith preprocessor: mdsvex with Shiki highlighting
+ * (raw-code `highlight` hook — the correct mdsvex integration point, see the
+ * repo's PLAN.md §4.5), heading slugs/anchor sections, and the packaged doc
+ * layout. Unknown code-fence languages fall back to plain text instead of
+ * failing the build.
+ */
+export declare function docsmith(options?: DocsmithPreprocessOptions): PreprocessorGroup;

package/dist/preprocess.js

@@ -0,0 +1,65 @@
+/**
+ * `svelte-docsmith/preprocess` — the entire markdown pipeline in one call.
+ *
+ * This entry runs in Node at config time (registered in `svelte.config.js`,
+ * or in `vite.config.js` once SvelteKit 3 consolidates the two — the factory
+ * doesn't care where it's registered). It must never import component code.
+ */
+import rehypeSectionize from '@hbsnow/rehype-sectionize';
+import { transformerNotationHighlight } from '@shikijs/transformers';
+import { escapeSvelte, mdsvex } from 'mdsvex';
+import { fileURLToPath } from 'node:url';
+import rehypeSlug from 'rehype-slug';
+import { DEFAULT_LANGS, DEFAULT_THEMES, lazyHighlighter } from './highlight.js';
+/**
+ * Build the svelte-docsmith preprocessor: mdsvex with Shiki highlighting
+ * (raw-code `highlight` hook — the correct mdsvex integration point, see the
+ * repo's PLAN.md §4.5), heading slugs/anchor sections, and the packaged doc
+ * layout. Unknown code-fence languages fall back to plain text instead of
+ * failing the build.
+ */
+export function docsmith(options = {}) {
+    const themes = options.themes ?? DEFAULT_THEMES;
+    const langs = [...new Set([...DEFAULT_LANGS, ...(options.langs ?? [])])];
+    const getHighlighter = lazyHighlighter([themes.light, themes.dark], langs);
+    const layout = options.layout === false
+        ? undefined
+        : (options.layout ?? fileURLToPath(new URL('./markdown-layout.svelte', import.meta.url)));
+    // mdsvex types `markup`'s filename as required where Svelte types it as
+    // optional — runtime-compatible (Svelte always passes a filename for real
+    // files), but structurally incompatible, hence the cast.
+    return mdsvex({
+        extensions: options.extensions ?? ['.md'],
+        layout,
+        highlight: {
+            highlighter: async (code, lang) => {
+                const highlighter = await getHighlighter();
+                const language = lang && highlighter.getLoadedLanguages().includes(lang) ? lang : 'text';
+                // Shiki highlights the raw code; escapeSvelte makes the result safe
+                // to embed in a Svelte component.
+                const html = escapeSvelte(highlighter.codeToHtml(code, {
+                    lang: language,
+                    themes,
+                    transformers: [transformerNotationHighlight()]
+                }));
+                // Without a layout there is no `Components.pre` to render through —
+                // keep Shiki's own <pre> as-is.
+                if (layout === undefined)
+                    return `{@html \`${html}\`}`;
+                // Strip Shiki's outer <pre> so the layout's <pre> component (with
+                // the copy-button chrome) provides it instead.
+                const inner = html
+                    .replace(/^<pre[^>]*>/, '')
+                    .replace(/<\/pre>\s*$/, '')
+                    .trim();
+                return `<Components.pre>{@html \`${inner}\`}</Components.pre>`;
+            }
+        },
+        remarkPlugins: options.remarkPlugins,
+        rehypePlugins: [
+            rehypeSlug,
+            [rehypeSectionize, { idPropertyName: 'data-section-id' }],
+            ...(options.rehypePlugins ?? [])
+        ]
+    });
+}

package/dist/shadcn.d.ts

@@ -0,0 +1,12 @@
+import { type ClassValue } from 'clsx';
+export declare function cn(...inputs: ClassValue[]): string;
+export type WithoutChild<T> = T extends {
+    child?: any;
+} ? Omit<T, 'child'> : T;
+export type WithoutChildren<T> = T extends {
+    children?: any;
+} ? Omit<T, 'children'> : T;
+export type WithoutChildrenOrChild<T> = WithoutChildren<WithoutChild<T>>;
+export type WithElementRef<T, U extends HTMLElement = HTMLElement> = T & {
+    ref?: U | null;
+};

package/dist/shadcn.js

@@ -0,0 +1,5 @@
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+export function cn(...inputs) {
+    return twMerge(clsx(inputs));
+}