squiggle/packages/components/src/stories/SquiggleEditor.stories.mdx

import { SquiggleEditor } from "../components/SquiggleEditor";
import { Canvas, Meta, Story, Props } from "@storybook/addon-docs";

<Meta title="Squiggle/SquiggleEditor" component={SquiggleEditor} />

export const Template = (props) => <SquiggleEditor {...props} />;

# Squiggle Editor

Squiggle Editor is a Squiggle chart with a text editor included for changing
the distribution.

<Canvas>
  <Story
    name="Normal"
    args={{
      squiggleString: "normal(5,2)",
    }}
  >
    {Template.bind({})}
  </Story>
</Canvas>

You can also name variables like so:

<Canvas>
  <Story
    name="Variables"
    args={{
      squiggleString: "x = 2\nnormal(x,2)",
    }}
  >
    {Template.bind({})}
  </Story>
</Canvas>