Add projects to components

This commit is contained in:
Sam Nolan 2022-09-19 13:58:20 +10:00
parent 2aaf6816f6
commit 07731adc6f
3 changed files with 31 additions and 8 deletions

View File

@ -5,6 +5,7 @@ import {
defaultEnvironment,
resultMap,
SqValueTag,
SqProject,
} from "@quri/squiggle-lang";
import { useSquiggle } from "../lib/hooks";
import { SquiggleViewer } from "./SquiggleViewer";
@ -53,6 +54,12 @@ export interface SquiggleChartProps {
/** Whether to show vega actions to the user, so they can copy the chart spec */
distributionChartActions?: boolean;
enableLocalSettings?: boolean;
/** The project that this execution is part of */
project?: SqProject;
/** The name of the squiggle execution source. Defaults to "main" */
sourceName?: string;
/** The sources that this execution continues */
includes?: string[];
}
const defaultOnChange = () => {};
@ -60,7 +67,7 @@ const defaultImports: JsImports = {};
export const SquiggleChart: React.FC<SquiggleChartProps> = React.memo(
({
code = "",
code,
executionId = 0,
environment,
onChange = defaultOnChange, // defaultOnChange must be constant, don't move its definition here
@ -81,8 +88,14 @@ export const SquiggleChart: React.FC<SquiggleChartProps> = React.memo(
xAxisType = "number",
distributionChartActions,
enableLocalSettings = false,
sourceName = "main",
includes = [],
project = SqProject.create(),
}) => {
const { result, bindings } = useSquiggle({
sourceName,
includes,
project,
code,
environment,
jsImports,

View File

@ -2,3 +2,4 @@ export { SquiggleChart } from "./components/SquiggleChart";
export { SquiggleEditor } from "./components/SquiggleEditor";
export { SquigglePlayground } from "./components/SquigglePlayground";
export { SquiggleContainer } from "./components/SquiggleContainer";
export * as squiggle from "@quri/squiggle-lang"

View File

@ -3,29 +3,38 @@ import { useEffect, useMemo } from "react";
import { JsImports, jsImportsToSquiggleCode } from "../jsImports";
type SquiggleArgs = {
code: string;
code?: string;
executionId?: number;
jsImports?: JsImports;
environment?: environment;
project: SqProject;
sourceName: string;
includes: string[];
onChange?: (expr: SqValue | undefined) => void;
};
export const useSquiggle = (args: SquiggleArgs) => {
const result = useMemo(
() => {
const project = SqProject.create();
project.setSource("main", args.code);
const project = args.project;
let code = project.getSource(args.sourceName)
if(args.code) {
code = args.code
}
project.setSource(args.sourceName, code ?? "");
let includes = args.includes;
if (args.environment) {
project.setEnvironment(args.environment);
}
if (args.jsImports && Object.keys(args.jsImports).length) {
const importsSource = jsImportsToSquiggleCode(args.jsImports);
project.setSource("imports", importsSource);
project.setContinues("main", ["imports"]);
includes.push("imports")
}
project.run("main");
const result = project.getResult("main");
const bindings = project.getBindings("main");
project.setContinues(args.sourceName, includes);
project.run(args.sourceName);
const result = project.getResult(args.sourceName);
const bindings = project.getBindings(args.sourceName);
return { result, bindings };
},
// eslint-disable-next-line react-hooks/exhaustive-deps