svelte-streamdown 2.5.1 → 2.5.2

package/README.md

@@ -69,6 +69,10 @@ Full support for
     with _rich_ **content** support
     and multiline
 
+> [!NOTE]
+> 🧠 **AI Prompting Tip:** For best results, use our [comprehensive prompt](/prompting) covering all supported markdown features.
+
+
 ### 💻 Interactive Code Blocks
 
 - Syntax highlighting powered by Shiki

package/dist/Elements/Image.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { useStreamdown } from '../context.svelte.js';
-	import { transformUrl } from '../utils/url.js';
+	import { isPathRelativeUrl, transformUrl } from '../utils/url.js';
 	import Slot from './Slot.svelte';
 	import type { Tokens } from 'marked';
 	import type { Snippet } from 'svelte';
@@ -17,16 +17,18 @@
 		id: string;
 	} = $props();
 
+	const isRelativeUrl = $derived(isPathRelativeUrl(token.href));
+
 	const transformedUrl = $derived(
 		transformUrl(token.href, streamdown.allowedImagePrefixes ?? [], streamdown.defaultOrigin)
 	);
 </script>
 
 {#if token.href !== 'streamdown:incomplete-image'}
-	{#if transformedUrl}
+	{#if transformedUrl || isRelativeUrl}
 		<Slot
 			props={{
-				src: transformedUrl,
+				src: isRelativeUrl ? token.href : transformedUrl,
 				alt: token.text,
 				children,
 				token
@@ -38,7 +40,11 @@
 				style={streamdown.isMounted ? streamdown.animationBlockStyle : ''}
 				class={streamdown.theme.image.base}
 			>
-				<img class={streamdown.theme.image.image} src={transformedUrl} alt={token.text} />
+				<img
+					class={streamdown.theme.image.image}
+					src={isRelativeUrl ? token.href : transformedUrl}
+					alt={token.text}
+				/>
 			</span>
 		</Slot>
 	{:else}

package/dist/Elements/Link.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { useStreamdown } from '../context.svelte.js';
-	import { transformUrl } from '../utils/url.js';
+	import { isPathRelativeUrl, transformUrl } from '../utils/url.js';
 	import Slot from './Slot.svelte';
 	import type { Tokens } from 'marked';
 	import type { Snippet } from 'svelte';
@@ -17,12 +17,14 @@
 		id: string;
 	} = $props();
 
+	const isRelativeUrl = $derived(isPathRelativeUrl(token.href));
+
 	const transformedUrl = $derived(
 		transformUrl(token.href, streamdown.allowedLinkPrefixes ?? [], streamdown.defaultOrigin)
 	);
 </script>
 
-{#if transformedUrl || token.href === 'streamdown:incomplete-link'}
+{#if transformedUrl || token.href === 'streamdown:incomplete-link' || isRelativeUrl}
 	<Slot
 		props={{
 			href: transformedUrl,
@@ -37,9 +39,9 @@
 		<a
 			data-streamdown-link={id}
 			class={streamdown.theme.link.base}
-			href={transformedUrl}
-			target="_blank"
-			rel="noopener noreferrer"
+			{...isRelativeUrl
+				? { href: token.href }
+				: { href: transformedUrl, target: '_blank', rel: 'noopener noreferrer' }}
 		>
 			{@render children()}
 		</a>

package/dist/theme.js

@@ -104,7 +104,7 @@ export const theme = {
     mermaid: {
         base: 'group relative my-4 h-auto rounded-xl border border-gray-200 bg-white overflow-hidden items-center min-h-[500px]',
         icon: 'size-5',
-        buttons: 'absolute right-1 top-1 z-10 flex h-fit w-fit items-center gap-1'
+        buttons: 'absolute right-1 top-1 flex h-fit w-fit items-center gap-1'
     },
     math: {
         block: '',
@@ -257,7 +257,7 @@ export const shadcnTheme = {
     mermaid: {
         base: 'group relative my-4 h-auto rounded-lg border border-border bg-card overflow-hidden items-center min-h-[500px]',
         icon: 'size-5',
-        buttons: 'absolute right-1 top-1 z-10 flex h-fit w-fit items-center gap-1'
+        buttons: 'absolute right-1 top-1 flex h-fit w-fit items-center gap-1'
     },
     math: {
         block: 'text-foreground',

package/dist/utils/url.d.ts

@@ -1,2 +1,3 @@
 export declare const parseUrl: (url: unknown, defaultOrigin?: string) => URL | null;
+export declare const isPathRelativeUrl: (url: unknown) => boolean;
 export declare const transformUrl: (url: unknown, allowedPrefixes: string[], defaultOrigin?: string) => string | null;

package/dist/utils/url.js

@@ -20,7 +20,7 @@ export const parseUrl = (url, defaultOrigin) => {
         return null;
     }
 };
-const isPathRelativeUrl = (url) => {
+export const isPathRelativeUrl = (url) => {
     if (typeof url !== 'string')
         return false;
     return url.startsWith('/');
@@ -29,6 +29,7 @@ export const transformUrl = (url, allowedPrefixes, defaultOrigin) => {
     if (!url)
         return null;
     const parsedUrl = parseUrl(url, defaultOrigin);
+    console.log('parsedUrl', { parsedUrl, url });
     if (!parsedUrl)
         return null;
     // If the input is path relative, we output a path relative URL as well,

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "svelte-streamdown",
-	"version": "2.5.1",
+	"version": "2.5.2",
 	"scripts": {
 		"dev": "vite dev",
 		"build": "vite build && npm run prepack",