SveltePress / sveltepress

A content centered site build tool, build on top of Sveltekit.
https://sveltepress.site
MIT License
370 stars 20 forks source link

Allow linking to REPLs from code examples #261

Closed gka closed 6 months ago

gka commented 8 months ago

Describe the problem

It would be nice if I could provide an URL with my code snippets so readers of the docs could play around with a StackBlitz or REPL example right away. As of now there just is a button to copy the code, but it would be nice if I could turn them into a "Fork" button instead.

Describe the proposed solution

Maybe SveltePress could allow a syntax like this

```svelte url=https://svelte.dev/repl/hello-world?version=4.2.12
Hello world
```

And then display a "fork" or "REPL" button instead of the button to copy the code.

Alternatives considered

The alternative is to place these links in the markdown text below a code snippet, which looks a bit sad.

Importance

would make my life easier

Blackman99 commented 8 months ago

Thanks for your feedback! You can implement this feature by writing your own remark plugin

gka commented 8 months ago

I see. I tried to but I didn't manage to do it. I tried using the existing remark-code-extra plugin, but I think using it breaks the SveltePress code parsing. That's also why I thought it would have to be part of SveltePress, as it's already using the svelte "tag" in fenced code blocks.

Will close anyway since it seems out of scope for SveltePress.

Blackman99 commented 8 months ago

You need the copy button to show custom label text and to apply different beviour. Is that correct?