diff --git a/apps/demo/package.json b/apps/demo/package.json index bc39d89..49a5784 100644 --- a/apps/demo/package.json +++ b/apps/demo/package.json @@ -27,6 +27,9 @@ "bits-ui": "^2.18.1", "clsx": "^2.1.1", "enhanced-video-sveltekit": "workspace:*", + "mdsvex": "^0.12.7", + "prism-themes": "^1.9.0", + "remark-gfm": "^4.0.1", "shadcn-svelte": "^1.2.7", "svelte": "^5.0.0", "svelte-check": "^4.0.0", diff --git a/apps/demo/src/lib/docs/DocsInstallSwitcher.svelte b/apps/demo/src/lib/docs/DocsInstallSwitcher.svelte new file mode 100644 index 0000000..444ff78 --- /dev/null +++ b/apps/demo/src/lib/docs/DocsInstallSwitcher.svelte @@ -0,0 +1,51 @@ + + +
+ + + Example +
+ + +
+
+ + {#if tab === 'cli'} +
+
+ shell + Install into a SvelteKit app +
+
pnpm add -D enhanced-video-sveltekit
+
+ {:else} +
+
+ vite.config.ts + Plugin order matters +
+
plugins: [tailwindcss(), enhancedVideos(), sveltekit()]
+
+ {/if} +
+
+
diff --git a/apps/demo/src/lib/docs/DocsVideoFeature.svelte b/apps/demo/src/lib/docs/DocsVideoFeature.svelte new file mode 100644 index 0000000..1329759 --- /dev/null +++ b/apps/demo/src/lib/docs/DocsVideoFeature.svelte @@ -0,0 +1,17 @@ +
+
+

+ Live clip (build pipeline) +

+
+ +
diff --git a/apps/demo/src/lib/mdsvex/Callout.svelte b/apps/demo/src/lib/mdsvex/Callout.svelte new file mode 100644 index 0000000..1695c0e --- /dev/null +++ b/apps/demo/src/lib/mdsvex/Callout.svelte @@ -0,0 +1,32 @@ + + + + {title} + + {@render children()} + + diff --git a/apps/demo/src/lib/mdsvex/MdsvexArticleLayout.svelte b/apps/demo/src/lib/mdsvex/MdsvexArticleLayout.svelte new file mode 100644 index 0000000..310ad67 --- /dev/null +++ b/apps/demo/src/lib/mdsvex/MdsvexArticleLayout.svelte @@ -0,0 +1,98 @@ + + + + +
+
+
+ + SvelteKit + + + Vite + +
+

{title}

+ {#if description} +

{description}

+ {/if} + {#if updated} +

Last updated

+ {/if} +
+ +
+ {@render children()} +
+ + + + +
diff --git a/apps/demo/src/lib/mdsvex/md/MdA.svelte b/apps/demo/src/lib/mdsvex/md/MdA.svelte new file mode 100644 index 0000000..e25b7b1 --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdA.svelte @@ -0,0 +1,25 @@ + + + + {#if children}{@render children()}{/if} + diff --git a/apps/demo/src/lib/mdsvex/md/MdBlockquote.svelte b/apps/demo/src/lib/mdsvex/md/MdBlockquote.svelte new file mode 100644 index 0000000..2adf9db --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdBlockquote.svelte @@ -0,0 +1,5 @@ +
+ +
diff --git a/apps/demo/src/lib/mdsvex/md/MdH1.svelte b/apps/demo/src/lib/mdsvex/md/MdH1.svelte new file mode 100644 index 0000000..3f34d6b --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdH1.svelte @@ -0,0 +1,3 @@ +

+ +

diff --git a/apps/demo/src/lib/mdsvex/md/MdH2.svelte b/apps/demo/src/lib/mdsvex/md/MdH2.svelte new file mode 100644 index 0000000..efa94a4 --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdH2.svelte @@ -0,0 +1,5 @@ +

+ +

diff --git a/apps/demo/src/lib/mdsvex/md/MdH3.svelte b/apps/demo/src/lib/mdsvex/md/MdH3.svelte new file mode 100644 index 0000000..8d986bf --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdH3.svelte @@ -0,0 +1,3 @@ +

+ +

diff --git a/apps/demo/src/lib/mdsvex/md/MdHr.svelte b/apps/demo/src/lib/mdsvex/md/MdHr.svelte new file mode 100644 index 0000000..8db62d6 --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdHr.svelte @@ -0,0 +1 @@ +
diff --git a/apps/demo/src/lib/mdsvex/md/MdLi.svelte b/apps/demo/src/lib/mdsvex/md/MdLi.svelte new file mode 100644 index 0000000..49be709 --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdLi.svelte @@ -0,0 +1 @@ +
  • diff --git a/apps/demo/src/lib/mdsvex/md/MdOl.svelte b/apps/demo/src/lib/mdsvex/md/MdOl.svelte new file mode 100644 index 0000000..a5a82bd --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdOl.svelte @@ -0,0 +1,3 @@ +
      + +
    diff --git a/apps/demo/src/lib/mdsvex/md/MdP.svelte b/apps/demo/src/lib/mdsvex/md/MdP.svelte new file mode 100644 index 0000000..377ff67 --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdP.svelte @@ -0,0 +1 @@ +

    diff --git a/apps/demo/src/lib/mdsvex/md/MdPre.svelte b/apps/demo/src/lib/mdsvex/md/MdPre.svelte new file mode 100644 index 0000000..5505124 --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdPre.svelte @@ -0,0 +1,3 @@ +
    diff --git a/apps/demo/src/lib/mdsvex/md/MdStrong.svelte b/apps/demo/src/lib/mdsvex/md/MdStrong.svelte new file mode 100644 index 0000000..5fdbce5 --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdStrong.svelte @@ -0,0 +1 @@ + diff --git a/apps/demo/src/lib/mdsvex/md/MdTable.svelte b/apps/demo/src/lib/mdsvex/md/MdTable.svelte new file mode 100644 index 0000000..766607c --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdTable.svelte @@ -0,0 +1,7 @@ +
    + + +
    +
    diff --git a/apps/demo/src/lib/mdsvex/md/MdTd.svelte b/apps/demo/src/lib/mdsvex/md/MdTd.svelte new file mode 100644 index 0000000..aab62a4 --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdTd.svelte @@ -0,0 +1 @@ + diff --git a/apps/demo/src/lib/mdsvex/md/MdTh.svelte b/apps/demo/src/lib/mdsvex/md/MdTh.svelte new file mode 100644 index 0000000..338a22a --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdTh.svelte @@ -0,0 +1,5 @@ + + + diff --git a/apps/demo/src/lib/mdsvex/md/MdThead.svelte b/apps/demo/src/lib/mdsvex/md/MdThead.svelte new file mode 100644 index 0000000..04e65d2 --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdThead.svelte @@ -0,0 +1,5 @@ + + + diff --git a/apps/demo/src/lib/mdsvex/md/MdTr.svelte b/apps/demo/src/lib/mdsvex/md/MdTr.svelte new file mode 100644 index 0000000..f41e05a --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdTr.svelte @@ -0,0 +1,5 @@ + + + diff --git a/apps/demo/src/lib/mdsvex/md/MdUl.svelte b/apps/demo/src/lib/mdsvex/md/MdUl.svelte new file mode 100644 index 0000000..05aa7ff --- /dev/null +++ b/apps/demo/src/lib/mdsvex/md/MdUl.svelte @@ -0,0 +1,3 @@ +
      + +
    diff --git a/apps/demo/src/routes/+page.svelte b/apps/demo/src/routes/+page.svelte index e06dd54..ecdaff0 100644 --- a/apps/demo/src/routes/+page.svelte +++ b/apps/demo/src/routes/+page.svelte @@ -20,12 +20,18 @@ > enhanced-video-sveltekit - GitHub ↗ +
    diff --git a/apps/demo/src/routes/docs/+layout.svelte b/apps/demo/src/routes/docs/+layout.svelte new file mode 100644 index 0000000..f0eab65 --- /dev/null +++ b/apps/demo/src/routes/docs/+layout.svelte @@ -0,0 +1,44 @@ + + +
    + +
    + +
    + +
    + {@render children()} +
    +
    diff --git a/apps/demo/src/routes/docs/+page.svx b/apps/demo/src/routes/docs/+page.svx new file mode 100644 index 0000000..56e0f22 --- /dev/null +++ b/apps/demo/src/routes/docs/+page.svx @@ -0,0 +1,251 @@ +--- +title: enhanced-video-sveltekit +description: Build-time video pipeline for SvelteKit — multi-format transcodes, auto poster, lazy loading, and a single custom element in your markup. +updated: '2026-05-16' +--- + + + + + {title} — documentation + + + +## Overview + +**enhanced-video-sveltekit** ships **`enhancedVideos()`** — two coordinated **Vite** plugins: + +1. **Markup plugin** (`order: 'pre'`) scans `.svelte` sources for the custom **`enhanced:video`** element (same namespace as HTML, so it is written like a normal tag in Svelte). It rewrites markup to the runtime **`EnhancedVideo`** component, wires **`metadata`** from a virtual import, and preserves passthrough **`