From 24f4143cda712cdb22d5bf074dd0e112df7050ec Mon Sep 17 00:00:00 2001 From: Vyacheslav Matyukhin Date: Mon, 20 Jun 2022 17:38:45 +0300 Subject: [PATCH 1/9] preview mode for vscode ext --- packages/components/package.json | 1 + packages/vscode-ext/media/previewWebview.js | 43 +++++++++++ .../media/{wysiwyg.js => wysiwygWebview.js} | 0 packages/vscode-ext/package.json | 49 ++++++++++++- .../src/{squiggleEditor.ts => editor.ts} | 71 ++----------------- packages/vscode-ext/src/extension.ts | 5 +- packages/vscode-ext/src/preview.ts | 51 +++++++++++++ packages/vscode-ext/src/utils.ts | 59 +++++++++++++++ yarn.lock | 13 ++-- 9 files changed, 220 insertions(+), 72 deletions(-) create mode 100644 packages/vscode-ext/media/previewWebview.js rename packages/vscode-ext/media/{wysiwyg.js => wysiwygWebview.js} (100%) rename packages/vscode-ext/src/{squiggleEditor.ts => editor.ts} (55%) create mode 100644 packages/vscode-ext/src/preview.ts create mode 100644 packages/vscode-ext/src/utils.ts diff --git a/packages/components/package.json b/packages/components/package.json index 3983954a..7c64463c 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -18,6 +18,7 @@ "vega": "^5.22.1", "vega-embed": "^6.21.0", "vega-lite": "^5.2.0", + "vscode-uri": "^3.0.3", "yup": "^0.32.11" }, "devDependencies": { diff --git a/packages/vscode-ext/media/previewWebview.js b/packages/vscode-ext/media/previewWebview.js new file mode 100644 index 00000000..6d91b1b9 --- /dev/null +++ b/packages/vscode-ext/media/previewWebview.js @@ -0,0 +1,43 @@ +// based on https://github.com/microsoft/vscode-extension-samples/blob/main/custom-editor-sample/media/catScratch.js +(function () { + console.log("hello world"); + const vscode = acquireVsCodeApi(); + + const container = document.getElementById("root"); + + const root = ReactDOM.createRoot(container); + function updateContent(text) { + root.render( + React.createElement(squiggle_components.SquigglePlayground, { + code: text, + onCodeChange: (code) => { + vscode.postMessage({ type: "edit", text: code }); + }, + showEditor: false, + }) + ); + } + + // Handle messages sent from the extension to the webview + window.addEventListener("message", (event) => { + const message = event.data; // The json data that the extension sent + switch (message.type) { + case "update": + const text = message.text; + + // Update our webview's content + updateContent(text); + + // Then persist state information. + // This state is returned in the call to `vscode.getState` below when a webview is reloaded. + vscode.setState({ text }); + + return; + } + }); + + const state = vscode.getState(); + if (state) { + updateContent(state.text); + } +})(); diff --git a/packages/vscode-ext/media/wysiwyg.js b/packages/vscode-ext/media/wysiwygWebview.js similarity index 100% rename from packages/vscode-ext/media/wysiwyg.js rename to packages/vscode-ext/media/wysiwygWebview.js diff --git a/packages/vscode-ext/package.json b/packages/vscode-ext/package.json index bcd18474..47ac5c1f 100644 --- a/packages/vscode-ext/package.json +++ b/packages/vscode-ext/package.json @@ -18,10 +18,22 @@ "Visualization" ], "activationEvents": [ - "onCustomEditor:squiggle.wysiwyg" + "onCustomEditor:squiggle.wysiwyg", + "onCommand:squiggle.preview" ], "main": "./out/extension.js", "contributes": { + "languages": [ + { + "id": "squiggle", + "extensions": [ + ".squiggle" + ], + "aliases": [ + "Squiggle" + ] + } + ], "customEditors": [ { "viewType": "squiggle.wysiwyg", @@ -31,10 +43,41 @@ "filenamePattern": "*.squiggle" } ], - "priority": "default" + "priority": "option" } ], - "commands": [] + "commands": [ + { + "command": "squiggle.preview", + "title": "Open Preview", + "category": "Squiggle", + "when": "editorLangId == squiggle", + "icon": "$(open-preview)" + } + ], + "menus": { + "editor/title": [ + { + "command": "squiggle.preview", + "when": "editorLangId == squiggle", + "group": "navigation" + } + ], + "commandPalette": [ + { + "command": "squiggle.preview", + "when": "editorLangId == squiggle" + } + ] + }, + "keybindings": [ + { + "command": "squiggle.preview", + "key": "ctrl+k v", + "mac": "cmd+k v", + "when": "editorLangId == squiggle" + } + ] }, "scripts": { "vscode:prepublish": "yarn run compile", diff --git a/packages/vscode-ext/src/squiggleEditor.ts b/packages/vscode-ext/src/editor.ts similarity index 55% rename from packages/vscode-ext/src/squiggleEditor.ts rename to packages/vscode-ext/src/editor.ts index 3e3d9f2c..4410ba26 100644 --- a/packages/vscode-ext/src/squiggleEditor.ts +++ b/packages/vscode-ext/src/editor.ts @@ -1,14 +1,5 @@ import * as vscode from "vscode"; - -function getNonce() { - let text = ""; - const possible = - "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; - for (let i = 0; i < 32; i++) { - text += possible.charAt(Math.floor(Math.random() * possible.length)); - } - return text; -} +import { getWebviewContent } from "./utils"; export class SquiggleEditorProvider implements vscode.CustomTextEditorProvider { public static register(context: vscode.ExtensionContext): vscode.Disposable { @@ -26,8 +17,6 @@ export class SquiggleEditorProvider implements vscode.CustomTextEditorProvider { /** * Called when our custom editor is opened. - * - * */ public async resolveCustomTextEditor( document: vscode.TextDocument, @@ -37,7 +26,12 @@ export class SquiggleEditorProvider implements vscode.CustomTextEditorProvider { webviewPanel.webview.options = { enableScripts: true, }; - webviewPanel.webview.html = this.getHtmlForWebview(webviewPanel.webview); + webviewPanel.webview.html = getWebviewContent({ + webview: webviewPanel.webview, + script: "media/wysiwygWebview.js", + title: "Squiggle Editor", + context: this.context, + }); function updateWebview() { webviewPanel.webview.postMessage({ @@ -79,57 +73,6 @@ export class SquiggleEditorProvider implements vscode.CustomTextEditorProvider { updateWebview(); } - /** - * Get the static html used for the editor webviews. - */ - private getHtmlForWebview(webview: vscode.Webview): string { - // Local path to main script run in the webview - - const styleUri = webview.asWebviewUri( - vscode.Uri.joinPath( - this.context.extensionUri, - "media/vendor/components.css" - ) - ); - - const scriptUris = [ - // vendor files are copied over by `yarn run compile` - "media/vendor/react.js", - "media/vendor/react-dom.js", - "media/vendor/components.js", - "media/wysiwyg.js", - ].map((script) => - webview.asWebviewUri( - vscode.Uri.joinPath(this.context.extensionUri, script) - ) - ); - - // Use a nonce to whitelist which scripts can be run - const nonce = getNonce(); - - return /* html */ ` - - - - - - - - - Squiggle Editor - - -
- ${scriptUris - .map((uri) => ``) - .join("")} - - `; - } - private updateTextDocument(document: vscode.TextDocument, text: string) { const edit = new vscode.WorkspaceEdit(); diff --git a/packages/vscode-ext/src/extension.ts b/packages/vscode-ext/src/extension.ts index 9759472b..3b07fcfb 100644 --- a/packages/vscode-ext/src/extension.ts +++ b/packages/vscode-ext/src/extension.ts @@ -2,12 +2,15 @@ // Import the module and reference it with the alias vscode in your code below import * as vscode from "vscode"; -import { SquiggleEditorProvider } from "./squiggleEditor"; +import { SquiggleEditorProvider } from "./editor"; +import { registerPreviewCommand } from "./preview"; // this method is called when your extension is activated // your extension is activated the very first time the command is executed export function activate(context: vscode.ExtensionContext) { context.subscriptions.push(SquiggleEditorProvider.register(context)); + + registerPreviewCommand(context); } // this method is called when your extension is deactivated diff --git a/packages/vscode-ext/src/preview.ts b/packages/vscode-ext/src/preview.ts new file mode 100644 index 00000000..c6d3e212 --- /dev/null +++ b/packages/vscode-ext/src/preview.ts @@ -0,0 +1,51 @@ +import * as vscode from "vscode"; +import * as uri from "vscode-uri"; +import { getWebviewContent } from "./utils"; + +export const registerPreviewCommand = (context: vscode.ExtensionContext) => { + context.subscriptions.push( + vscode.commands.registerTextEditorCommand("squiggle.preview", (editor) => { + // Create and show a new webview + const title = `Preview ${uri.Utils.basename(editor.document.uri)}`; + + const panel = vscode.window.createWebviewPanel( + "squigglePreview", + title, + vscode.ViewColumn.Beside, + {} // Webview options. More on these later. + ); + + panel.webview.options = { + enableScripts: true, + }; + + panel.webview.html = getWebviewContent({ + context, + webview: panel.webview, + title, + script: "media/previewWebview.js", + }); + + const updateWebview = () => { + panel.webview.postMessage({ + type: "update", + text: editor.document.getText(), + }); + }; + + updateWebview(); + + const changeDocumentSubscription = + vscode.workspace.onDidChangeTextDocument((e) => { + if (e.document.uri.toString() === editor.document.uri.toString()) { + updateWebview(); + } + }); + + // Make sure we get rid of the listener when our editor is closed. + panel.onDidDispose(() => { + changeDocumentSubscription.dispose(); + }); + }) + ); +}; diff --git a/packages/vscode-ext/src/utils.ts b/packages/vscode-ext/src/utils.ts new file mode 100644 index 00000000..7c3f28f4 --- /dev/null +++ b/packages/vscode-ext/src/utils.ts @@ -0,0 +1,59 @@ +import * as vscode from "vscode"; + +const getNonce = () => { + let text = ""; + const possible = + "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"; + for (let i = 0; i < 32; i++) { + text += possible.charAt(Math.floor(Math.random() * possible.length)); + } + return text; +}; + +export const getWebviewContent = ({ + webview, + title, + script, + context, +}: { + webview: vscode.Webview; + title: string; + script: string; + context: vscode.ExtensionContext; +}) => { + const nonce = getNonce(); + + const styleUri = webview.asWebviewUri( + vscode.Uri.joinPath(context.extensionUri, "media/vendor/components.css") + ); + + const scriptUris = [ + // vendor files are copied over by `yarn run compile` + "media/vendor/react.js", + "media/vendor/react-dom.js", + "media/vendor/components.js", + script, + ].map((script) => + webview.asWebviewUri(vscode.Uri.joinPath(context.extensionUri, script)) + ); + + return ` + + + + + + + + + ${title} + + +
+ ${scriptUris + .map((uri) => ``) + .join("")} + + + `; +}; diff --git a/yarn.lock b/yarn.lock index 158b9dfc..ff155b64 100644 --- a/yarn.lock +++ b/yarn.lock @@ -14791,10 +14791,10 @@ react-vega@^7.5.1: prop-types "^15.8.1" vega-embed "^6.5.1" -react@^18.0.0, react@^18.1.0: - version "18.2.0" - resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5" - integrity sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ== +react@^18.1.0: + version "18.1.0" + resolved "https://registry.yarnpkg.com/react/-/react-18.1.0.tgz#6f8620382decb17fdc5cc223a115e2adbf104890" + integrity sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ== dependencies: loose-envify "^1.1.0" @@ -17894,6 +17894,11 @@ vm-browserify@^1.0.1: resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0" integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ== +vscode-uri@^3.0.3: + version "3.0.3" + resolved "https://registry.yarnpkg.com/vscode-uri/-/vscode-uri-3.0.3.tgz#a95c1ce2e6f41b7549f86279d19f47951e4f4d84" + integrity sha512-EcswR2S8bpR7fD0YPeS7r2xXExrScVMxg4MedACaWHEtx9ftCF/qHG1xGkolzTPcEmjTavCQgbVzHUIdTMzFGA== + w3c-hr-time@^1.0.2: version "1.0.2" resolved "https://registry.yarnpkg.com/w3c-hr-time/-/w3c-hr-time-1.0.2.tgz#0a89cdf5cc15822df9c360543676963e0cc308cd" From a2a6ff8ad08abefd1669810e77115dd8e9d58d58 Mon Sep 17 00:00:00 2001 From: Vyacheslav Matyukhin Date: Mon, 20 Jun 2022 18:06:30 +0300 Subject: [PATCH 2/9] vscode: configuration for show* --- packages/vscode-ext/media/previewWebview.js | 18 ++++++++--------- packages/vscode-ext/package.json | 22 ++++++++++++++++++++- packages/vscode-ext/src/preview.ts | 2 ++ 3 files changed, 31 insertions(+), 11 deletions(-) diff --git a/packages/vscode-ext/media/previewWebview.js b/packages/vscode-ext/media/previewWebview.js index 6d91b1b9..556a893b 100644 --- a/packages/vscode-ext/media/previewWebview.js +++ b/packages/vscode-ext/media/previewWebview.js @@ -1,19 +1,17 @@ -// based on https://github.com/microsoft/vscode-extension-samples/blob/main/custom-editor-sample/media/catScratch.js (function () { - console.log("hello world"); const vscode = acquireVsCodeApi(); const container = document.getElementById("root"); const root = ReactDOM.createRoot(container); - function updateContent(text) { + function updateContent(text, showSettings) { root.render( React.createElement(squiggle_components.SquigglePlayground, { code: text, - onCodeChange: (code) => { - vscode.postMessage({ type: "edit", text: code }); - }, showEditor: false, + showTypes: Boolean(showSettings.showTypes), + showControls: Boolean(showSettings.showControls), + showSummary: Boolean(showSettings.showSummary), }) ); } @@ -23,14 +21,14 @@ const message = event.data; // The json data that the extension sent switch (message.type) { case "update": - const text = message.text; + const { text, showSettings } = message; // Update our webview's content - updateContent(text); + updateContent(text, showSettings); // Then persist state information. // This state is returned in the call to `vscode.getState` below when a webview is reloaded. - vscode.setState({ text }); + vscode.setState({ text, showSettings }); return; } @@ -38,6 +36,6 @@ const state = vscode.getState(); if (state) { - updateContent(state.text); + updateContent(state.text, state.showSettings); } })(); diff --git a/packages/vscode-ext/package.json b/packages/vscode-ext/package.json index 47ac5c1f..9dc91e4f 100644 --- a/packages/vscode-ext/package.json +++ b/packages/vscode-ext/package.json @@ -77,7 +77,27 @@ "mac": "cmd+k v", "when": "editorLangId == squiggle" } - ] + ], + "configuration": { + "title": "Squiggle", + "properties": { + "squiggle.playground.showTypes": { + "type": "boolean", + "default": false, + "description": "Whether to show the types of outputs in the playground" + }, + "squiggle.playground.showControls": { + "type": "boolean", + "default": false, + "description": "Whether to show the log scale controls in the playground" + }, + "squiggle.playground.showSummary": { + "type": "boolean", + "default": false, + "description": "Whether to show the summary table in the playground" + } + } + } }, "scripts": { "vscode:prepublish": "yarn run compile", diff --git a/packages/vscode-ext/src/preview.ts b/packages/vscode-ext/src/preview.ts index c6d3e212..04c57c86 100644 --- a/packages/vscode-ext/src/preview.ts +++ b/packages/vscode-ext/src/preview.ts @@ -30,6 +30,8 @@ export const registerPreviewCommand = (context: vscode.ExtensionContext) => { panel.webview.postMessage({ type: "update", text: editor.document.getText(), + showSettings: + vscode.workspace.getConfiguration("squiggle").playground, }); }; From 7441027e0f2f9a368bd60f6f6b580d8b41f8750f Mon Sep 17 00:00:00 2001 From: Vyacheslav Matyukhin Date: Mon, 20 Jun 2022 23:33:31 +0300 Subject: [PATCH 3/9] first try at squiggle syntax highlighting --- packages/vscode-ext/.gitignore | 1 + packages/vscode-ext/package.json | 17 +++- .../syntaxes/squiggle.tmLanguage.yaml | 89 +++++++++++++++++++ yarn.lock | 9 ++ 4 files changed, 112 insertions(+), 4 deletions(-) create mode 100644 packages/vscode-ext/syntaxes/squiggle.tmLanguage.yaml diff --git a/packages/vscode-ext/.gitignore b/packages/vscode-ext/.gitignore index c712b96a..e1e96097 100644 --- a/packages/vscode-ext/.gitignore +++ b/packages/vscode-ext/.gitignore @@ -1,3 +1,4 @@ /media/vendor /out /*.vsix +/syntaxes/*.json diff --git a/packages/vscode-ext/package.json b/packages/vscode-ext/package.json index 9dc91e4f..fdac88a3 100644 --- a/packages/vscode-ext/package.json +++ b/packages/vscode-ext/package.json @@ -3,7 +3,7 @@ "displayName": "Squiggle", "description": "Squiggle language support", "license": "MIT", - "version": "0.0.4", + "version": "0.1.0", "publisher": "QURI", "repository": { "type": "git", @@ -34,6 +34,13 @@ ] } ], + "grammars": [ + { + "language": "squiggle", + "scopeName": "source.squiggle", + "path": "./syntaxes/squiggle.tmLanguage.json" + } + ], "customEditors": [ { "viewType": "squiggle.wysiwyg", @@ -102,21 +109,23 @@ "scripts": { "vscode:prepublish": "yarn run compile", "compile:tsc": "tsc -p ./", + "compile:grammar": "js-yaml syntaxes/squiggle.tmLanguage.yaml >syntaxes/squiggle.tmLanguage.json", "compile:vendor": "(cd ../squiggle-lang && yarn run build) && (cd ../components && yarn run bundle && yarn run build:css) && mkdir -p media/vendor && cp ../components/dist/bundle.js media/vendor/components.js && cp ../components/dist/main.css media/vendor/components.css && cp ../../node_modules/react/umd/react.production.min.js media/vendor/react.js && cp ../../node_modules/react-dom/umd/react-dom.production.min.js media/vendor/react-dom.js && cp ../website/static/img/quri-logo.png media/vendor/icon.png", - "compile": "yarn run compile:tsc && yarn run compile:vendor", + "compile": "yarn run compile:tsc && yarn run compile:grammar && yarn run compile:vendor", "watch": "tsc -watch -p ./", "pretest": "yarn run compile && yarn run lint", "lint": "eslint src --ext ts", "format": "eslint src --ext ts --fix" }, "devDependencies": { - "@types/vscode": "^1.68.0", "@types/glob": "^7.2.0", "@types/node": "18.x", + "@types/vscode": "^1.68.0", "@typescript-eslint/eslint-plugin": "^5.27.0", "@typescript-eslint/parser": "^5.27.0", "eslint": "^8.18.0", "glob": "^8.0.3", - "typescript": "^4.7.4" + "typescript": "^4.7.4", + "js-yaml": "^4.1.0" } } diff --git a/packages/vscode-ext/syntaxes/squiggle.tmLanguage.yaml b/packages/vscode-ext/syntaxes/squiggle.tmLanguage.yaml new file mode 100644 index 00000000..69daaddb --- /dev/null +++ b/packages/vscode-ext/syntaxes/squiggle.tmLanguage.yaml @@ -0,0 +1,89 @@ +scopeName: source.squiggle +patterns: + - include: "#statement" + - include: "#expression" + - include: "#comment-block" + - include: "#comment-line" +repository: + statement: + patterns: + - include: "#let" + - include: "#defun" + expression: + patterns: + - include: "#integer" + - include: "#float" + - include: "#string" + - include: "#block" + - include: "#function-call" + let: + match: ^\s*(\w+)\s*= + captures: + "1": + name: variable.other.squiggle + defun: + begin: ^\s*(\w+)\s*(\() + end: (\))\s*= + beginCaptures: + "1": + name: entity.name.function.squiggle + "2": + name: punctuation.definition.arguments.begin.squiggle + endCaptures: + "1": + name: punctuation.definition.arguments.end.squiggle + patterns: + - include: "#array-parameters" + array-parameters: + begin: \b([\$_a-z]+[\$_a-zA-Z0-9]*) + end: \s*(?:(,)|(?=\))) + beginCaptures: + "1": + name: variable.parameter.function.squiggle + function-call: + begin: (\w+)\s*(\() + end: (\)) + beginCaptures: + "1": + name: entity.name.function.squiggle + "2": + name: punctuation.definition.arguments.begin.squiggle + endCaptures: + "1": + name: punctuation.definition.arguments.end.squiggle + patterns: + - include: "$self" + comment-block: + begin: /\* + end: \*/ + name: comment.block.squiggle + comment-line: + patterns: + - include: "#comment-line-double-slash" + - include: "#comment-line-number-sign" + comment-line-double-slash: + match: //.* + name: comment.line.double-slash.squiggle + comment-line-number-sign: + match: "#.*" + name: comment.line.number-sign.squiggle + block: + begin: "{" + end: "}" + beginCaptures: + "0": + name: punctuation.definition.block.squiggle + endCaptures: + "0": + name: punctuation.definition.block.squiggle + patterns: + - include: "$self" + integer: + match: \b\d+([_a-zA-Z]+[_a-zA-Z0-9]*)? + name: constant.numeric.integer.squiggle + float: + match: \b(\d+\.\d*|\.?\d+)([eE]-?\d+)?([_a-zA-Z]+[_a-zA-Z0-9]*)? + name: constant.numeric.float.squiggle + string: + match: \".*?\" + name: string.quoted.double.squiggle diff --git a/yarn.lock b/yarn.lock index ff155b64..757777af 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4353,6 +4353,15 @@ "@types/scheduler" "*" csstype "^3.0.2" +"@types/react@^18.0.9": + version "18.0.14" + resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.14.tgz#e016616ffff51dba01b04945610fe3671fdbe06d" + integrity sha512-x4gGuASSiWmo0xjDLpm5mPb52syZHJx02VKbqUKdLmKtAwIh63XClGsiTI1K6DO5q7ox4xAsQrU+Gl3+gGXF9Q== + dependencies: + "@types/prop-types" "*" + "@types/scheduler" "*" + csstype "^3.0.2" + "@types/resolve@1.17.1": version "1.17.1" resolved "https://registry.yarnpkg.com/@types/resolve/-/resolve-1.17.1.tgz#3afd6ad8967c77e4376c598a82ddd58f46ec45d6" From 99bd6d421d0e4784d7f979c33ed53b614a93c336 Mon Sep 17 00:00:00 2001 From: Vyacheslav Matyukhin Date: Mon, 20 Jun 2022 23:38:09 +0300 Subject: [PATCH 4/9] update yarn.lock --- yarn.lock | 18 ++++-------------- 1 file changed, 4 insertions(+), 14 deletions(-) diff --git a/yarn.lock b/yarn.lock index 757777af..162cad5c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4353,15 +4353,6 @@ "@types/scheduler" "*" csstype "^3.0.2" -"@types/react@^18.0.9": - version "18.0.14" - resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.14.tgz#e016616ffff51dba01b04945610fe3671fdbe06d" - integrity sha512-x4gGuASSiWmo0xjDLpm5mPb52syZHJx02VKbqUKdLmKtAwIh63XClGsiTI1K6DO5q7ox4xAsQrU+Gl3+gGXF9Q== - dependencies: - "@types/prop-types" "*" - "@types/scheduler" "*" - csstype "^3.0.2" - "@types/resolve@1.17.1": version "1.17.1" resolved "https://registry.yarnpkg.com/@types/resolve/-/resolve-1.17.1.tgz#3afd6ad8967c77e4376c598a82ddd58f46ec45d6" @@ -14800,10 +14791,10 @@ react-vega@^7.5.1: prop-types "^15.8.1" vega-embed "^6.5.1" -react@^18.1.0: - version "18.1.0" - resolved "https://registry.yarnpkg.com/react/-/react-18.1.0.tgz#6f8620382decb17fdc5cc223a115e2adbf104890" - integrity sha512-4oL8ivCz5ZEPyclFQXaNksK3adutVS8l2xzZU0cqEFrE9Sb7fC0EFK5uEk74wIreL1DERyjvsU915j1pcT2uEQ== +react@^18.0.0, react@^18.1.0: + version "18.2.0" + resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5" + integrity sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ== dependencies: loose-envify "^1.1.0" @@ -17543,7 +17534,6 @@ vega-embed@^6.21.0, vega-embed@^6.5.1: vega-schema-url-parser "^2.2.0" vega-themes "^2.10.0" vega-tooltip "^0.28.0" - yallist "*" vega-encode@~4.9.0: version "4.9.0" From dab6b3d09ede37f3236adaaaa251328dc90d3ac6 Mon Sep 17 00:00:00 2001 From: Vyacheslav Matyukhin Date: Mon, 20 Jun 2022 23:54:34 +0300 Subject: [PATCH 5/9] highlight keywords --- packages/vscode-ext/syntaxes/squiggle.tmLanguage.yaml | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/packages/vscode-ext/syntaxes/squiggle.tmLanguage.yaml b/packages/vscode-ext/syntaxes/squiggle.tmLanguage.yaml index 69daaddb..a7f16539 100644 --- a/packages/vscode-ext/syntaxes/squiggle.tmLanguage.yaml +++ b/packages/vscode-ext/syntaxes/squiggle.tmLanguage.yaml @@ -16,6 +16,7 @@ repository: - include: "#string" - include: "#block" - include: "#function-call" + - include: "#keywords" let: match: ^\s*(\w+)\s*= captures: @@ -78,6 +79,9 @@ repository: name: punctuation.definition.block.squiggle patterns: - include: "$self" + keywords: + match: \b(if|then|else|to)\b + name: keyword.control.squiggle integer: match: \b\d+([_a-zA-Z]+[_a-zA-Z0-9]*)? name: constant.numeric.integer.squiggle From 00b1e6bb96d0a277bc56c04fe65482985404cded Mon Sep 17 00:00:00 2001 From: Vyacheslav Matyukhin Date: Tue, 21 Jun 2022 00:26:16 +0300 Subject: [PATCH 6/9] basic language-configuration --- .../vscode-ext/language-configuration.json | 18 ++++++++++++++++++ packages/vscode-ext/package.json | 3 ++- 2 files changed, 20 insertions(+), 1 deletion(-) create mode 100644 packages/vscode-ext/language-configuration.json diff --git a/packages/vscode-ext/language-configuration.json b/packages/vscode-ext/language-configuration.json new file mode 100644 index 00000000..727d0444 --- /dev/null +++ b/packages/vscode-ext/language-configuration.json @@ -0,0 +1,18 @@ +{ + "comments": { + "lineComment": "//", + "blockComment": ["/*", "*/"] + }, + "brackets": [ + ["{", "}"], + ["[", "]"], + ["(", ")"] + ], + "autoClosingPairs": [ + { "open": "{", "close": "}" }, + { "open": "[", "close": "]" }, + { "open": "(", "close": ")" }, + { "open": "'", "close": "'", "notIn": ["string", "comment"] }, + { "open": "\"", "close": "\"", "notIn": ["string", "comment"] } + ] +} diff --git a/packages/vscode-ext/package.json b/packages/vscode-ext/package.json index fdac88a3..051e41de 100644 --- a/packages/vscode-ext/package.json +++ b/packages/vscode-ext/package.json @@ -31,7 +31,8 @@ ], "aliases": [ "Squiggle" - ] + ], + "configuration": "./language-configuration.json" } ], "grammars": [ From a81c0aae0ba196ed0ec4ec144c0d4a2a262360c4 Mon Sep 17 00:00:00 2001 From: Vyacheslav Matyukhin Date: Tue, 21 Jun 2022 00:43:50 +0300 Subject: [PATCH 7/9] fix vscode-uri dependency --- packages/vscode-ext/package.json | 7 +++++-- yarn.lock | 14 +++++++------- 2 files changed, 12 insertions(+), 9 deletions(-) diff --git a/packages/vscode-ext/package.json b/packages/vscode-ext/package.json index 051e41de..2e3c50ea 100644 --- a/packages/vscode-ext/package.json +++ b/packages/vscode-ext/package.json @@ -126,7 +126,10 @@ "@typescript-eslint/parser": "^5.27.0", "eslint": "^8.18.0", "glob": "^8.0.3", - "typescript": "^4.7.4", - "js-yaml": "^4.1.0" + "js-yaml": "^4.1.0", + "typescript": "^4.7.4" + }, + "dependencies": { + "vscode-uri": "^3.0.3" } } diff --git a/yarn.lock b/yarn.lock index 162cad5c..58d044d6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4344,7 +4344,7 @@ dependencies: "@types/react" "*" -"@types/react@*", "@types/react@^18.0.1", "@types/react@^18.0.9": +"@types/react@*", "@types/react@^18.0.9": version "18.0.14" resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.14.tgz#e016616ffff51dba01b04945610fe3671fdbe06d" integrity sha512-x4gGuASSiWmo0xjDLpm5mPb52syZHJx02VKbqUKdLmKtAwIh63XClGsiTI1K6DO5q7ox4xAsQrU+Gl3+gGXF9Q== @@ -14791,7 +14791,7 @@ react-vega@^7.5.1: prop-types "^15.8.1" vega-embed "^6.5.1" -react@^18.0.0, react@^18.1.0: +react@^18.1.0: version "18.2.0" resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5" integrity sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ== @@ -18638,16 +18638,16 @@ y18n@^5.0.5: resolved "https://registry.yarnpkg.com/y18n/-/y18n-5.0.8.tgz#7f4934d0f7ca8c56f95314939ddcd2dd91ce1d55" integrity sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA== -yallist@*, yallist@^4.0.0: - version "4.0.0" - resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72" - integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A== - yallist@^3.0.2: version "3.1.1" resolved "https://registry.yarnpkg.com/yallist/-/yallist-3.1.1.tgz#dbb7daf9bfd8bac9ab45ebf602b8cbad0d5d08fd" integrity sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g== +yallist@^4.0.0: + version "4.0.0" + resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72" + integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A== + yaml@^1.10.0, yaml@^1.10.2, yaml@^1.7.2: version "1.10.2" resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b" From 9aa97f66b0b0cdb22c013d6fd64a2221c2d01f2b Mon Sep 17 00:00:00 2001 From: Vyacheslav Matyukhin Date: Tue, 21 Jun 2022 00:46:12 +0300 Subject: [PATCH 8/9] vscode: some docs, squiggleU support --- packages/vscode-ext/README.md | 11 +++++++++++ packages/vscode-ext/package.json | 15 +++++++++++++++ 2 files changed, 26 insertions(+) diff --git a/packages/vscode-ext/README.md b/packages/vscode-ext/README.md index afedd282..9d23c1e2 100644 --- a/packages/vscode-ext/README.md +++ b/packages/vscode-ext/README.md @@ -4,6 +4,17 @@ _[marketplace](https://marketplace.visualstudio.com/items?itemName=QURI.vscode-s This extension provides support for [Squiggle](https://www.squiggle-language.com/) in VS Code. +Features: + +- Preview `.squiggle` files in a preview pane +- Syntax highlighting for `.squiggle` and `.squiggleU` files + +# Configuration + +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. + +Check out the full list of Squiggle settings in the main VS Code settings. + # Build locally We assume you ran `yarn` at the monorepo level for all dependencies. diff --git a/packages/vscode-ext/package.json b/packages/vscode-ext/package.json index 2e3c50ea..db6dcfa6 100644 --- a/packages/vscode-ext/package.json +++ b/packages/vscode-ext/package.json @@ -33,6 +33,16 @@ "Squiggle" ], "configuration": "./language-configuration.json" + }, + { + "id": "squiggleU", + "extensions": [ + ".squiggleU" + ], + "aliases": [ + "SquiggleU" + ], + "configuration": "./language-configuration.json" } ], "grammars": [ @@ -40,6 +50,11 @@ "language": "squiggle", "scopeName": "source.squiggle", "path": "./syntaxes/squiggle.tmLanguage.json" + }, + { + "language": "squiggleU", + "scopeName": "source.squiggle", + "path": "./syntaxes/squiggle.tmLanguage.json" } ], "customEditors": [ From f7bf1681d62cbb372abee9b2c4d0c3c5d2213ed4 Mon Sep 17 00:00:00 2001 From: Vyacheslav Matyukhin Date: Tue, 21 Jun 2022 01:07:27 +0300 Subject: [PATCH 9/9] remove vscode-uri dep, release 0.1.2 ext version --- packages/vscode-ext/package.json | 5 +---- packages/vscode-ext/src/preview.ts | 4 ++-- yarn.lock | 4 ++-- 3 files changed, 5 insertions(+), 8 deletions(-) diff --git a/packages/vscode-ext/package.json b/packages/vscode-ext/package.json index db6dcfa6..af70abda 100644 --- a/packages/vscode-ext/package.json +++ b/packages/vscode-ext/package.json @@ -3,7 +3,7 @@ "displayName": "Squiggle", "description": "Squiggle language support", "license": "MIT", - "version": "0.1.0", + "version": "0.1.2", "publisher": "QURI", "repository": { "type": "git", @@ -143,8 +143,5 @@ "glob": "^8.0.3", "js-yaml": "^4.1.0", "typescript": "^4.7.4" - }, - "dependencies": { - "vscode-uri": "^3.0.3" } } diff --git a/packages/vscode-ext/src/preview.ts b/packages/vscode-ext/src/preview.ts index 04c57c86..81e4da47 100644 --- a/packages/vscode-ext/src/preview.ts +++ b/packages/vscode-ext/src/preview.ts @@ -1,12 +1,12 @@ import * as vscode from "vscode"; -import * as uri from "vscode-uri"; +import * as path from "path"; import { getWebviewContent } from "./utils"; export const registerPreviewCommand = (context: vscode.ExtensionContext) => { context.subscriptions.push( vscode.commands.registerTextEditorCommand("squiggle.preview", (editor) => { // Create and show a new webview - const title = `Preview ${uri.Utils.basename(editor.document.uri)}`; + const title = `Preview ${path.basename(editor.document.uri.path)}`; const panel = vscode.window.createWebviewPanel( "squigglePreview", diff --git a/yarn.lock b/yarn.lock index 58d044d6..b1c89aa7 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4344,7 +4344,7 @@ dependencies: "@types/react" "*" -"@types/react@*", "@types/react@^18.0.9": +"@types/react@*", "@types/react@^18.0.1", "@types/react@^18.0.9": version "18.0.14" resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.14.tgz#e016616ffff51dba01b04945610fe3671fdbe06d" integrity sha512-x4gGuASSiWmo0xjDLpm5mPb52syZHJx02VKbqUKdLmKtAwIh63XClGsiTI1K6DO5q7ox4xAsQrU+Gl3+gGXF9Q== @@ -14791,7 +14791,7 @@ react-vega@^7.5.1: prop-types "^15.8.1" vega-embed "^6.5.1" -react@^18.1.0: +react@^18.0.0, react@^18.1.0: version "18.2.0" resolved "https://registry.yarnpkg.com/react/-/react-18.2.0.tgz#555bd98592883255fa00de14f1151a917b5d77d5" integrity sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==