fix divider

package.json

@@ -44,9 +44,9 @@
     "@mdx-js/loader": "^3.1.0",
     "@node-cli/static-server": "^3.1.4",
     "@react-router/node": "^7.8.1",
+    "@replit/codemirror-vim": "^6.3.0",
     "@rescript/react": "^0.14.0-rc.1",
     "@rescript/webapi": "^0.1.0-experimental-29db5f4",
-    "@replit/codemirror-vim": "^6.3.0",
     "docson": "^2.1.0",
     "escodegen": "^2.1.0",
     "eslint-config-next": "^13.1.1",
@@ -90,6 +90,7 @@
     "prettier": "^3.6.2",
     "reanalyze": "^2.16.0",
     "tailwindcss": "^4",
-    "vite": "^7.0.6"
+    "vite": "^7.0.6",
+    "vite-plugin-env-compatible": "^2.0.1"
   }
-}
+}

src/Playground.res

@@ -6,32 +6,6 @@ module Api = RescriptCompilerApi
 type layout = Column | Row
 type tab = JavaScript | Output | Problems | Settings
 
-%%raw(`
-  import "../styles/main.css";
-  import "../styles/_hljs.css";
-  import "../styles/utils.css";
-
-  import hljs from 'highlight.js/lib/core';
-  import bash from 'highlight.js/lib/languages/bash';
-  import css from 'highlight.js/lib/languages/css';
-  import diff from 'highlight.js/lib/languages/diff';
-  import javascript from 'highlight.js/lib/languages/javascript';
-  import json from 'highlight.js/lib/languages/json';
-  import text from 'highlight.js/lib/languages/plaintext';
-  import html from 'highlight.js/lib/languages/xml';
-  import rescript from 'highlightjs-rescript';
-
-  hljs.registerLanguage('rescript', rescript)
-  hljs.registerLanguage('javascript', javascript)
-  hljs.registerLanguage('css', css)
-  hljs.registerLanguage('ts', javascript)
-  hljs.registerLanguage('sh', bash)
-  hljs.registerLanguage('json', json)
-  hljs.registerLanguage('text', text)
-  hljs.registerLanguage('html', html)
-  hljs.registerLanguage('diff', diff)
-`)
-
 module JsxCompilation = {
   type t =
     | Plain
@@ -1963,7 +1937,7 @@ let make = (~bundleBaseUrl: string, ~versions: array<string>) => {
       // Left Panel
       <div
         ref={ReactDOM.Ref.domRef((Obj.magic(leftPanelRef): React.ref<Nullable.t<Dom.element>>))}
-        className={`${layout == Column ? "h-2/4" : "h-full!"} ${layout == Column
+        className={`overflow-scroll ${layout == Column ? "h-2/4" : "h-full!"} ${layout == Column
             ? "w-full"
             : "w-[50%]"}`}
       >
@@ -1995,7 +1969,7 @@ let make = (~bundleBaseUrl: string, ~versions: array<string>) => {
       <div
         ref={ReactDOM.Ref.domRef((Obj.magic(separatorRef): React.ref<Nullable.t<Dom.element>>))}
         // TODO: touch-none not applied
-        className={`flex items-center justify-center touch-none select-none bg-gray-70 opacity-30 hover:opacity-50 rounded-lg h-full ${layout ==
+        className={`flex items-center justify-center touch-none select-none bg-gray-70 opacity-30 hover:opacity-50 rounded-lg ${layout ==
             Column
             ? "cursor-row-resize"
             : "cursor-col-resize"}`}

src/common/CompilerManagerHook.res

@@ -575,47 +575,48 @@ let useCompilerManager = (
           | _ => Ready(ready)
           }
         )
-      | Executing({state, jsCode}) => ()
-      // open Babel
-
-      // let ast = Parser.parse(jsCode, {sourceType: "module"})
-      // let {entryPointExists, code, imports} = PlaygroundValidator.validate(ast)
-      // let imports = imports->Dict.mapValues(path => {
-      //   let filename = path->String.slice(~start=9) // the part after "./stdlib/"
-      //   let filename = switch state.selected.id {
-      //   | {major: 12, minor: 0, patch: 0, preRelease: Some(Alpha(alpha))} if alpha < 8 =>
-      //     let filename = if filename->String.startsWith("core__") {
-      //       filename->String.slice(~start=6)
-      //     } else {
-      //       filename
-      //     }
-      //     capitalizeFirstLetter(filename)
-      //   | {major} if major < 12 && filename->String.startsWith("core__") =>
-      //     capitalizeFirstLetter(filename)
-      //   | _ => filename
-      //   }
-      //   let compilerVersion = switch state.selected.id {
-      //   | {major: 12, minor: 0, patch: 0, preRelease: Some(Alpha(alpha))} if alpha < 9 => {
-      //       Semver.major: 12,
-      //       minor: 0,
-      //       patch: 0,
-      //       preRelease: Some(Alpha(9)),
-      //     }
-      //   | {major, minor} if (major === 11 && minor < 2) || major < 11 => {
-      //       major: 11,
-      //       minor: 2,
-      //       patch: 0,
-      //       preRelease: Some(Beta(2)),
-      //     }
-      //   | version => version
-      //   }
-      //   CdnMeta.getStdlibRuntimeUrl(bundleBaseUrl, compilerVersion, filename)
-      // })
-
-      // entryPointExists
-      //   ? code->wrapReactApp->EvalIFrame.sendOutput(imports)
-      //   : EvalIFrame.sendOutput(code, imports)
-      // setState(_ => Ready({...state, logs: [], validReactCode: entryPointExists}))
+      | Executing({state, jsCode}) =>
+        ()
+        open Babel
+
+        let ast = Parser.parse(jsCode, {sourceType: "module"})
+        let {entryPointExists, code, imports} = PlaygroundValidator.validate(ast)
+        let imports = imports->Dict.mapValues(path => {
+          let filename = path->String.slice(~start=9) // the part after "./stdlib/"
+          let filename = switch state.selected.id {
+          | {major: 12, minor: 0, patch: 0, preRelease: Some(Alpha(alpha))} if alpha < 8 =>
+            let filename = if filename->String.startsWith("core__") {
+              filename->String.slice(~start=6)
+            } else {
+              filename
+            }
+            capitalizeFirstLetter(filename)
+          | {major} if major < 12 && filename->String.startsWith("core__") =>
+            capitalizeFirstLetter(filename)
+          | _ => filename
+          }
+          let compilerVersion = switch state.selected.id {
+          | {major: 12, minor: 0, patch: 0, preRelease: Some(Alpha(alpha))} if alpha < 9 => {
+              Semver.major: 12,
+              minor: 0,
+              patch: 0,
+              preRelease: Some(Alpha(9)),
+            }
+          | {major, minor} if (major === 11 && minor < 2) || major < 11 => {
+              major: 11,
+              minor: 2,
+              patch: 0,
+              preRelease: Some(Beta(2)),
+            }
+          | version => version
+          }
+          CdnMeta.getStdlibRuntimeUrl(bundleBaseUrl, compilerVersion, filename)
+        })
+
+        entryPointExists
+          ? code->wrapReactApp->EvalIFrame.sendOutput(imports)
+          : EvalIFrame.sendOutput(code, imports)
+        setState(_ => Ready({...state, logs: [], validReactCode: entryPointExists}))
       | SetupFailed(_) => ()
       | Ready(ready) =>
         let url = createUrl((pathname :> string), ready)

vite.config.mjs

@@ -1,13 +1,15 @@
 import { reactRouter } from "@react-router/dev/vite";
 import tailwindcss from '@tailwindcss/vite';
 import { defineConfig } from "vite";
+import env from 'vite-plugin-env-compatible'
 
 export default defineConfig({
   plugins: [
     tailwindcss(),
     reactRouter({
       ssr: true,
     }),
+    env({ prefix: 'PUBLIC_' })
   ],
   build: {
     sourcemap: true