slidev icon indicating copy to clipboard operation
slidev copied to clipboard

feat: Implemented transformer for the wavedrom library

Open alexandruradovici opened this issue 10 months ago • 9 comments

Description

This pull request implements a transformer for the wavedrom library. It allows writing waveform diagrams in the slides.

This allows writing wavefrom diagrams using the wavedrom transformer.

```wavedrom
{signal: [
  {name: 'clk', wave: 'p.....|...'},
  {name: 'dat', wave: 'x.345x|=.x', data: ['head', 'body', 'tail', 'data']},
  {name: 'req', wave: '0.1..0|1.0'},
  {},
  {name: 'ack', wave: '1.....|01.'}
]}
```

Why

This is useful when creating engineering slides. Without this feature, users have to manually transform the waveform JSON into SVG files and include those.

Disadvantages

  • wavedrom, onml and json5 dev dependencies
  • onml depends on two deprecated packages

alexandruradovici avatar Apr 06 '24 23:04 alexandruradovici

Deploy Preview for slidev ready!

Name Link
Latest commit 73fe417aa6747bf4b19788419009d56905a2d8b3
Latest deploy log https://app.netlify.com/sites/slidev/deploys/6611e23e9de9f0000892a6d2
Deploy Preview https://deploy-preview-1503--slidev.netlify.app
Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

netlify[bot] avatar Apr 06 '24 23:04 netlify[bot]

Thanks for your contribution! Can this feature be used as a standalone addon package? If not, what's the missing hook?

kermanx avatar Apr 08 '24 01:04 kermanx

I think it can be an addon, I just don't know where to find the documentation on how to use a hook. I would be very happy to convert it.

alexandruradovici avatar Apr 08 '24 02:04 alexandruradovici

About addon writing: https://sli.dev/addons/write-an-addon

You can have setup and components folder in your addon, just like in your slides folder.

kermanx avatar Apr 08 '24 02:04 kermanx

I saw this, but is there any API documentation?

alexandruradovici avatar Apr 08 '24 02:04 alexandruradovici

Here we can register a markdown-it plugin for waredrom: https://sli.dev/custom/config-vite#configure-internal-plugins

kermanx avatar Apr 08 '24 02:04 kermanx

I am sorry, I still do not understand how to connect my plugin to slidev.

  1. I created a new package
  2. I added slidev as a dependecy

How to I make it initialize my plugin?

This is really confusing here, an API documentation and example would be great.

alexandruradovici avatar Apr 08 '24 11:04 alexandruradovici

This looks very cool! But yeah I agree with @KermanX, I also think it's better to implement it as an external addon.

antfu avatar Apr 08 '24 12:04 antfu

I am sorry, I still do not understand how to connect my plugin to slidev.

  1. I created a new package
  2. I added slidev as a dependecy

How to I make it initialize my plugin?

This is really confusing here, an API documentation and example would be great.

There seem to be some difficulties in having a custom transformer... The priority of markdown-it plugins are too low. The preparser may help, but I don't think it is graceful enough. Maybe we need a setupTransformers like this:

type MarkdownTransfromer = (ctx: MarkdownTransformContext) => void
type TransformersSetup = (transformers: MarkdownTransfromer[]) => MarkdownTransfromer[]

kermanx avatar Apr 09 '24 03:04 kermanx

Sorry for the late reply. These days several refactors are done and I've tested that after #1767 got merged, this PR can be implemented as an add-on in a simple way.

kermanx avatar Jul 20 '24 09:07 kermanx