Merge pull request #5 from aabounegm/playground

Playground
aabounegm · Jan 8, 2025 · c719bf6 · c719bf6
2 parents 1c9eacd + 83e9941
commit c719bf6
Show file tree

Hide file tree

Showing 16 changed files with 3,652 additions and 1,770 deletions.
diff --git a/.github/workflows/playground.yml b/.github/workflows/playground.yml
@@ -0,0 +1,41 @@
+name: Deploy playground
+
+permissions:
+  pages: write
+  id-token: write
+
+on:
+  push:
+    branches: [main]
+  workflow_dispatch:
+
+jobs:
+  docs:
+    name: Build and deploy playground
+    runs-on: ubuntu-latest
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Use Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "18"
+
+      - name: Build API docs
+        run: |
+          npm ci
+          npm run langium:generate
+          npm run build
+          npm run bundle
+
+      - name: Upload docs artifact
+        uses: actions/upload-pages-artifact@v3
+        with:
+          path: dist
+
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@v4
diff --git a/.gitignore b/.gitignore
@@ -7,3 +7,4 @@ out/
 src/language/generated/
 syntaxes/
 *.tsbuildinfo
+dist/
diff --git a/index.html b/index.html
@@ -4,19 +4,30 @@
 <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Langium Web</title>
-    <link href="./static/styles.css" rel="stylesheet"/>
+    <title>Stella Playground</title>
+    <link href="./static/styles.css" rel="stylesheet" />
+    <script defer src="https://fizruk.github.io/stella/playground/stella.js"></script>
 </head>
 
 <body>
-    <div style="padding: 5px">
-        <h1>Stella in Langium</h1>
-        Please select which grammar definition you want to use with monaco-editor:
-        <br>
-        <a href="./static/monacoClassic.html">Stella + Monarch (Classic monaco-editor config)</a>
-        <br>
-        <a href="./static/monacoExtended.html">Stella + Textmate (Extended Vscode Extension Config)</a>
+    <header id="header">
+        <h1 style="font-size: 1.5em;">Stella Playground</h1>
+        <ul class="links">
+            <li><a href="https://fizruk.github.io/stella">Docs</a></li>
+        </ul>
+    </header>
+    <div id="wrapper">
+        <div id="monaco-editor-root"></div>
+        <div id="actions">
+            <div>
+                <button id="typecheck">Typecheck</button>
+                <button id="compile">Compile</button>
+            </div>
+            <div id="result">Loading...</div>
+        </div>
     </div>
+
+    <script defer type="module" src="./src/web/main.ts"></script>
 </body>
 
 </html>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -30,12 +30,12 @@
     "vscode-languageserver": "~9.0.1",
     "chalk": "~5.3.0",
     "commander": "~11.0.0",
-    "@codingame/monaco-vscode-editor-service-override": "~3.2.3",
-    "@codingame/monaco-vscode-keybindings-service-override": "~3.2.3",
-    "monaco-editor": "npm:@codingame/monaco-vscode-editor-api@~3.2.3",
-    "monaco-editor-wrapper": "~4.0.2",
-    "monaco-languageclient": "~8.1.1",
-    "vscode": "npm:@codingame/monaco-vscode-api@~3.2.3"
+    "@codingame/monaco-vscode-editor-service-override": "~11.1.2",
+    "@codingame/monaco-vscode-keybindings-service-override": "~11.1.2",
+    "monaco-editor": "npm:@codingame/monaco-vscode-editor-api@~11.1.2",
+    "monaco-editor-wrapper": "~6.0.0",
+    "monaco-languageclient": "~9.0.0",
+    "vscode": "npm:@codingame/monaco-vscode-api@~11.1.2"
   },
   "devDependencies": {
     "@types/node": "^18.0.0",
@@ -46,11 +46,11 @@
     "typescript": "~5.7.2",
     "@types/vscode": "~1.67.0",
     "concurrently": "~8.2.1",
-    "esbuild": "~0.20.2",
+    "esbuild": "~0.24.2",
     "@codingame/esbuild-import-meta-url-plugin": "~1.0.2",
-    "vite": "~5.2.7",
+    "vite": "~6.0.7",
     "http-server": "~14.1.1",
-    "vitest": "~1.4.0"
+    "vitest": "~2.1.8"
   },
   "volta": {
     "node": "18.19.1",

diff --git a/src/setupClassic.ts b/src/setupClassic.ts
diff --git a/src/setupCommon.ts b/src/setupCommon.ts
diff --git a/src/setupExtended.ts b/src/setupExtended.ts
diff --git a/src/web/compiler.ts b/src/web/compiler.ts
@@ -0,0 +1,18 @@
+export type Result = { status: string; result: string };
+
+declare function stellaTypecheck_(tmp: { input: string }): void;
+declare function stellaCompile_(tmp: { input: string }): void;
+
+export function typecheck(input: string): Result {
+  const tmp = { input };
+  stellaTypecheck_(tmp);
+  const result: Result = tmp as unknown as Result;
+  return result;
+}
+
+export function compile(input: string) {
+  const tmp = { input };
+  stellaCompile_(tmp);
+  const result: Result = tmp as unknown as Result;
+  return result;
+}
diff --git a/src/web/iframe.ts b/src/web/iframe.ts
@@ -0,0 +1,12 @@
+export const isInIframe = window.self !== window.top;
+
+export function hideHeaderInIframe() {
+  if (!isInIframe) return;
+
+  document.getElementById("header")?.remove();
+
+  const wrapper = document.getElementById("wrapper");
+  if (wrapper) {
+    wrapper.style.height = "100vh"; // account for the removed header
+  }
+}