From 405c1bf8f3bec01aa136b05f6d2be9123f88a80e Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Wed, 27 Jul 2022 17:31:40 -0400 Subject: [PATCH 01/12] imported bindings --- .../SquiggleEditorImportedBindings.tsx | 50 +++++++++++++++++++ packages/components/src/index.ts | 1 + .../website/docs/Internal/ImportIntoMdx.mdx | 37 ++++++++++++++ packages/website/package.json | 2 +- .../website/static/squiggle/demo.squiggle | 4 ++ 5 files changed, 93 insertions(+), 1 deletion(-) create mode 100644 packages/components/src/components/SquiggleEditorImportedBindings.tsx create mode 100644 packages/website/docs/Internal/ImportIntoMdx.mdx create mode 100644 packages/website/static/squiggle/demo.squiggle diff --git a/packages/components/src/components/SquiggleEditorImportedBindings.tsx b/packages/components/src/components/SquiggleEditorImportedBindings.tsx new file mode 100644 index 00000000..db8fd07d --- /dev/null +++ b/packages/components/src/components/SquiggleEditorImportedBindings.tsx @@ -0,0 +1,50 @@ +import React from "react"; +import { SquiggleEditor } from "./SquiggleEditor"; +import type { SquiggleEditorProps } from "./SquiggleEditor"; +import { runPartial, defaultBindings } from "@quri/squiggle-lang"; +import type { result, errorValue, bindings } from "@quri/squiggle-lang"; + +function resultDefault( + x: result, + defaul: bindings +): bindings { + switch (x.tag) { + case "Ok": + return x.value; + case "Error": + return defaul; + } +} + +function replaceBindings( + props: SquiggleEditorProps, + newBindings: bindings +): SquiggleEditorProps { + return { ...props, bindings: newBindings }; +} + +export type SquiggleEditorImportedBindingsProps = SquiggleEditorProps & { + bindingsImportFile: string; +}; + +export const SquiggleEditorImportedBindings: React.FC< + SquiggleEditorImportedBindingsProps +> = (props) => { + const [bindingsResult, setBindingsResult] = React.useState({ + tag: "Ok" as "Ok", + value: defaultBindings, + } as result); + React.useEffect(() => { + async function retrieveBindings(fileName: string) { + //: Promise> { + let contents = await fetch(fileName).then((response) => { + return response.text(); + }); + setBindingsResult(runPartial(contents)); + } + retrieveBindings(props.bindingsImportFile); + }, []); + const deliveredBindings = resultDefault(bindingsResult, {}); + const newProps = replaceBindings(props, deliveredBindings); + return ; +}; diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts index ce6e107c..a1822c34 100644 --- a/packages/components/src/index.ts +++ b/packages/components/src/index.ts @@ -2,5 +2,6 @@ export { SquiggleChart } from "./components/SquiggleChart"; export { SquiggleEditor, SquigglePartial } from "./components/SquiggleEditor"; export { SquigglePlayground } from "./components/SquigglePlayground"; export { SquiggleContainer } from "./components/SquiggleContainer"; +export { SquiggleEditorImportedBindings } from "./components/SquiggleEditorImportedBindings"; export { mergeBindings } from "@quri/squiggle-lang"; diff --git a/packages/website/docs/Internal/ImportIntoMdx.mdx b/packages/website/docs/Internal/ImportIntoMdx.mdx new file mode 100644 index 00000000..218206da --- /dev/null +++ b/packages/website/docs/Internal/ImportIntoMdx.mdx @@ -0,0 +1,37 @@ +--- +title: How to import squiggle files into `.mdx` documents +sidebar_position: 5 +--- + +import { SquiggleEditorImportedBindings } from "../../src/components/SquiggleEditor"; + +_Proof of concept_ + +## Consider the following squiggle file + +In our docusaurus repo, we have a static asset called `demo.squiggle`. It looks like this + +```js +x = 1 to 2 +y = {a: x, b: 1e1} +f(t) = normal(t, 1.1) +z = y.b * y.a +``` + +We can call `f(z)` upon the assignments in `demo.squiggle` like so: + +```jsx +import { SquiggleEditorImportedBindings } from "../../src/components/SquiggleEditor"; + +; +``` + +Which would then look exactly like + + diff --git a/packages/website/package.json b/packages/website/package.json index 986b44c1..11e83791 100644 --- a/packages/website/package.json +++ b/packages/website/package.json @@ -15,7 +15,7 @@ "@docusaurus/core": "2.0.0-rc.1", "@docusaurus/preset-classic": "2.0.0-rc.1", "@heroicons/react": "^1.0.6", - "@quri/squiggle-components": "^0.2.20", + "@quri/squiggle-components": "^0.2.23", "base64-js": "^1.5.1", "clsx": "^1.2.1", "hast-util-is-element": "2.1.2", diff --git a/packages/website/static/squiggle/demo.squiggle b/packages/website/static/squiggle/demo.squiggle new file mode 100644 index 00000000..94ab4ac7 --- /dev/null +++ b/packages/website/static/squiggle/demo.squiggle @@ -0,0 +1,4 @@ +x = 1 to 2 +y = {a: x, b: 1e1} +f(t) = normal(t, 1.1) +z = y.b * y.a From a46f50dd0fd8894fe7dd6d2e1c750de3817cdab0 Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Wed, 27 Jul 2022 17:40:21 -0400 Subject: [PATCH 02/12] removed comment, cleaned up a function --- .../src/components/SquiggleEditorImportedBindings.tsx | 8 +++----- 1 file changed, 3 insertions(+), 5 deletions(-) diff --git a/packages/components/src/components/SquiggleEditorImportedBindings.tsx b/packages/components/src/components/SquiggleEditorImportedBindings.tsx index db8fd07d..f812a910 100644 --- a/packages/components/src/components/SquiggleEditorImportedBindings.tsx +++ b/packages/components/src/components/SquiggleEditorImportedBindings.tsx @@ -6,13 +6,12 @@ import type { result, errorValue, bindings } from "@quri/squiggle-lang"; function resultDefault( x: result, - defaul: bindings ): bindings { switch (x.tag) { case "Ok": return x.value; case "Error": - return defaul; + return defaultBindings; } } @@ -31,12 +30,11 @@ export const SquiggleEditorImportedBindings: React.FC< SquiggleEditorImportedBindingsProps > = (props) => { const [bindingsResult, setBindingsResult] = React.useState({ - tag: "Ok" as "Ok", + tag: "Ok", value: defaultBindings, } as result); React.useEffect(() => { async function retrieveBindings(fileName: string) { - //: Promise> { let contents = await fetch(fileName).then((response) => { return response.text(); }); @@ -44,7 +42,7 @@ export const SquiggleEditorImportedBindings: React.FC< } retrieveBindings(props.bindingsImportFile); }, []); - const deliveredBindings = resultDefault(bindingsResult, {}); + const deliveredBindings = resultDefault(bindingsResult); const newProps = replaceBindings(props, deliveredBindings); return ; }; From 2279624750628de059f853dcd6c5c4330f6af25f Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Wed, 27 Jul 2022 17:42:46 -0400 Subject: [PATCH 03/12] checking in editor.jsx file --- packages/website/src/components/SquiggleEditor.jsx | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/packages/website/src/components/SquiggleEditor.jsx b/packages/website/src/components/SquiggleEditor.jsx index d8404b82..fd054d3b 100644 --- a/packages/website/src/components/SquiggleEditor.jsx +++ b/packages/website/src/components/SquiggleEditor.jsx @@ -12,3 +12,15 @@ export function SquiggleEditor(props) { ); } + +export function SquiggleEditorImportedBindings(props) { + return ( + }> + {() => { + const LibComponent = + require("@quri/squiggle-components").SquiggleEditorImportedBindings; + return ; + }} + + ); +} From 5f3dd1254266c8e101597a0436d1b027a6304d63 Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Wed, 27 Jul 2022 17:44:09 -0400 Subject: [PATCH 04/12] fix lint --- .../src/components/SquiggleEditorImportedBindings.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/packages/components/src/components/SquiggleEditorImportedBindings.tsx b/packages/components/src/components/SquiggleEditorImportedBindings.tsx index f812a910..d2debd9a 100644 --- a/packages/components/src/components/SquiggleEditorImportedBindings.tsx +++ b/packages/components/src/components/SquiggleEditorImportedBindings.tsx @@ -4,9 +4,7 @@ import type { SquiggleEditorProps } from "./SquiggleEditor"; import { runPartial, defaultBindings } from "@quri/squiggle-lang"; import type { result, errorValue, bindings } from "@quri/squiggle-lang"; -function resultDefault( - x: result, -): bindings { +function resultDefault(x: result): bindings { switch (x.tag) { case "Ok": return x.value; From ff05685634ce60dacb188fd283ab83697b233b19 Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Thu, 28 Jul 2022 10:33:31 -0400 Subject: [PATCH 05/12] @berekuk's CR --- ...=> SquiggleEditorWithImportedBindings.tsx} | 35 +++++++++---------- .../website/docs/Internal/ImportIntoMdx.mdx | 10 +++--- .../website/src/components/SquiggleEditor.jsx | 4 +-- .../{squiggle => estimates}/demo.squiggle | 0 4 files changed, 24 insertions(+), 25 deletions(-) rename packages/components/src/components/{SquiggleEditorImportedBindings.tsx => SquiggleEditorWithImportedBindings.tsx} (51%) rename packages/website/static/{squiggle => estimates}/demo.squiggle (100%) diff --git a/packages/components/src/components/SquiggleEditorImportedBindings.tsx b/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx similarity index 51% rename from packages/components/src/components/SquiggleEditorImportedBindings.tsx rename to packages/components/src/components/SquiggleEditorWithImportedBindings.tsx index d2debd9a..5b95a698 100644 --- a/packages/components/src/components/SquiggleEditorImportedBindings.tsx +++ b/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx @@ -2,9 +2,13 @@ import React from "react"; import { SquiggleEditor } from "./SquiggleEditor"; import type { SquiggleEditorProps } from "./SquiggleEditor"; import { runPartial, defaultBindings } from "@quri/squiggle-lang"; -import type { result, errorValue, bindings } from "@quri/squiggle-lang"; +import type { + result, + errorValue, + bindings as bindingsType, +} from "@quri/squiggle-lang"; -function resultDefault(x: result): bindings { +function resultDefault(x: result): bindings { switch (x.tag) { case "Ok": return x.value; @@ -13,24 +17,18 @@ function resultDefault(x: result): bindings { } } -function replaceBindings( - props: SquiggleEditorProps, - newBindings: bindings -): SquiggleEditorProps { - return { ...props, bindings: newBindings }; -} - -export type SquiggleEditorImportedBindingsProps = SquiggleEditorProps & { - bindingsImportFile: string; +export type SquiggleEditorWithImportedBindingsProps = SquiggleEditorProps & { + bindingsImportUrl: string; }; -export const SquiggleEditorImportedBindings: React.FC< - SquiggleEditorImportedBindingsProps +export const SquiggleEditorWithImportedBindings: React.FC< + SquiggleEditorWithImportedBindingsProps > = (props) => { + const { bindingsImportUrl, ...editorProps } = props; const [bindingsResult, setBindingsResult] = React.useState({ tag: "Ok", value: defaultBindings, - } as result); + } as result); React.useEffect(() => { async function retrieveBindings(fileName: string) { let contents = await fetch(fileName).then((response) => { @@ -38,9 +36,10 @@ export const SquiggleEditorImportedBindings: React.FC< }); setBindingsResult(runPartial(contents)); } - retrieveBindings(props.bindingsImportFile); - }, []); + retrieveBindings(bindingsImportUrl); + }, [bindingsImportUrl]); const deliveredBindings = resultDefault(bindingsResult); - const newProps = replaceBindings(props, deliveredBindings); - return ; + return ( + + ); }; diff --git a/packages/website/docs/Internal/ImportIntoMdx.mdx b/packages/website/docs/Internal/ImportIntoMdx.mdx index 218206da..d590c120 100644 --- a/packages/website/docs/Internal/ImportIntoMdx.mdx +++ b/packages/website/docs/Internal/ImportIntoMdx.mdx @@ -3,7 +3,7 @@ title: How to import squiggle files into `.mdx` documents sidebar_position: 5 --- -import { SquiggleEditorImportedBindings } from "../../src/components/SquiggleEditor"; +import { SquiggleEditorWithImportedBindings } from "../../src/components/SquiggleEditor"; _Proof of concept_ @@ -21,17 +21,17 @@ z = y.b * y.a We can call `f(z)` upon the assignments in `demo.squiggle` like so: ```jsx -import { SquiggleEditorImportedBindings } from "../../src/components/SquiggleEditor"; +import { SquiggleEditorWithImportedBindings } from "../../src/components/SquiggleEditor"; ; ``` Which would then look exactly like - diff --git a/packages/website/src/components/SquiggleEditor.jsx b/packages/website/src/components/SquiggleEditor.jsx index fd054d3b..353fa0b2 100644 --- a/packages/website/src/components/SquiggleEditor.jsx +++ b/packages/website/src/components/SquiggleEditor.jsx @@ -13,12 +13,12 @@ export function SquiggleEditor(props) { ); } -export function SquiggleEditorImportedBindings(props) { +export function SquiggleEditorWithImportedBindings(props) { return ( }> {() => { const LibComponent = - require("@quri/squiggle-components").SquiggleEditorImportedBindings; + require("@quri/squiggle-components").SquiggleEditorWithImportedBindings; return ; }} diff --git a/packages/website/static/squiggle/demo.squiggle b/packages/website/static/estimates/demo.squiggle similarity index 100% rename from packages/website/static/squiggle/demo.squiggle rename to packages/website/static/estimates/demo.squiggle From a536f1f4e142ae0de25a34290129d91b53652270 Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Thu, 28 Jul 2022 10:37:00 -0400 Subject: [PATCH 06/12] trailing slash? --- packages/website/docs/Internal/ImportIntoMdx.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/website/docs/Internal/ImportIntoMdx.mdx b/packages/website/docs/Internal/ImportIntoMdx.mdx index d590c120..4a3a761b 100644 --- a/packages/website/docs/Internal/ImportIntoMdx.mdx +++ b/packages/website/docs/Internal/ImportIntoMdx.mdx @@ -25,7 +25,7 @@ import { SquiggleEditorWithImportedBindings } from "../../src/components/Squiggl ; ``` @@ -33,5 +33,5 @@ Which would then look exactly like From 7fc646f5b5b316d853bd840a473ac4717408ff53 Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Thu, 28 Jul 2022 10:43:27 -0400 Subject: [PATCH 07/12] fix build --- .../src/components/SquiggleEditorWithImportedBindings.tsx | 2 +- packages/components/src/index.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx b/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx index 5b95a698..b04706a3 100644 --- a/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx +++ b/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx @@ -8,7 +8,7 @@ import type { bindings as bindingsType, } from "@quri/squiggle-lang"; -function resultDefault(x: result): bindings { +function resultDefault(x: result): bindingsType { switch (x.tag) { case "Ok": return x.value; diff --git a/packages/components/src/index.ts b/packages/components/src/index.ts index a1822c34..f51ab57a 100644 --- a/packages/components/src/index.ts +++ b/packages/components/src/index.ts @@ -2,6 +2,6 @@ export { SquiggleChart } from "./components/SquiggleChart"; export { SquiggleEditor, SquigglePartial } from "./components/SquiggleEditor"; export { SquigglePlayground } from "./components/SquigglePlayground"; export { SquiggleContainer } from "./components/SquiggleContainer"; -export { SquiggleEditorImportedBindings } from "./components/SquiggleEditorImportedBindings"; +export { SquiggleEditorWithImportedBindings } from "./components/SquiggleEditorWithImportedBindings"; export { mergeBindings } from "@quri/squiggle-lang"; From 33e5ebd6da42a3a5b7bd04384bd26df9af3e5204 Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Thu, 28 Jul 2022 10:43:59 -0400 Subject: [PATCH 08/12] `yarn format` compels me --- .../src/rescript/ReducerInterface/ReducerInterface_StdLib.res | 3 ++- packages/vscode-ext/README.md | 4 ++-- 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/squiggle-lang/src/rescript/ReducerInterface/ReducerInterface_StdLib.res b/packages/squiggle-lang/src/rescript/ReducerInterface/ReducerInterface_StdLib.res index 6c133332..ec6c4fd4 100644 --- a/packages/squiggle-lang/src/rescript/ReducerInterface/ReducerInterface_StdLib.res +++ b/packages/squiggle-lang/src/rescript/ReducerInterface/ReducerInterface_StdLib.res @@ -1,6 +1,7 @@ module Bindings = Reducer_Bindings -let internalStdLib = Bindings.emptyBindings->SquiggleLibrary_Math.makeBindings->SquiggleLibrary_Versions.makeBindings +let internalStdLib = + Bindings.emptyBindings->SquiggleLibrary_Math.makeBindings->SquiggleLibrary_Versions.makeBindings @genType let externalStdLib = internalStdLib->Bindings.toTypeScriptBindings diff --git a/packages/vscode-ext/README.md b/packages/vscode-ext/README.md index 1c529ddd..cb161038 100644 --- a/packages/vscode-ext/README.md +++ b/packages/vscode-ext/README.md @@ -9,7 +9,7 @@ Features: - Preview `.squiggle` files in a preview pane - Syntax highlighting for `.squiggle` and `.squiggleU` files -## Installation +## Installation You can install this extension by going to the "extensions" tab, searching for "Squiggle", and then installing it. @@ -23,7 +23,7 @@ After loading a `.squiggle` file, an "Open Preview" button will appear. If you c ### Configuration (optional) -Some preview settings, e.g. whether to show the summary table or types of outputs, can be configurable on in the VS Code settings and persist between different preview sessions. The VS Code settings can be accessed with the shortcut `Ctrl+,` with `Ctrl+Shift+P` + searching "Open Settings", or by accessing a file like `$HOME/.config/Code/User/settings.json` in Linux (see [here](https://stackoverflow.com/questions/65908987/how-can-i-open-visual-studio-codes-settings-json-file)) for other operating systems. +Some preview settings, e.g. whether to show the summary table or types of outputs, can be configurable on in the VS Code settings and persist between different preview sessions. The VS Code settings can be accessed with the shortcut `Ctrl+,` with `Ctrl+Shift+P` + searching "Open Settings", or by accessing a file like `$HOME/.config/Code/User/settings.json` in Linux (see [here](https://stackoverflow.com/questions/65908987/how-can-i-open-visual-studio-codes-settings-json-file)) for other operating systems. ![](./images/vs-code-settings.png) From c77795c83288ec76987444b26d89e0cdf0d0afa6 Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Thu, 28 Jul 2022 10:57:58 -0400 Subject: [PATCH 09/12] absolute path for `bindingsImportsFile` --- packages/website/docs/Internal/ImportIntoMdx.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/website/docs/Internal/ImportIntoMdx.mdx b/packages/website/docs/Internal/ImportIntoMdx.mdx index 4a3a761b..60ec93fd 100644 --- a/packages/website/docs/Internal/ImportIntoMdx.mdx +++ b/packages/website/docs/Internal/ImportIntoMdx.mdx @@ -25,7 +25,7 @@ import { SquiggleEditorWithImportedBindings } from "../../src/components/Squiggl ; ``` @@ -33,5 +33,5 @@ Which would then look exactly like From 779fcf4fc65bc8a6cdb68b3746033c9dc178760c Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Thu, 28 Jul 2022 11:07:32 -0400 Subject: [PATCH 10/12] inherit props to `runPartial` --- .../components/SquiggleEditorWithImportedBindings.tsx | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx b/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx index b04706a3..5dcc3241 100644 --- a/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx +++ b/packages/components/src/components/SquiggleEditorWithImportedBindings.tsx @@ -34,7 +34,14 @@ export const SquiggleEditorWithImportedBindings: React.FC< let contents = await fetch(fileName).then((response) => { return response.text(); }); - setBindingsResult(runPartial(contents)); + setBindingsResult( + runPartial( + contents, + editorProps.bindings, + editorProps.environment, + editorProps.jsImports + ) + ); } retrieveBindings(bindingsImportUrl); }, [bindingsImportUrl]); From 91246ffad3af1c4b4f7d5de811445dc754b2cca8 Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Thu, 28 Jul 2022 11:17:14 -0400 Subject: [PATCH 11/12] changed import from local docusaurus component to `@quri/squiggle-components` component --- packages/website/docs/Internal/ImportIntoMdx.mdx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/packages/website/docs/Internal/ImportIntoMdx.mdx b/packages/website/docs/Internal/ImportIntoMdx.mdx index 60ec93fd..d9de9b09 100644 --- a/packages/website/docs/Internal/ImportIntoMdx.mdx +++ b/packages/website/docs/Internal/ImportIntoMdx.mdx @@ -3,7 +3,7 @@ title: How to import squiggle files into `.mdx` documents sidebar_position: 5 --- -import { SquiggleEditorWithImportedBindings } from "../../src/components/SquiggleEditor"; +import { SquiggleEditorWithImportedBindings } from "@quri/squiggle-components"; _Proof of concept_ @@ -21,11 +21,11 @@ z = y.b * y.a We can call `f(z)` upon the assignments in `demo.squiggle` like so: ```jsx -import { SquiggleEditorWithImportedBindings } from "../../src/components/SquiggleEditor"; +import { SquiggleEditorWithImportedBindings } from "@quri/squiggle-components"; -; ``` From 3f6e1b2caf4da3455307689827ce78bfa195b707 Mon Sep 17 00:00:00 2001 From: Quinn Dougherty Date: Thu, 28 Jul 2022 11:26:22 -0400 Subject: [PATCH 12/12] revert last commit --- packages/website/docs/Internal/ImportIntoMdx.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/website/docs/Internal/ImportIntoMdx.mdx b/packages/website/docs/Internal/ImportIntoMdx.mdx index d9de9b09..683f9311 100644 --- a/packages/website/docs/Internal/ImportIntoMdx.mdx +++ b/packages/website/docs/Internal/ImportIntoMdx.mdx @@ -3,7 +3,7 @@ title: How to import squiggle files into `.mdx` documents sidebar_position: 5 --- -import { SquiggleEditorWithImportedBindings } from "@quri/squiggle-components"; +import { SquiggleEditorWithImportedBindings } from "../../src/components/SquiggleEditor"; _Proof of concept_ @@ -21,7 +21,7 @@ z = y.b * y.a We can call `f(z)` upon the assignments in `demo.squiggle` like so: ```jsx -import { SquiggleEditorWithImportedBindings } from "@quri/squiggle-components"; +import { SquiggleEditorWithImportedBindings } from "../../src/components/SquiggleEditor";