Initial commit

src/_product-updates/2025-01-30-mermaid-support.md

@@ -0,0 +1,39 @@
+---
+title: Mermaid support 
+tags: [New]
+image: /images/changelog/mermaid.png
+---
+
+![mermaid.png](/images/changelog/mermaid.png)
+
+Sometimes, the best way to explain something about your API is to do it visually. That's why we're announcing Mermaid support!
+
+Diagrams and charts are powerful tools, that can be used to share updates on your API development roadmap or give key information on data processing flow, for example.
+
+To generate one, add a code block declared as ```mermaid``` inside a ```description``` or ```content``` property:
+
+```yaml
+  get:
+    description: |
+      ```mermaid
+      erDiagram
+        CUSTOMER }|..|{ DELIVERY-ADDRESS : has
+        CUSTOMER ||--o{ ORDER : places
+        CUSTOMER ||--o{ INVOICE : "liable for"
+        DELIVERY-ADDRESS ||--o{ ORDER : receives
+        INVOICE ||--|{ ORDER : covers
+        ORDER ||--|{ ORDER-ITEM : includes
+        PRODUCT-CATEGORY ||--|{ PRODUCT : contains
+        PRODUCT ||--o{ ORDER-ITEM : "ordered in"
+      ```
+```
+This example would render the following diagram [(see it live)](https://bump.sh/demo/doc/mermaid-demo/operation/operation-get-booking-parameter):
+
+![Mermaid example](/images/changelog/mermaid-diagram.png)
+
+Discover the full list of diagrams and charts supported by Mermaid [here](https://mermaid.js.org/syntax/flowchart.html).
+
+[Learn more about our Mermaid integration in our help center →](https://docs.bump.sh/help/publish-documentation/feedback/)
+
+As always, don't hesitate to reach out if you have feedback about this feature!
+