diff --git a/assets/packs/mermaid/main.js b/assets/packs/mermaid/main.js
index 418c8a9e..b71a8991 100644
--- a/assets/packs/mermaid/main.js
+++ b/assets/packs/mermaid/main.js
@@ -3,11 +3,11 @@ import "./main.css";
 
 mermaid.initialize({ startOnLoad: false });
 
-export function init(ctx, {graph, caption, download}) {
+export function init(ctx, {diagram, caption, download}) {
   ctx.importCSS("main.css")
   
   function render() {
-    mermaid.render("graph1", graph).then(({ svg, bindFunctions }) => {
+    mermaid.render("diagram", diagram).then(({ svg, bindFunctions }) => {
       let contents = document.createElement("div");
       contents.id = "contents";
       ctx.root.appendChild(contents);
diff --git a/lib/kino/shorts.ex b/lib/kino/shorts.ex
index 95d1dad8..a6a017e5 100644
--- a/lib/kino/shorts.ex
+++ b/lib/kino/shorts.ex
@@ -162,7 +162,7 @@ defmodule Kino.Shorts do
   def text(text), do: Kino.Text.new(text)
 
   @doc ~S'''
-  Renders Mermaid graphs.
+  Renders Mermaid diagrams.
 
   It is a wrapper around `Kino.Mermaid.new/1`.
 
@@ -178,8 +178,8 @@ defmodule Kino.Shorts do
         C-->D;
       """)
   '''
-  @spec mermaid(String.t()) :: Kino.Mermaid.t()
-  def mermaid(mermaid), do: Kino.Mermaid.new(mermaid)
+  @spec mermaid(String.t(), Keyword.t()) :: Kino.Mermaid.t()
+  def mermaid(diagram, options \\ []), do: Kino.Mermaid.new(diagram, options)
 
   @doc """
   A placeholder for static outputs that can be dynamically updated.
diff --git a/test/kino/process_test.exs b/test/kino/process_test.exs
index ca81eb85..0fdd48b9 100644
--- a/test/kino/process_test.exs
+++ b/test/kino/process_test.exs
@@ -227,7 +227,7 @@ defmodule Kino.ProcessTest do
     send(Kino.JS.DataStore, {:connect, self(), %{origin: "client:#{inspect(self())}", ref: ref}})
     assert_receive {:connect_reply, data, %{ref: ^ref}}
 
-    data
+    data.diagram
   end
 
   defp supervision_tree_with_ets_table do