baerrach / gatsby-remark-plantuml

Gatsby Remark parser for PlantUML code blocks
Other
3 stars 4 forks source link

feat(attributes): add support for custom svg attributes #15

Closed andrewthauer closed 4 years ago

andrewthauer commented 4 years ago

Why

Larger generated svg elements do not behave responsive. The current maxWidth option doesn't really solve this.

NOTE: This may address #4 and possibly make #6 obsolete

This also fixes a react error with xmlnslink. I believe this was being causes by htmlparser2 (unconfirmed).

What

This introduces support for custom attribute strings that can be used either globally through pluginOptions or inline on each code fence. It also changes the default style attributes to be responsive by default.

This is modeled off gatsby-remark-graphviz:

Breaking Changes

The default style changes could have a breaking change for some users. I struggled deciding between making this style the default or forcing the developer to set it. Since I believe most use cases would benefit from these changes I decided to make them the default. This means a major version bump would make sense. It also brings into question if maxWidth makes sense any more as it can be easily simulated through the custom attributes.

Details of changes

Usage

Inline:

```plantuml
@startuml style="max-width: 50vw; height: auto;"
Alice -> Bob: Authentication Request
Bob --> Alice: Authentication Response

Alice -> Bob: Another authentication Request
Alice <-- Bob: Another authentication Response
@enduml

Or Globally:

```javascript
{
  resolve: 'gatsby-remark-plantuml',
  options: {
     attributes: 'style="max-width: 50vw; height: auto"',
  }
}
baerrach commented 4 years ago

Fixes #4