52 lines
1.2 KiB
Plaintext
52 lines
1.2 KiB
Plaintext
|
import { SquigglePartial, SquiggleEditor } from "../components/SquiggleEditor";
|
||
|
import { useState } from "react";
|
||
|
import { Canvas, Meta, Story, Props } from "@storybook/addon-docs";
|
||
|
|
||
|
<Meta title="Squiggle/SquigglePartial" component={SquigglePartial} />
|
||
|
|
||
|
export const Template = (props) => <SquigglePartial {...props} />;
|
||
|
|
||
|
# Squiggle Partial
|
||
|
|
||
|
A Squiggle Partial is an editor that does not return a graph to the user, but
|
||
|
instead returns bindings that can be used by further Squiggle Editors.
|
||
|
|
||
|
<Canvas>
|
||
|
<Story
|
||
|
name="Standalone"
|
||
|
args={{
|
||
|
initialSquiggleString: "x = normal(5,2)",
|
||
|
}}
|
||
|
>
|
||
|
{Template.bind({})}
|
||
|
</Story>
|
||
|
</Canvas>
|
||
|
|
||
|
<Canvas>
|
||
|
<Story
|
||
|
name="With Editor"
|
||
|
args={{
|
||
|
initialPartialString: "x = normal(5,2)",
|
||
|
initialEditorString: "x",
|
||
|
}}
|
||
|
>
|
||
|
{(props) => {
|
||
|
let [bindings, setBindings] = useState({});
|
||
|
return (
|
||
|
<>
|
||
|
<SquigglePartial
|
||
|
{...props}
|
||
|
initialSquiggleString={props.initialPartialString}
|
||
|
onChange={setBindings}
|
||
|
/>
|
||
|
<SquiggleEditor
|
||
|
{...props}
|
||
|
initialSquiggleString={props.initialEditorString}
|
||
|
bindings={bindings}
|
||
|
/>
|
||
|
</>
|
||
|
);
|
||
|
}}
|
||
|
</Story>
|
||
|
</Canvas>
|