@webiny/app-sdk-playground 6.3.0 → 6.4.0-beta.1

package/plugins/useCodeExecution.js

@@ -1,44 +1,31 @@
 import { useSnackbar, useTenantContext } from "@webiny/app-admin";
 import { AuthenticationContextFeature } from "@webiny/app-admin/features/security/AuthenticationContext/feature.js";
 import { useFeature } from "@webiny/app";
-import { config as appConfig } from "@webiny/app/config.js";
+import { config } from "@webiny/app/config.js";
 import { Webiny } from "@webiny/sdk";
 import { useCallback, useState } from "react";
 import { createCustomConsole } from "./consoleCapture.js";
-export function useCodeExecution(code, editorRef) {
-  const [output, setOutput] = useState([]);
-  const [isRunning, setIsRunning] = useState(false);
-  const {
-    showSnackbar
-  } = useSnackbar();
-  const {
-    tenant
-  } = useTenantContext();
-  const {
-    authenticationContext
-  } = useFeature(AuthenticationContextFeature);
-  const handleRun = useCallback(async () => {
-    const apiUrl = appConfig.getKey("API_URL", process.env.REACT_APP_API_URL);
-    if (!apiUrl) {
-      showSnackbar("API URL is not configured");
-      return;
-    }
-    const currentCode = editorRef.current?.getValue() || code;
-    setIsRunning(true);
-    setOutput([]);
-    const messages = [];
-
-    // Create custom console for capturing output.
-    const customConsole = createCustomConsole(messages, setOutput);
-    try {
-      const sdk = new Webiny({
-        endpoint: apiUrl,
-        tenant: tenant || undefined,
-        token: () => authenticationContext.getIdToken()
-      });
-
-      // Wrap code in async function to allow top-level await.
-      const wrappedCode = `
+function useCodeExecution(code, editorRef) {
+    const [output, setOutput] = useState([]);
+    const [isRunning, setIsRunning] = useState(false);
+    const { showSnackbar } = useSnackbar();
+    const { tenant } = useTenantContext();
+    const { authenticationContext } = useFeature(AuthenticationContextFeature);
+    const handleRun = useCallback(async ()=>{
+        const apiUrl = config.getKey("API_URL", process.env.REACT_APP_API_URL);
+        if (!apiUrl) return void showSnackbar("API URL is not configured");
+        const currentCode = editorRef.current?.getValue() || code;
+        setIsRunning(true);
+        setOutput([]);
+        const messages = [];
+        const customConsole = createCustomConsole(messages, setOutput);
+        try {
+            const sdk = new Webiny({
+                endpoint: apiUrl,
+                tenant: tenant || void 0,
+                token: ()=>authenticationContext.getIdToken()
+            });
+            const wrappedCode = `
                 (async () => {
                     try {
                         ${currentCode}
@@ -48,30 +35,29 @@ export function useCodeExecution(code, editorRef) {
                     }
                 })()
             `;
-
-      // Create function with injected dependencies.
-      const fn = new Function("console", "sdk", "window", wrappedCode);
-
-      // Execute with custom console and SDK.
-      const result = fn(customConsole, sdk, {
-        sdk
-      });
-
-      // Handle async results.
-      if (result && typeof result.then === "function") {
-        await result;
-      }
-    } catch (error) {
-      customConsole.error("Execution error:", error);
-    } finally {
-      setIsRunning(false);
-    }
-  }, [code, editorRef, showSnackbar, tenant, authenticationContext]);
-  return {
-    output,
-    isRunning,
-    handleRun
-  };
+            const fn = new Function("console", "sdk", "window", wrappedCode);
+            const result = fn(customConsole, sdk, {
+                sdk
+            });
+            if (result && "function" == typeof result.then) await result;
+        } catch (error) {
+            customConsole.error("Execution error:", error);
+        } finally{
+            setIsRunning(false);
+        }
+    }, [
+        code,
+        editorRef,
+        showSnackbar,
+        tenant,
+        authenticationContext
+    ]);
+    return {
+        output,
+        isRunning,
+        handleRun
+    };
 }
+export { useCodeExecution };
 
 //# sourceMappingURL=useCodeExecution.js.map

package/plugins/useCodeExecution.js.map

@@ -1 +1 @@
-{"version":3,"names":["useSnackbar","useTenantContext","AuthenticationContextFeature","useFeature","config","appConfig","Webiny","useCallback","useState","createCustomConsole","useCodeExecution","code","editorRef","output","setOutput","isRunning","setIsRunning","showSnackbar","tenant","authenticationContext","handleRun","apiUrl","getKey","process","env","REACT_APP_API_URL","currentCode","current","getValue","messages","customConsole","sdk","endpoint","undefined","token","getIdToken","wrappedCode","fn","Function","result","then","error"],"sources":["useCodeExecution.ts"],"sourcesContent":["import { useSnackbar, useTenantContext } from \"@webiny/app-admin\";\nimport { AuthenticationContextFeature } from \"@webiny/app-admin/features/security/AuthenticationContext/feature.js\";\nimport { useFeature } from \"@webiny/app\";\nimport { config as appConfig } from \"@webiny/app/config.js\";\nimport { Webiny } from \"@webiny/sdk\";\nimport type { editor } from \"monaco-editor\";\nimport type { MutableRefObject } from \"react\";\nimport { useCallback, useState } from \"react\";\nimport { createCustomConsole } from \"./consoleCapture.js\";\nimport type { ConsoleMessage } from \"./types.js\";\n\nexport function useCodeExecution(\n    code: string,\n    editorRef: MutableRefObject<editor.IStandaloneCodeEditor | null>\n) {\n    const [output, setOutput] = useState<ConsoleMessage[]>([]);\n    const [isRunning, setIsRunning] = useState(false);\n    const { showSnackbar } = useSnackbar();\n    const { tenant } = useTenantContext();\n    const { authenticationContext } = useFeature(AuthenticationContextFeature);\n\n    const handleRun = useCallback(async () => {\n        const apiUrl = appConfig.getKey(\"API_URL\", process.env.REACT_APP_API_URL) as string;\n        if (!apiUrl) {\n            showSnackbar(\"API URL is not configured\");\n            return;\n        }\n\n        const currentCode = editorRef.current?.getValue() || code;\n        setIsRunning(true);\n        setOutput([]);\n\n        const messages: ConsoleMessage[] = [];\n\n        // Create custom console for capturing output.\n        const customConsole = createCustomConsole(messages, setOutput);\n\n        try {\n            const sdk = new Webiny({\n                endpoint: apiUrl,\n                tenant: tenant || undefined,\n                token: () => authenticationContext.getIdToken() as Promise<string>\n            });\n\n            // Wrap code in async function to allow top-level await.\n            const wrappedCode = `\n                (async () => {\n                    try {\n                        ${currentCode}\n                    } catch (error) {\n                        console.error(\"Runtime error:\", error);\n                        throw error;\n                    }\n                })()\n            `;\n\n            // Create function with injected dependencies.\n            const fn = new Function(\"console\", \"sdk\", \"window\", wrappedCode);\n\n            // Execute with custom console and SDK.\n            const result = fn(customConsole, sdk, { sdk });\n\n            // Handle async results.\n            if (result && typeof result.then === \"function\") {\n                await result;\n            }\n        } catch (error) {\n            customConsole.error(\"Execution error:\", error);\n        } finally {\n            setIsRunning(false);\n        }\n    }, [code, editorRef, showSnackbar, tenant, authenticationContext]);\n\n    return {\n        output,\n        isRunning,\n        handleRun\n    };\n}\n"],"mappings":"AAAA,SAASA,WAAW,EAAEC,gBAAgB,QAAQ,mBAAmB;AACjE,SAASC,4BAA4B,QAAQ,sEAAsE;AACnH,SAASC,UAAU,QAAQ,aAAa;AACxC,SAASC,MAAM,IAAIC,SAAS,QAAQ,uBAAuB;AAC3D,SAASC,MAAM,QAAQ,aAAa;AAGpC,SAASC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AAC7C,SAASC,mBAAmB;AAG5B,OAAO,SAASC,gBAAgBA,CAC5BC,IAAY,EACZC,SAAgE,EAClE;EACE,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGN,QAAQ,CAAmB,EAAE,CAAC;EAC1D,MAAM,CAACO,SAAS,EAAEC,YAAY,CAAC,GAAGR,QAAQ,CAAC,KAAK,CAAC;EACjD,MAAM;IAAES;EAAa,CAAC,GAAGjB,WAAW,CAAC,CAAC;EACtC,MAAM;IAAEkB;EAAO,CAAC,GAAGjB,gBAAgB,CAAC,CAAC;EACrC,MAAM;IAAEkB;EAAsB,CAAC,GAAGhB,UAAU,CAACD,4BAA4B,CAAC;EAE1E,MAAMkB,SAAS,GAAGb,WAAW,CAAC,YAAY;IACtC,MAAMc,MAAM,GAAGhB,SAAS,CAACiB,MAAM,CAAC,SAAS,EAAEC,OAAO,CAACC,GAAG,CAACC,iBAAiB,CAAW;IACnF,IAAI,CAACJ,MAAM,EAAE;MACTJ,YAAY,CAAC,2BAA2B,CAAC;MACzC;IACJ;IAEA,MAAMS,WAAW,GAAGd,SAAS,CAACe,OAAO,EAAEC,QAAQ,CAAC,CAAC,IAAIjB,IAAI;IACzDK,YAAY,CAAC,IAAI,CAAC;IAClBF,SAAS,CAAC,EAAE,CAAC;IAEb,MAAMe,QAA0B,GAAG,EAAE;;IAErC;IACA,MAAMC,aAAa,GAAGrB,mBAAmB,CAACoB,QAAQ,EAAEf,SAAS,CAAC;IAE9D,IAAI;MACA,MAAMiB,GAAG,GAAG,IAAIzB,MAAM,CAAC;QACnB0B,QAAQ,EAAEX,MAAM;QAChBH,MAAM,EAAEA,MAAM,IAAIe,SAAS;QAC3BC,KAAK,EAAEA,CAAA,KAAMf,qBAAqB,CAACgB,UAAU,CAAC;MAClD,CAAC,CAAC;;MAEF;MACA,MAAMC,WAAW,GAAG;AAChC;AACA;AACA,0BAA0BV,WAAW;AACrC;AACA;AACA;AACA;AACA;AACA,aAAa;;MAED;MACA,MAAMW,EAAE,GAAG,IAAIC,QAAQ,CAAC,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAEF,WAAW,CAAC;;MAEhE;MACA,MAAMG,MAAM,GAAGF,EAAE,CAACP,aAAa,EAAEC,GAAG,EAAE;QAAEA;MAAI,CAAC,CAAC;;MAE9C;MACA,IAAIQ,MAAM,IAAI,OAAOA,MAAM,CAACC,IAAI,KAAK,UAAU,EAAE;QAC7C,MAAMD,MAAM;MAChB;IACJ,CAAC,CAAC,OAAOE,KAAK,EAAE;MACZX,aAAa,CAACW,KAAK,CAAC,kBAAkB,EAAEA,KAAK,CAAC;IAClD,CAAC,SAAS;MACNzB,YAAY,CAAC,KAAK,CAAC;IACvB;EACJ,CAAC,EAAE,CAACL,IAAI,EAAEC,SAAS,EAAEK,YAAY,EAAEC,MAAM,EAAEC,qBAAqB,CAAC,CAAC;EAElE,OAAO;IACHN,MAAM;IACNE,SAAS;IACTK;EACJ,CAAC;AACL","ignoreList":[]}
+{"version":3,"file":"plugins/useCodeExecution.js","sources":["../../src/plugins/useCodeExecution.ts"],"sourcesContent":["import { useSnackbar, useTenantContext } from \"@webiny/app-admin\";\nimport { AuthenticationContextFeature } from \"@webiny/app-admin/features/security/AuthenticationContext/feature.js\";\nimport { useFeature } from \"@webiny/app\";\nimport { config as appConfig } from \"@webiny/app/config.js\";\nimport { Webiny } from \"@webiny/sdk\";\nimport type { editor } from \"monaco-editor\";\nimport type { MutableRefObject } from \"react\";\nimport { useCallback, useState } from \"react\";\nimport { createCustomConsole } from \"./consoleCapture.js\";\nimport type { ConsoleMessage } from \"./types.js\";\n\nexport function useCodeExecution(\n    code: string,\n    editorRef: MutableRefObject<editor.IStandaloneCodeEditor | null>\n) {\n    const [output, setOutput] = useState<ConsoleMessage[]>([]);\n    const [isRunning, setIsRunning] = useState(false);\n    const { showSnackbar } = useSnackbar();\n    const { tenant } = useTenantContext();\n    const { authenticationContext } = useFeature(AuthenticationContextFeature);\n\n    const handleRun = useCallback(async () => {\n        const apiUrl = appConfig.getKey(\"API_URL\", process.env.REACT_APP_API_URL) as string;\n        if (!apiUrl) {\n            showSnackbar(\"API URL is not configured\");\n            return;\n        }\n\n        const currentCode = editorRef.current?.getValue() || code;\n        setIsRunning(true);\n        setOutput([]);\n\n        const messages: ConsoleMessage[] = [];\n\n        // Create custom console for capturing output.\n        const customConsole = createCustomConsole(messages, setOutput);\n\n        try {\n            const sdk = new Webiny({\n                endpoint: apiUrl,\n                tenant: tenant || undefined,\n                token: () => authenticationContext.getIdToken() as Promise<string>\n            });\n\n            // Wrap code in async function to allow top-level await.\n            const wrappedCode = `\n                (async () => {\n                    try {\n                        ${currentCode}\n                    } catch (error) {\n                        console.error(\"Runtime error:\", error);\n                        throw error;\n                    }\n                })()\n            `;\n\n            // Create function with injected dependencies.\n            const fn = new Function(\"console\", \"sdk\", \"window\", wrappedCode);\n\n            // Execute with custom console and SDK.\n            const result = fn(customConsole, sdk, { sdk });\n\n            // Handle async results.\n            if (result && typeof result.then === \"function\") {\n                await result;\n            }\n        } catch (error) {\n            customConsole.error(\"Execution error:\", error);\n        } finally {\n            setIsRunning(false);\n        }\n    }, [code, editorRef, showSnackbar, tenant, authenticationContext]);\n\n    return {\n        output,\n        isRunning,\n        handleRun\n    };\n}\n"],"names":["useCodeExecution","code","editorRef","output","setOutput","useState","isRunning","setIsRunning","showSnackbar","useSnackbar","tenant","useTenantContext","authenticationContext","useFeature","AuthenticationContextFeature","handleRun","useCallback","apiUrl","appConfig","process","currentCode","messages","customConsole","createCustomConsole","sdk","Webiny","undefined","wrappedCode","fn","Function","result","error"],"mappings":";;;;;;;AAWO,SAASA,iBACZC,IAAY,EACZC,SAAgE;IAEhE,MAAM,CAACC,QAAQC,UAAU,GAAGC,SAA2B,EAAE;IACzD,MAAM,CAACC,WAAWC,aAAa,GAAGF,SAAS;IAC3C,MAAM,EAAEG,YAAY,EAAE,GAAGC;IACzB,MAAM,EAAEC,MAAM,EAAE,GAAGC;IACnB,MAAM,EAAEC,qBAAqB,EAAE,GAAGC,WAAWC;IAE7C,MAAMC,YAAYC,YAAY;QAC1B,MAAMC,SAASC,OAAAA,MAAgB,CAAC,WAAWC,QAAQ,GAAG,CAAC,iBAAiB;QACxE,IAAI,CAACF,QAAQ,YACTT,aAAa;QAIjB,MAAMY,cAAclB,UAAU,OAAO,EAAE,cAAcD;QACrDM,aAAa;QACbH,UAAU,EAAE;QAEZ,MAAMiB,WAA6B,EAAE;QAGrC,MAAMC,gBAAgBC,oBAAoBF,UAAUjB;QAEpD,IAAI;YACA,MAAMoB,MAAM,IAAIC,OAAO;gBACnB,UAAUR;gBACV,QAAQP,UAAUgB;gBAClB,OAAO,IAAMd,sBAAsB,UAAU;YACjD;YAGA,MAAMe,cAAc,CAAC;;;wBAGT,EAAEP,YAAY;;;;;;YAM1B,CAAC;YAGD,MAAMQ,KAAK,IAAIC,SAAS,WAAW,OAAO,UAAUF;YAGpD,MAAMG,SAASF,GAAGN,eAAeE,KAAK;gBAAEA;YAAI;YAG5C,IAAIM,UAAU,AAAuB,cAAvB,OAAOA,OAAO,IAAI,EAC5B,MAAMA;QAEd,EAAE,OAAOC,OAAO;YACZT,cAAc,KAAK,CAAC,oBAAoBS;QAC5C,SAAU;YACNxB,aAAa;QACjB;IACJ,GAAG;QAACN;QAAMC;QAAWM;QAAcE;QAAQE;KAAsB;IAEjE,OAAO;QACHT;QACAG;QACAS;IACJ;AACJ"}

package/plugins/useMonacoEditor.js

@@ -1,54 +1,49 @@
 import { useCallback, useRef } from "react";
 import { SDK_GLOBAL_DECLARATION } from "./sdkGlobalDeclaration.js";
 import { defaultSdkCode } from "./defaultCode.js";
-export function useMonacoEditor(handleRun) {
-  const editorRef = useRef(null);
-
-  // Configure Monaco editor with SDK types.
-  const handleBeforeMount = useCallback(monaco => {
-    monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
-      target: monaco.languages.typescript.ScriptTarget.ES2020,
-      allowNonTsExtensions: true,
-      moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,
-      module: monaco.languages.typescript.ModuleKind.CommonJS,
-      noEmit: true,
-      esModuleInterop: true,
-      allowJs: true
-    });
-
-    // Single addExtraLib call with a pure script-mode string (no import/export).
-    // This makes TypeScript treat the file as an ambient script, so all
-    // declare statements become true globals visible to user code.
-    monaco.languages.typescript.typescriptDefaults.addExtraLib(SDK_GLOBAL_DECLARATION, "file:///sdk-globals.d.ts");
-  }, []);
-  const handleEditorDidMount = useCallback((ed, monaco) => {
-    editorRef.current = ed;
-
-    // Re-create the model with a file:/// URI so it lives in the same
-    // virtual FS namespace as the addExtraLib file, giving the TS
-    // language service full visibility into the ambient declarations.
-    const existingModel = ed.getModel();
-    const newModel = monaco.editor.createModel(existingModel?.getValue() ?? defaultSdkCode, "typescript", monaco.Uri.parse("file:///user-script.ts"));
-    ed.setModel(newModel);
-    existingModel?.dispose();
-    ed.addAction({
-      id: "run-code",
-      label: "Run Code",
-      keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.Enter],
-      run: () => {
-        void handleRun();
-      }
-    });
-  }, [handleRun]);
-  const handleFormat = useCallback(() => {
-    editorRef.current?.getAction("editor.action.formatDocument")?.run();
-  }, []);
-  return {
-    editorRef,
-    handleBeforeMount,
-    handleEditorDidMount,
-    handleFormat
-  };
+function useMonacoEditor(handleRun) {
+    const editorRef = useRef(null);
+    const handleBeforeMount = useCallback((monaco)=>{
+        monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
+            target: monaco.languages.typescript.ScriptTarget.ES2020,
+            allowNonTsExtensions: true,
+            moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,
+            module: monaco.languages.typescript.ModuleKind.CommonJS,
+            noEmit: true,
+            esModuleInterop: true,
+            allowJs: true
+        });
+        monaco.languages.typescript.typescriptDefaults.addExtraLib(SDK_GLOBAL_DECLARATION, "file:///sdk-globals.d.ts");
+    }, []);
+    const handleEditorDidMount = useCallback((ed, monaco)=>{
+        editorRef.current = ed;
+        const existingModel = ed.getModel();
+        const newModel = monaco.editor.createModel(existingModel?.getValue() ?? defaultSdkCode, "typescript", monaco.Uri.parse("file:///user-script.ts"));
+        ed.setModel(newModel);
+        existingModel?.dispose();
+        ed.addAction({
+            id: "run-code",
+            label: "Run Code",
+            keybindings: [
+                monaco.KeyMod.CtrlCmd | monaco.KeyCode.Enter
+            ],
+            run: ()=>{
+                handleRun();
+            }
+        });
+    }, [
+        handleRun
+    ]);
+    const handleFormat = useCallback(()=>{
+        editorRef.current?.getAction("editor.action.formatDocument")?.run();
+    }, []);
+    return {
+        editorRef,
+        handleBeforeMount,
+        handleEditorDidMount,
+        handleFormat
+    };
 }
+export { useMonacoEditor };
 
 //# sourceMappingURL=useMonacoEditor.js.map

package/plugins/useMonacoEditor.js.map

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useRef","SDK_GLOBAL_DECLARATION","defaultSdkCode","useMonacoEditor","handleRun","editorRef","handleBeforeMount","monaco","languages","typescript","typescriptDefaults","setCompilerOptions","target","ScriptTarget","ES2020","allowNonTsExtensions","moduleResolution","ModuleResolutionKind","NodeJs","module","ModuleKind","CommonJS","noEmit","esModuleInterop","allowJs","addExtraLib","handleEditorDidMount","ed","current","existingModel","getModel","newModel","editor","createModel","getValue","Uri","parse","setModel","dispose","addAction","id","label","keybindings","KeyMod","CtrlCmd","KeyCode","Enter","run","handleFormat","getAction"],"sources":["useMonacoEditor.ts"],"sourcesContent":["import { useCallback, useRef } from \"react\";\nimport type { OnMount, BeforeMount } from \"@monaco-editor/react\";\nimport type { editor } from \"monaco-editor\";\nimport { SDK_GLOBAL_DECLARATION } from \"./sdkGlobalDeclaration.js\";\nimport { defaultSdkCode } from \"./defaultCode.js\";\n\nexport function useMonacoEditor(handleRun: () => void) {\n    const editorRef = useRef<editor.IStandaloneCodeEditor | null>(null);\n\n    // Configure Monaco editor with SDK types.\n    const handleBeforeMount: BeforeMount = useCallback(monaco => {\n        monaco.languages.typescript.typescriptDefaults.setCompilerOptions({\n            target: monaco.languages.typescript.ScriptTarget.ES2020,\n            allowNonTsExtensions: true,\n            moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,\n            module: monaco.languages.typescript.ModuleKind.CommonJS,\n            noEmit: true,\n            esModuleInterop: true,\n            allowJs: true\n        });\n\n        // Single addExtraLib call with a pure script-mode string (no import/export).\n        // This makes TypeScript treat the file as an ambient script, so all\n        // declare statements become true globals visible to user code.\n        monaco.languages.typescript.typescriptDefaults.addExtraLib(\n            SDK_GLOBAL_DECLARATION,\n            \"file:///sdk-globals.d.ts\"\n        );\n    }, []);\n\n    const handleEditorDidMount: OnMount = useCallback(\n        (ed, monaco) => {\n            editorRef.current = ed;\n\n            // Re-create the model with a file:/// URI so it lives in the same\n            // virtual FS namespace as the addExtraLib file, giving the TS\n            // language service full visibility into the ambient declarations.\n            const existingModel = ed.getModel();\n            const newModel = monaco.editor.createModel(\n                existingModel?.getValue() ?? defaultSdkCode,\n                \"typescript\",\n                monaco.Uri.parse(\"file:///user-script.ts\")\n            );\n            ed.setModel(newModel);\n            existingModel?.dispose();\n\n            ed.addAction({\n                id: \"run-code\",\n                label: \"Run Code\",\n                keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.Enter],\n                run: () => {\n                    void handleRun();\n                }\n            });\n        },\n        [handleRun]\n    );\n\n    const handleFormat = useCallback(() => {\n        editorRef.current?.getAction(\"editor.action.formatDocument\")?.run();\n    }, []);\n\n    return {\n        editorRef,\n        handleBeforeMount,\n        handleEditorDidMount,\n        handleFormat\n    };\n}\n"],"mappings":"AAAA,SAASA,WAAW,EAAEC,MAAM,QAAQ,OAAO;AAG3C,SAASC,sBAAsB;AAC/B,SAASC,cAAc;AAEvB,OAAO,SAASC,eAAeA,CAACC,SAAqB,EAAE;EACnD,MAAMC,SAAS,GAAGL,MAAM,CAAsC,IAAI,CAAC;;EAEnE;EACA,MAAMM,iBAA8B,GAAGP,WAAW,CAACQ,MAAM,IAAI;IACzDA,MAAM,CAACC,SAAS,CAACC,UAAU,CAACC,kBAAkB,CAACC,kBAAkB,CAAC;MAC9DC,MAAM,EAAEL,MAAM,CAACC,SAAS,CAACC,UAAU,CAACI,YAAY,CAACC,MAAM;MACvDC,oBAAoB,EAAE,IAAI;MAC1BC,gBAAgB,EAAET,MAAM,CAACC,SAAS,CAACC,UAAU,CAACQ,oBAAoB,CAACC,MAAM;MACzEC,MAAM,EAAEZ,MAAM,CAACC,SAAS,CAACC,UAAU,CAACW,UAAU,CAACC,QAAQ;MACvDC,MAAM,EAAE,IAAI;MACZC,eAAe,EAAE,IAAI;MACrBC,OAAO,EAAE;IACb,CAAC,CAAC;;IAEF;IACA;IACA;IACAjB,MAAM,CAACC,SAAS,CAACC,UAAU,CAACC,kBAAkB,CAACe,WAAW,CACtDxB,sBAAsB,EACtB,0BACJ,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMyB,oBAA6B,GAAG3B,WAAW,CAC7C,CAAC4B,EAAE,EAAEpB,MAAM,KAAK;IACZF,SAAS,CAACuB,OAAO,GAAGD,EAAE;;IAEtB;IACA;IACA;IACA,MAAME,aAAa,GAAGF,EAAE,CAACG,QAAQ,CAAC,CAAC;IACnC,MAAMC,QAAQ,GAAGxB,MAAM,CAACyB,MAAM,CAACC,WAAW,CACtCJ,aAAa,EAAEK,QAAQ,CAAC,CAAC,IAAIhC,cAAc,EAC3C,YAAY,EACZK,MAAM,CAAC4B,GAAG,CAACC,KAAK,CAAC,wBAAwB,CAC7C,CAAC;IACDT,EAAE,CAACU,QAAQ,CAACN,QAAQ,CAAC;IACrBF,aAAa,EAAES,OAAO,CAAC,CAAC;IAExBX,EAAE,CAACY,SAAS,CAAC;MACTC,EAAE,EAAE,UAAU;MACdC,KAAK,EAAE,UAAU;MACjBC,WAAW,EAAE,CAACnC,MAAM,CAACoC,MAAM,CAACC,OAAO,GAAGrC,MAAM,CAACsC,OAAO,CAACC,KAAK,CAAC;MAC3DC,GAAG,EAAEA,CAAA,KAAM;QACP,KAAK3C,SAAS,CAAC,CAAC;MACpB;IACJ,CAAC,CAAC;EACN,CAAC,EACD,CAACA,SAAS,CACd,CAAC;EAED,MAAM4C,YAAY,GAAGjD,WAAW,CAAC,MAAM;IACnCM,SAAS,CAACuB,OAAO,EAAEqB,SAAS,CAAC,8BAA8B,CAAC,EAAEF,GAAG,CAAC,CAAC;EACvE,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO;IACH1C,SAAS;IACTC,iBAAiB;IACjBoB,oBAAoB;IACpBsB;EACJ,CAAC;AACL","ignoreList":[]}
+{"version":3,"file":"plugins/useMonacoEditor.js","sources":["../../src/plugins/useMonacoEditor.ts"],"sourcesContent":["import { useCallback, useRef } from \"react\";\nimport type { OnMount, BeforeMount } from \"@monaco-editor/react\";\nimport type { editor } from \"monaco-editor\";\nimport { SDK_GLOBAL_DECLARATION } from \"./sdkGlobalDeclaration.js\";\nimport { defaultSdkCode } from \"./defaultCode.js\";\n\nexport function useMonacoEditor(handleRun: () => void) {\n    const editorRef = useRef<editor.IStandaloneCodeEditor | null>(null);\n\n    // Configure Monaco editor with SDK types.\n    const handleBeforeMount: BeforeMount = useCallback(monaco => {\n        monaco.languages.typescript.typescriptDefaults.setCompilerOptions({\n            target: monaco.languages.typescript.ScriptTarget.ES2020,\n            allowNonTsExtensions: true,\n            moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,\n            module: monaco.languages.typescript.ModuleKind.CommonJS,\n            noEmit: true,\n            esModuleInterop: true,\n            allowJs: true\n        });\n\n        // Single addExtraLib call with a pure script-mode string (no import/export).\n        // This makes TypeScript treat the file as an ambient script, so all\n        // declare statements become true globals visible to user code.\n        monaco.languages.typescript.typescriptDefaults.addExtraLib(\n            SDK_GLOBAL_DECLARATION,\n            \"file:///sdk-globals.d.ts\"\n        );\n    }, []);\n\n    const handleEditorDidMount: OnMount = useCallback(\n        (ed, monaco) => {\n            editorRef.current = ed;\n\n            // Re-create the model with a file:/// URI so it lives in the same\n            // virtual FS namespace as the addExtraLib file, giving the TS\n            // language service full visibility into the ambient declarations.\n            const existingModel = ed.getModel();\n            const newModel = monaco.editor.createModel(\n                existingModel?.getValue() ?? defaultSdkCode,\n                \"typescript\",\n                monaco.Uri.parse(\"file:///user-script.ts\")\n            );\n            ed.setModel(newModel);\n            existingModel?.dispose();\n\n            ed.addAction({\n                id: \"run-code\",\n                label: \"Run Code\",\n                keybindings: [monaco.KeyMod.CtrlCmd | monaco.KeyCode.Enter],\n                run: () => {\n                    void handleRun();\n                }\n            });\n        },\n        [handleRun]\n    );\n\n    const handleFormat = useCallback(() => {\n        editorRef.current?.getAction(\"editor.action.formatDocument\")?.run();\n    }, []);\n\n    return {\n        editorRef,\n        handleBeforeMount,\n        handleEditorDidMount,\n        handleFormat\n    };\n}\n"],"names":["useMonacoEditor","handleRun","editorRef","useRef","handleBeforeMount","useCallback","monaco","SDK_GLOBAL_DECLARATION","handleEditorDidMount","ed","existingModel","newModel","defaultSdkCode","handleFormat"],"mappings":";;;AAMO,SAASA,gBAAgBC,SAAqB;IACjD,MAAMC,YAAYC,OAA4C;IAG9D,MAAMC,oBAAiCC,YAAYC,CAAAA;QAC/CA,OAAO,SAAS,CAAC,UAAU,CAAC,kBAAkB,CAAC,kBAAkB,CAAC;YAC9D,QAAQA,OAAO,SAAS,CAAC,UAAU,CAAC,YAAY,CAAC,MAAM;YACvD,sBAAsB;YACtB,kBAAkBA,OAAO,SAAS,CAAC,UAAU,CAAC,oBAAoB,CAAC,MAAM;YACzE,QAAQA,OAAO,SAAS,CAAC,UAAU,CAAC,UAAU,CAAC,QAAQ;YACvD,QAAQ;YACR,iBAAiB;YACjB,SAAS;QACb;QAKAA,OAAO,SAAS,CAAC,UAAU,CAAC,kBAAkB,CAAC,WAAW,CACtDC,wBACA;IAER,GAAG,EAAE;IAEL,MAAMC,uBAAgCH,YAClC,CAACI,IAAIH;QACDJ,UAAU,OAAO,GAAGO;QAKpB,MAAMC,gBAAgBD,GAAG,QAAQ;QACjC,MAAME,WAAWL,OAAO,MAAM,CAAC,WAAW,CACtCI,eAAe,cAAcE,gBAC7B,cACAN,OAAO,GAAG,CAAC,KAAK,CAAC;QAErBG,GAAG,QAAQ,CAACE;QACZD,eAAe;QAEfD,GAAG,SAAS,CAAC;YACT,IAAI;YACJ,OAAO;YACP,aAAa;gBAACH,OAAO,MAAM,CAAC,OAAO,GAAGA,OAAO,OAAO,CAAC,KAAK;aAAC;YAC3D,KAAK;gBACIL;YACT;QACJ;IACJ,GACA;QAACA;KAAU;IAGf,MAAMY,eAAeR,YAAY;QAC7BH,UAAU,OAAO,EAAE,UAAU,iCAAiC;IAClE,GAAG,EAAE;IAEL,OAAO;QACHA;QACAE;QACAI;QACAK;IACJ;AACJ"}

package/plugins/useResizableSplit.js

@@ -1,44 +1,41 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 import { MIN_PANE_PCT } from "./types.js";
-export function useResizableSplit() {
-  const splitRef = useRef(null);
-  const [editorPct, setEditorPct] = useState(60);
-  const isDragging = useRef(false);
-  const handleDividerMouseDown = useCallback(e => {
-    e.preventDefault();
-    isDragging.current = true;
-    document.body.style.cursor = "col-resize";
-    document.body.style.userSelect = "none";
-  }, []);
-  useEffect(() => {
-    const onMouseMove = e => {
-      if (!isDragging.current || !splitRef.current) {
-        return;
-      }
-      const rect = splitRef.current.getBoundingClientRect();
-      const pct = (e.clientX - rect.left) / rect.width * 100;
-      setEditorPct(Math.min(100 - MIN_PANE_PCT, Math.max(MIN_PANE_PCT, pct)));
+function useResizableSplit() {
+    const splitRef = useRef(null);
+    const [editorPct, setEditorPct] = useState(60);
+    const isDragging = useRef(false);
+    const handleDividerMouseDown = useCallback((e)=>{
+        e.preventDefault();
+        isDragging.current = true;
+        document.body.style.cursor = "col-resize";
+        document.body.style.userSelect = "none";
+    }, []);
+    useEffect(()=>{
+        const onMouseMove = (e)=>{
+            if (!isDragging.current || !splitRef.current) return;
+            const rect = splitRef.current.getBoundingClientRect();
+            const pct = (e.clientX - rect.left) / rect.width * 100;
+            setEditorPct(Math.min(100 - MIN_PANE_PCT, Math.max(MIN_PANE_PCT, pct)));
+        };
+        const onMouseUp = ()=>{
+            if (!isDragging.current) return;
+            isDragging.current = false;
+            document.body.style.cursor = "";
+            document.body.style.userSelect = "";
+        };
+        document.addEventListener("mousemove", onMouseMove);
+        document.addEventListener("mouseup", onMouseUp);
+        return ()=>{
+            document.removeEventListener("mousemove", onMouseMove);
+            document.removeEventListener("mouseup", onMouseUp);
+        };
+    }, []);
+    return {
+        splitRef,
+        editorPct,
+        handleDividerMouseDown
     };
-    const onMouseUp = () => {
-      if (!isDragging.current) {
-        return;
-      }
-      isDragging.current = false;
-      document.body.style.cursor = "";
-      document.body.style.userSelect = "";
-    };
-    document.addEventListener("mousemove", onMouseMove);
-    document.addEventListener("mouseup", onMouseUp);
-    return () => {
-      document.removeEventListener("mousemove", onMouseMove);
-      document.removeEventListener("mouseup", onMouseUp);
-    };
-  }, []);
-  return {
-    splitRef,
-    editorPct,
-    handleDividerMouseDown
-  };
 }
+export { useResizableSplit };
 
 //# sourceMappingURL=useResizableSplit.js.map

package/plugins/useResizableSplit.js.map

@@ -1 +1 @@
-{"version":3,"names":["useCallback","useEffect","useRef","useState","MIN_PANE_PCT","useResizableSplit","splitRef","editorPct","setEditorPct","isDragging","handleDividerMouseDown","e","preventDefault","current","document","body","style","cursor","userSelect","onMouseMove","rect","getBoundingClientRect","pct","clientX","left","width","Math","min","max","onMouseUp","addEventListener","removeEventListener"],"sources":["useResizableSplit.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport { MIN_PANE_PCT } from \"./types.js\";\n\nexport function useResizableSplit() {\n    const splitRef = useRef<HTMLDivElement | null>(null);\n    const [editorPct, setEditorPct] = useState(60);\n    const isDragging = useRef(false);\n\n    const handleDividerMouseDown = useCallback((e: React.MouseEvent) => {\n        e.preventDefault();\n        isDragging.current = true;\n        document.body.style.cursor = \"col-resize\";\n        document.body.style.userSelect = \"none\";\n    }, []);\n\n    useEffect(() => {\n        const onMouseMove = (e: MouseEvent) => {\n            if (!isDragging.current || !splitRef.current) {\n                return;\n            }\n            const rect = splitRef.current.getBoundingClientRect();\n            const pct = ((e.clientX - rect.left) / rect.width) * 100;\n            setEditorPct(Math.min(100 - MIN_PANE_PCT, Math.max(MIN_PANE_PCT, pct)));\n        };\n\n        const onMouseUp = () => {\n            if (!isDragging.current) {\n                return;\n            }\n            isDragging.current = false;\n            document.body.style.cursor = \"\";\n            document.body.style.userSelect = \"\";\n        };\n\n        document.addEventListener(\"mousemove\", onMouseMove);\n        document.addEventListener(\"mouseup\", onMouseUp);\n        return () => {\n            document.removeEventListener(\"mousemove\", onMouseMove);\n            document.removeEventListener(\"mouseup\", onMouseUp);\n        };\n    }, []);\n\n    return {\n        splitRef,\n        editorPct,\n        handleDividerMouseDown\n    };\n}\n"],"mappings":"AAAA,SAASA,WAAW,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAChE,SAASC,YAAY;AAErB,OAAO,SAASC,iBAAiBA,CAAA,EAAG;EAChC,MAAMC,QAAQ,GAAGJ,MAAM,CAAwB,IAAI,CAAC;EACpD,MAAM,CAACK,SAAS,EAAEC,YAAY,CAAC,GAAGL,QAAQ,CAAC,EAAE,CAAC;EAC9C,MAAMM,UAAU,GAAGP,MAAM,CAAC,KAAK,CAAC;EAEhC,MAAMQ,sBAAsB,GAAGV,WAAW,CAAEW,CAAmB,IAAK;IAChEA,CAAC,CAACC,cAAc,CAAC,CAAC;IAClBH,UAAU,CAACI,OAAO,GAAG,IAAI;IACzBC,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACC,MAAM,GAAG,YAAY;IACzCH,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACE,UAAU,GAAG,MAAM;EAC3C,CAAC,EAAE,EAAE,CAAC;EAENjB,SAAS,CAAC,MAAM;IACZ,MAAMkB,WAAW,GAAIR,CAAa,IAAK;MACnC,IAAI,CAACF,UAAU,CAACI,OAAO,IAAI,CAACP,QAAQ,CAACO,OAAO,EAAE;QAC1C;MACJ;MACA,MAAMO,IAAI,GAAGd,QAAQ,CAACO,OAAO,CAACQ,qBAAqB,CAAC,CAAC;MACrD,MAAMC,GAAG,GAAI,CAACX,CAAC,CAACY,OAAO,GAAGH,IAAI,CAACI,IAAI,IAAIJ,IAAI,CAACK,KAAK,GAAI,GAAG;MACxDjB,YAAY,CAACkB,IAAI,CAACC,GAAG,CAAC,GAAG,GAAGvB,YAAY,EAAEsB,IAAI,CAACE,GAAG,CAACxB,YAAY,EAAEkB,GAAG,CAAC,CAAC,CAAC;IAC3E,CAAC;IAED,MAAMO,SAAS,GAAGA,CAAA,KAAM;MACpB,IAAI,CAACpB,UAAU,CAACI,OAAO,EAAE;QACrB;MACJ;MACAJ,UAAU,CAACI,OAAO,GAAG,KAAK;MAC1BC,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACC,MAAM,GAAG,EAAE;MAC/BH,QAAQ,CAACC,IAAI,CAACC,KAAK,CAACE,UAAU,GAAG,EAAE;IACvC,CAAC;IAEDJ,QAAQ,CAACgB,gBAAgB,CAAC,WAAW,EAAEX,WAAW,CAAC;IACnDL,QAAQ,CAACgB,gBAAgB,CAAC,SAAS,EAAED,SAAS,CAAC;IAC/C,OAAO,MAAM;MACTf,QAAQ,CAACiB,mBAAmB,CAAC,WAAW,EAAEZ,WAAW,CAAC;MACtDL,QAAQ,CAACiB,mBAAmB,CAAC,SAAS,EAAEF,SAAS,CAAC;IACtD,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO;IACHvB,QAAQ;IACRC,SAAS;IACTG;EACJ,CAAC;AACL","ignoreList":[]}
+{"version":3,"file":"plugins/useResizableSplit.js","sources":["../../src/plugins/useResizableSplit.ts"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport { MIN_PANE_PCT } from \"./types.js\";\n\nexport function useResizableSplit() {\n    const splitRef = useRef<HTMLDivElement | null>(null);\n    const [editorPct, setEditorPct] = useState(60);\n    const isDragging = useRef(false);\n\n    const handleDividerMouseDown = useCallback((e: React.MouseEvent) => {\n        e.preventDefault();\n        isDragging.current = true;\n        document.body.style.cursor = \"col-resize\";\n        document.body.style.userSelect = \"none\";\n    }, []);\n\n    useEffect(() => {\n        const onMouseMove = (e: MouseEvent) => {\n            if (!isDragging.current || !splitRef.current) {\n                return;\n            }\n            const rect = splitRef.current.getBoundingClientRect();\n            const pct = ((e.clientX - rect.left) / rect.width) * 100;\n            setEditorPct(Math.min(100 - MIN_PANE_PCT, Math.max(MIN_PANE_PCT, pct)));\n        };\n\n        const onMouseUp = () => {\n            if (!isDragging.current) {\n                return;\n            }\n            isDragging.current = false;\n            document.body.style.cursor = \"\";\n            document.body.style.userSelect = \"\";\n        };\n\n        document.addEventListener(\"mousemove\", onMouseMove);\n        document.addEventListener(\"mouseup\", onMouseUp);\n        return () => {\n            document.removeEventListener(\"mousemove\", onMouseMove);\n            document.removeEventListener(\"mouseup\", onMouseUp);\n        };\n    }, []);\n\n    return {\n        splitRef,\n        editorPct,\n        handleDividerMouseDown\n    };\n}\n"],"names":["useResizableSplit","splitRef","useRef","editorPct","setEditorPct","useState","isDragging","handleDividerMouseDown","useCallback","e","document","useEffect","onMouseMove","rect","pct","Math","MIN_PANE_PCT","onMouseUp"],"mappings":";;AAGO,SAASA;IACZ,MAAMC,WAAWC,OAA8B;IAC/C,MAAM,CAACC,WAAWC,aAAa,GAAGC,SAAS;IAC3C,MAAMC,aAAaJ,OAAO;IAE1B,MAAMK,yBAAyBC,YAAY,CAACC;QACxCA,EAAE,cAAc;QAChBH,WAAW,OAAO,GAAG;QACrBI,SAAS,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG;QAC7BA,SAAS,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG;IACrC,GAAG,EAAE;IAELC,UAAU;QACN,MAAMC,cAAc,CAACH;YACjB,IAAI,CAACH,WAAW,OAAO,IAAI,CAACL,SAAS,OAAO,EACxC;YAEJ,MAAMY,OAAOZ,SAAS,OAAO,CAAC,qBAAqB;YACnD,MAAMa,MAAQL,AAAAA,CAAAA,EAAE,OAAO,GAAGI,KAAK,IAAG,IAAKA,KAAK,KAAK,GAAI;YACrDT,aAAaW,KAAK,GAAG,CAAC,MAAMC,cAAcD,KAAK,GAAG,CAACC,cAAcF;QACrE;QAEA,MAAMG,YAAY;YACd,IAAI,CAACX,WAAW,OAAO,EACnB;YAEJA,WAAW,OAAO,GAAG;YACrBI,SAAS,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG;YAC7BA,SAAS,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG;QACrC;QAEAA,SAAS,gBAAgB,CAAC,aAAaE;QACvCF,SAAS,gBAAgB,CAAC,WAAWO;QACrC,OAAO;YACHP,SAAS,mBAAmB,CAAC,aAAaE;YAC1CF,SAAS,mBAAmB,CAAC,WAAWO;QAC5C;IACJ,GAAG,EAAE;IAEL,OAAO;QACHhB;QACAE;QACAI;IACJ;AACJ"}

package/routes.js

@@ -1,9 +1,10 @@
 import { Route } from "@webiny/app-admin";
-export const Routes = {
-  SdkPlayground: new Route({
-    name: "SdkPlayground",
-    path: "/sdk-playground"
-  })
+const Routes = {
+    SdkPlayground: new Route({
+        name: "SdkPlayground",
+        path: "/sdk-playground"
+    })
 };
+export { Routes };
 
 //# sourceMappingURL=routes.js.map

package/routes.js.map

@@ -1 +1 @@
-{"version":3,"names":["Route","Routes","SdkPlayground","name","path"],"sources":["routes.ts"],"sourcesContent":["import { Route } from \"@webiny/app-admin\";\n\nexport const Routes = {\n    SdkPlayground: new Route({\n        name: \"SdkPlayground\",\n        path: \"/sdk-playground\"\n    })\n};\n"],"mappings":"AAAA,SAASA,KAAK,QAAQ,mBAAmB;AAEzC,OAAO,MAAMC,MAAM,GAAG;EAClBC,aAAa,EAAE,IAAIF,KAAK,CAAC;IACrBG,IAAI,EAAE,eAAe;IACrBC,IAAI,EAAE;EACV,CAAC;AACL,CAAC","ignoreList":[]}
+{"version":3,"file":"routes.js","sources":["../src/routes.ts"],"sourcesContent":["import { Route } from \"@webiny/app-admin\";\n\nexport const Routes = {\n    SdkPlayground: new Route({\n        name: \"SdkPlayground\",\n        path: \"/sdk-playground\"\n    })\n};\n"],"names":["Routes","Route"],"mappings":";AAEO,MAAMA,SAAS;IAClB,eAAe,IAAIC,MAAM;QACrB,MAAM;QACN,MAAM;IACV;AACJ"}