faucet-pipeline / aiur

a simple styleguide generator

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

More generic plugin system

moonglum opened this issue · comments

Instead of just offering component previews, the plugin system could be a more generic "some text to some widget" system. This would allow things like:

```colors
#111222
#222111
```

to be converted to a color swatch, or:

```font
Helvetica Neue
11, 13, 17
```

to be converted to a font preview. It could also be used for things like mermaid

Great suggestion by @blynx: A plugin that renders Figma artifacts. This way, we can more easily compare the state in Figma with the state in HTML/CSS/JS. We can also create a component for which we only have a Figma version, and no HTML/CSS/JS yet.

I just had the idea to also inject parameters into the widgets.

```html(height: 100, noFullscreen)
<nav>
    <a href="yay.html">yay</a>
</nav>
```

which would directly be put into the rendered widget element

<component-preview height="100" noFullscreen></component-preview>

That way you could control for example the height of the rendered component preview window. Sometimes you just want to render a narrow button, sometimes you want to render a vertical navigation.
Also you could enable/disable features, etc. of that widget.

I really like that 👍 I would prefer the following way to write it though:

```html height="100" noFullscreen
<nav>
    <a href="yay.html">yay</a>
</nav>
```