markstream-svelte 0.0.1-beta.1

package/README.md

@@ -0,0 +1,77 @@
+# markstream-svelte
+
+Svelte 5 renderer aligned with `markstream-vue`, `markstream-vue2`, and `markstream-react`.
+
+## Install
+
+```bash
+pnpm add markstream-svelte svelte
+```
+
+Optional heavy renderers stay as peer dependencies, matching the Vue and React packages:
+
+```bash
+pnpm add katex mermaid stream-monaco @terrastruct/d2 @antv/infographic
+```
+
+## Basic Usage
+
+```svelte
+<script lang="ts">
+  import MarkdownRender from 'markstream-svelte'
+  import 'markstream-svelte/index.css'
+
+  const content = `# Hello
+
+Inline math: $E = mc^2$
+
+\`\`\`mermaid
+flowchart LR
+  A --> B
+\`\`\`
+`
+</script>
+
+<MarkdownRender {content} />
+```
+
+## Workers
+
+```svelte
+<script lang="ts">
+  import MarkdownRender, { setKaTeXWorker, setMermaidWorker } from 'markstream-svelte'
+  import KatexWorker from 'markstream-svelte/workers/katexRenderer.worker?worker&inline'
+  import MermaidWorker from 'markstream-svelte/workers/mermaidParser.worker?worker&inline'
+
+  setKaTeXWorker(new KatexWorker())
+  setMermaidWorker(new MermaidWorker())
+</script>
+
+<MarkdownRender content="Inline math: $x^2$" />
+```
+
+## Custom Components
+
+```svelte
+<script lang="ts">
+  import MarkdownRender, { setCustomComponents } from 'markstream-svelte'
+  import ThinkingNode from './ThinkingNode.svelte'
+
+  const customId = 'demo'
+  setCustomComponents(customId, {
+    thinking: ThinkingNode,
+  })
+</script>
+
+<MarkdownRender
+  content="<thinking>nested markdown</thinking>"
+  {customId}
+  customHtmlTags={['thinking']}
+/>
+```
+
+Run the local playground with:
+
+```bash
+pnpm play:svelte
+```

package/dist/components/AdmonitionNode.svelte

@@ -0,0 +1,8 @@
+<script lang="ts">
+  import type { SvelteRenderableNode, SvelteRenderContext } from './shared/node-helpers'
+  import { renderNodeHtml } from './shared/renderNodeHtml'
+  export let node: SvelteRenderableNode
+  export let context: SvelteRenderContext | undefined = undefined
+  $: html = renderNodeHtml(node, context)
+</script>
+{@html html}

package/dist/components/AdmonitionNode.svelte.d.ts

@@ -0,0 +1,23 @@
+import type { SvelteRenderableNode, SvelteRenderContext } from './shared/node-helpers';
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const AdmonitionNode: $$__sveltets_2_IsomorphicComponent<{
+    node: SvelteRenderableNode;
+    context?: SvelteRenderContext | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type AdmonitionNode = InstanceType<typeof AdmonitionNode>;
+export default AdmonitionNode;
+//# sourceMappingURL=AdmonitionNode.svelte.d.ts.map

package/dist/components/AdmonitionNode.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdmonitionNode.svelte.d.ts","sourceRoot":"","sources":["../../src/components/AdmonitionNode.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AActF,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,cAAc;UAVsC,oBAAoB;cAAY,mBAAmB,GAAG,SAAS;;;kBAUtB,CAAC;AAClF,KAAK,cAAc,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAC5D,eAAe,cAAc,CAAC"}

package/dist/components/BlockquoteNode.svelte

@@ -0,0 +1,10 @@
+<script lang="ts">
+  import type { SvelteRenderableNode, SvelteRenderContext } from './shared/node-helpers'
+  import RenderChildren from './RenderChildren.svelte'
+  import { getNodeList, getString } from './shared/node-helpers'
+  export let node: SvelteRenderableNode
+  export let context: SvelteRenderContext | undefined = undefined
+  export let indexKey: string | number | undefined = undefined
+  $: cite = getString((node as any)?.cite)
+</script>
+<blockquote class="blockquote blockquote-node" dir="auto" cite={cite || undefined}><RenderChildren nodes={getNodeList((node as any)?.children)} context={context} prefix={String(indexKey ?? 'blockquote') + '-blockquote'} /></blockquote>

package/dist/components/BlockquoteNode.svelte.d.ts

@@ -0,0 +1,24 @@
+import type { SvelteRenderableNode, SvelteRenderContext } from './shared/node-helpers';
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const BlockquoteNode: $$__sveltets_2_IsomorphicComponent<{
+    node: SvelteRenderableNode;
+    context?: SvelteRenderContext | undefined;
+    indexKey?: string | number | undefined;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type BlockquoteNode = InstanceType<typeof BlockquoteNode>;
+export default BlockquoteNode;
+//# sourceMappingURL=BlockquoteNode.svelte.d.ts.map

package/dist/components/BlockquoteNode.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BlockquoteNode.svelte.d.ts","sourceRoot":"","sources":["../../src/components/BlockquoteNode.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAA;AAiBtF,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,cAAc;UAV2D,oBAAoB;cAAY,mBAAmB,GAAG,SAAS;eAAa,MAAM,GAAG,MAAM,GAAG,SAAS;;;kBAUnF,CAAC;AAClF,KAAK,cAAc,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAC5D,eAAe,cAAc,CAAC"}

package/dist/components/CheckboxNode.svelte

@@ -0,0 +1,5 @@
+<script lang="ts">
+  import type { SvelteRenderableNode } from './shared/node-helpers'
+  export let node: SvelteRenderableNode
+</script>
+<input class="checkbox-node" type="checkbox" disabled checked={Boolean((node as any)?.checked)} />

package/dist/components/CheckboxNode.svelte.d.ts

@@ -0,0 +1,22 @@
+import type { SvelteRenderableNode } from './shared/node-helpers';
+interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
+    new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
+        $$bindings?: Bindings;
+    } & Exports;
+    (internal: unknown, props: Props & {
+        $$events?: Events;
+        $$slots?: Slots;
+    }): Exports & {
+        $set?: any;
+        $on?: any;
+    };
+    z_$$bindings?: Bindings;
+}
+declare const CheckboxNode: $$__sveltets_2_IsomorphicComponent<{
+    node: SvelteRenderableNode;
+}, {
+    [evt: string]: CustomEvent<any>;
+}, {}, {}, string>;
+type CheckboxNode = InstanceType<typeof CheckboxNode>;
+export default CheckboxNode;
+//# sourceMappingURL=CheckboxNode.svelte.d.ts.map

package/dist/components/CheckboxNode.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxNode.svelte.d.ts","sourceRoot":"","sources":["../../src/components/CheckboxNode.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAUlE,UAAU,kCAAkC,CAAC,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,MAAM,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,KAAK,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,GAAG,EAAE,OAAO,GAAG,EAAE,EAAE,QAAQ,GAAG,MAAM;IACpM,KAAK,OAAO,EAAE,OAAO,QAAQ,EAAE,2BAA2B,CAAC,KAAK,CAAC,GAAG,OAAO,QAAQ,EAAE,eAAe,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,GAAG;QAAE,UAAU,CAAC,EAAE,QAAQ,CAAA;KAAE,GAAG,OAAO,CAAC;IACjK,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,KAAK,GAAG;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,KAAK,CAAA;KAAC,GAAG,OAAO,GAAG;QAAE,IAAI,CAAC,EAAE,GAAG,CAAC;QAAC,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,CAAC;IAC9G,YAAY,CAAC,EAAE,QAAQ,CAAC;CAC3B;AAKD,QAAA,MAAM,YAAY;UAVqB,oBAAoB;;;kBAUsC,CAAC;AAChF,KAAK,YAAY,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC;AACxD,eAAe,YAAY,CAAC"}