Merge pull request #64 from wu-component/feat/new

feat:deploy playground
wu-component · Oct 30, 2022 · e8d77b8 · e8d77b8
2 parents a8fcc41 + ddfab46
commit e8d77b8
Show file tree

Hide file tree

Showing 79 changed files with 207 additions and 671 deletions.
diff --git a/component/packages/wu-code-monaco-editor/src/index.tsx b/component/packages/wu-code-monaco-editor/src/index.tsx
@@ -55,14 +55,12 @@ export class WuCodeMonacoEditor extends WuComponent implements OnConnected {
                 const file = new File([ u8arr ], `initialSrcTs.tsx`, {
                     type: "text/plain"
                 });
-                console.log(file);
                 const reader = new FileReader();
                 reader.onload = ()=> {
                     // 语句是为了显示内容换行
                     // @ts-ignore
                     /*const str = reader.result?.replace(/\n/g,"<br/>");
                     console.log(str);*/
-                    console.log(reader.result);
                     resolve(reader.result as string);
                 };
                 reader.readAsText(file,'utf-8');

diff --git a/...t/packages/wu-monaco-editor/.editorconfig → ...packages/wu-code-playground/.editorconfig b/...t/packages/wu-monaco-editor/.editorconfig → ...packages/wu-code-playground/.editorconfig
diff --git a/...t/packages/wu-monaco-editor/.eslintignore → ...packages/wu-code-playground/.eslintignore b/...t/packages/wu-monaco-editor/.eslintignore → ...packages/wu-code-playground/.eslintignore
diff --git a/...nt/packages/wu-monaco-editor/.eslintrc.js → .../packages/wu-code-playground/.eslintrc.js b/...nt/packages/wu-monaco-editor/.eslintrc.js → .../packages/wu-code-playground/.eslintrc.js
diff --git a/...ent/packages/wu-monaco-editor/.prettierrc → ...t/packages/wu-code-playground/.prettierrc b/...ent/packages/wu-monaco-editor/.prettierrc → ...t/packages/wu-code-playground/.prettierrc
diff --git a/...naco-editor/build/webpack_build.config.js → ...-playground/build/webpack_build.config.js b/...naco-editor/build/webpack_build.config.js → ...-playground/build/webpack_build.config.js
diff --git a/...aco-editor/build/webpack_common.config.js → ...playground/build/webpack_common.config.js b/...aco-editor/build/webpack_common.config.js → ...playground/build/webpack_common.config.js
diff --git a/...monaco-editor/build/webpack_dev.config.js → ...de-playground/build/webpack_dev.config.js b/...monaco-editor/build/webpack_dev.config.js → ...de-playground/build/webpack_dev.config.js
diff --git a/component/packages/wu-code-playground/deplpy/playground-2022-10-30.html b/component/packages/wu-code-playground/deplpy/playground-2022-10-30.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>wu-component-playground</title>
+    <style>
+        html {
+            width: 100vw;height:100vh;
+        }
+    </style>
+    <!--<script src="https://unpkg.com/@wu-component/web-core-plus"></script>-->
+    <script src="https://cdn.canyuegongzi.xyz/wu-code-playground/static/core/index.umd.js"></script>
+    <script src="https://cdn.canyuegongzi.xyz/wu-code-playground/static/code_editor/index.umd.js"></script>
+    <script src="https://cdn.canyuegongzi.xyz/wu-code-playground/static/sandbox/index.umd.js"></script>
+</head>
+    <body style="width: 100%;height: 100%;margin: 0;">
+        <wu-code-playground style="width: 100%;height: 100%"></wu-code-playground>
+    </body>
+    <script src="https://cdn.canyuegongzi.xyz/wu-code-playground/static/playground/index.umd.js"></script>
+</html>
diff --git a/component/packages/wu-code-playground/deplpy/static/code_editor/index.umd.js b/component/packages/wu-code-playground/deplpy/static/code_editor/index.umd.js
diff --git a/component/packages/wu-code-playground/deplpy/static/core/index.umd.js b/component/packages/wu-code-playground/deplpy/static/core/index.umd.js
diff --git a/component/packages/wu-code-playground/deplpy/static/playground/index.umd.js b/component/packages/wu-code-playground/deplpy/static/playground/index.umd.js
diff --git a/component/packages/wu-code-playground/deplpy/static/sandbox/index.umd.js b/component/packages/wu-code-playground/deplpy/static/sandbox/index.umd.js
diff --git a/...nent/packages/wu-monaco-editor/index.html → ...nt/packages/wu-code-playground/index.html b/...nent/packages/wu-monaco-editor/index.html → ...nt/packages/wu-code-playground/index.html
@@ -8,12 +8,13 @@
             width: 100vw;height:100vh;
         }
     </style>
+    <script src="https://unpkg.com/@wu-component/web-core-plus"></script>
+    <script src="./public/code_editor/index.umd.js"></script>
+    <script src="./public/sandbox/index.umd.js"></script>
 </head>
 <body style="width: 100%;height: 100%;margin: 0;">
     <wu-code-playground style="width: 100%;height: 100%"></wu-code-playground>
 </body>
-<script src="./public/co/index.umd.js"></script>
-<script src="./public/si/index.umd.js"></script>
 <script src="./dist/index.umd.js"></script>
 </body>
 </html>
diff --git a/...kages/wu-monaco-editor/nodemon-debug.json → ...ges/wu-code-playground/nodemon-debug.json b/...kages/wu-monaco-editor/nodemon-debug.json → ...ges/wu-code-playground/nodemon-debug.json
diff --git a/...nt/packages/wu-monaco-editor/nodemon.json → .../packages/wu-code-playground/nodemon.json b/...nt/packages/wu-monaco-editor/nodemon.json → .../packages/wu-code-playground/nodemon.json
diff --git a/...ckages/wu-monaco-editor/package-lock.json → ...ages/wu-code-playground/package-lock.json b/...ckages/wu-monaco-editor/package-lock.json → ...ages/wu-code-playground/package-lock.json
diff --git a/...nt/packages/wu-monaco-editor/package.json → .../packages/wu-code-playground/package.json b/...nt/packages/wu-monaco-editor/package.json → .../packages/wu-code-playground/package.json
diff --git a/component/packages/wu-code-playground/public/code_editor/index.umd.js b/component/packages/wu-code-playground/public/code_editor/index.umd.js
diff --git a/...ckages/wu-monaco-editor/public/index.html → ...ages/wu-code-playground/public/index.html b/...ckages/wu-monaco-editor/public/index.html → ...ages/wu-code-playground/public/index.html
@@ -8,8 +8,9 @@
             width: 100vw;height:100vh;
         }
     </style>
-    <script src="./co/index.umd.js"></script>
-    <script src="./si/index.umd.js"></script>
+    <script src="https://unpkg.com/@wu-component/web-core-plus@0.3.3/dist/index.umd.js"></script>
+    <script src="./code_editor/index.umd.js"></script>
+    <script src="./sandbox/index.umd.js"></script>
 </head>
 <body style="width: 100%;height: 100%;margin: 0;">
     <wu-code-playground style="width: 100%;height: 100%"></wu-code-playground>

diff --git a/component/packages/wu-code-playground/public/sandbox/index.umd.js b/component/packages/wu-code-playground/public/sandbox/index.umd.js
diff --git a/...onent/packages/wu-monaco-editor/readme.md → ...ent/packages/wu-code-playground/readme.md b/...onent/packages/wu-monaco-editor/readme.md → ...ent/packages/wu-code-playground/readme.md
diff --git a/component/packages/wu-code-playground/src/core/index.ts b/component/packages/wu-code-playground/src/core/index.ts
@@ -0,0 +1 @@
+export * from './options';
diff --git a/...ages/wu-monaco-editor/src/core/options.ts → ...es/wu-code-playground/src/core/options.ts b/...ages/wu-monaco-editor/src/core/options.ts → ...es/wu-code-playground/src/core/options.ts
diff --git a/...s/wu-monaco-editor/src/core/typescript.ts → ...wu-code-playground/src/core/typescript.ts b/...s/wu-monaco-editor/src/core/typescript.ts → ...wu-code-playground/src/core/typescript.ts
diff --git a/.../packages/wu-monaco-editor/src/index.scss → ...ackages/wu-code-playground/src/index.scss b/.../packages/wu-monaco-editor/src/index.scss → ...ackages/wu-code-playground/src/index.scss
diff --git a/...t/packages/wu-monaco-editor/src/index.tsx → ...packages/wu-code-playground/src/index.tsx b/...t/packages/wu-monaco-editor/src/index.tsx → ...packages/wu-code-playground/src/index.tsx
@@ -1,9 +1,11 @@
 import { Component, h, OnConnected, Prop, WuComponent } from '@wu-component/web-core-plus';
 import css from './index.scss';
 import { compileTS } from "./core/typescript";
-import type { WuMonacoEditor } from "./editor";
-import type { WuMonacoEditorPreview } from "./preview";
-import srcdoc from './srcdoc.txt';
+// import "../../wu-code-monaco-editor/src/index";
+// import "../../wu-code-sandbox/src/index";
+import type { WuCodeMonacoEditor } from "../../wu-code-monaco-editor/types";
+import type { WuMonacoEditorPreview } from "../../wu-code-sandbox/types";
+import srcdoc from './srcdoc.html';
 import initialSrcTs from './initialSrcTs.txt';
 
 @Component({
@@ -18,7 +20,7 @@ export class WuCodePlayground extends WuComponent implements OnConnected {
     @Prop({ default: '', type: String })
     public name: string;
 
-    public editorContainer: WuMonacoEditor = null;
+    public editorContainer: WuCodeMonacoEditor = null;
     public previewContainer: WuMonacoEditorPreview = null;
 
     public initialEvalSuccess = false;

diff --git a/...ges/wu-monaco-editor/src/initialSrcTs.txt → ...s/wu-code-playground/src/initialSrcTs.txt b/...ges/wu-monaco-editor/src/initialSrcTs.txt → ...s/wu-code-playground/src/initialSrcTs.txt
diff --git a/.../packages/wu-monaco-editor/src/srcdoc.txt → ...ckages/wu-code-playground/src/srcdoc.html b/.../packages/wu-monaco-editor/src/srcdoc.txt → ...ckages/wu-code-playground/src/srcdoc.html
diff --git a/...onaco-editor/src/utils/addDragListener.ts → ...e-playground/src/utils/addDragListener.ts b/...onaco-editor/src/utils/addDragListener.ts → ...e-playground/src/utils/addDragListener.ts
diff --git a/...es/wu-monaco-editor/src/utils/debounce.ts → .../wu-code-playground/src/utils/debounce.ts b/...es/wu-monaco-editor/src/utils/debounce.ts → .../wu-code-playground/src/utils/debounce.ts
diff --git a/...s/wu-monaco-editor/src/utils/enClosure.ts → ...wu-code-playground/src/utils/enClosure.ts b/...s/wu-monaco-editor/src/utils/enClosure.ts → ...wu-code-playground/src/utils/enClosure.ts
diff --git a/...aco-editor/src/utils/getReferencePaths.ts → ...playground/src/utils/getReferencePaths.ts b/...aco-editor/src/utils/getReferencePaths.ts → ...playground/src/utils/getReferencePaths.ts
diff --git a/...kages/wu-monaco-editor/src/utils/index.ts → ...ges/wu-code-playground/src/utils/index.ts b/...kages/wu-monaco-editor/src/utils/index.ts → ...ges/wu-code-playground/src/utils/index.ts
diff --git a/...wu-monaco-editor/src/utils/resolvePath.ts → ...-code-playground/src/utils/resolvePath.ts b/...wu-monaco-editor/src/utils/resolvePath.ts → ...-code-playground/src/utils/resolvePath.ts
diff --git a/...kages/wu-monaco-editor/test/index.test.js → ...ges/wu-code-playground/test/index.test.js b/...kages/wu-monaco-editor/test/index.test.js → ...ges/wu-code-playground/test/index.test.js
diff --git a/...ages/wu-monaco-editor/tsconfig.build.json → ...es/wu-code-playground/tsconfig.build.json b/...ages/wu-monaco-editor/tsconfig.build.json → ...es/wu-code-playground/tsconfig.build.json
diff --git a/...t/packages/wu-monaco-editor/tsconfig.json → ...packages/wu-code-playground/tsconfig.json b/...t/packages/wu-monaco-editor/tsconfig.json → ...packages/wu-code-playground/tsconfig.json
diff --git a/component/packages/wu-code-playground/types/core/index.d.ts b/component/packages/wu-code-playground/types/core/index.d.ts
@@ -0,0 +1 @@
+export * from './options';
diff --git a/.../wu-monaco-editor/types/core/options.d.ts → ...u-code-playground/types/core/options.d.ts b/.../wu-monaco-editor/types/core/options.d.ts → ...u-code-playground/types/core/options.d.ts
diff --git a/...-monaco-editor/types/core/typescript.d.ts → ...ode-playground/types/core/typescript.d.ts b/...-monaco-editor/types/core/typescript.d.ts → ...ode-playground/types/core/typescript.d.ts
diff --git a/.../packages/wu-monaco-editor/types/css.d.ts → ...ackages/wu-code-playground/types/css.d.ts b/.../packages/wu-monaco-editor/types/css.d.ts → ...ackages/wu-code-playground/types/css.d.ts
diff --git a/...ckages/wu-monaco-editor/types/global.d.ts → ...ages/wu-code-playground/types/global.d.ts b/...ckages/wu-monaco-editor/types/global.d.ts → ...ages/wu-code-playground/types/global.d.ts
diff --git a/...ackages/wu-monaco-editor/types/index.d.ts → ...kages/wu-code-playground/types/index.d.ts b/...ackages/wu-monaco-editor/types/index.d.ts → ...kages/wu-code-playground/types/index.d.ts
@@ -1,10 +1,10 @@
 import { OnConnected, WuComponent } from '@wu-component/web-core-plus';
-import type { WuMonacoEditor } from "./editor";
-import type { WuMonacoEditorPreview } from "./preview";
+import type { WuCodeMonacoEditor } from "../../wu-code-monaco-editor/types";
+import type { WuMonacoEditorPreview } from "../../wu-code-sandbox/types";
 export declare class WuCodePlayground extends WuComponent implements OnConnected {
     constructor();
     name: string;
-    editorContainer: WuMonacoEditor;
+    editorContainer: WuCodeMonacoEditor;
     previewContainer: WuMonacoEditorPreview;
     initialEvalSuccess: boolean;
     connected(shadowRoot: ShadowRoot): void;

diff --git a/...o-editor/types/utils/addDragListener.d.ts → ...ayground/types/utils/addDragListener.d.ts b/...o-editor/types/utils/addDragListener.d.ts → ...ayground/types/utils/addDragListener.d.ts
diff --git a/...u-monaco-editor/types/utils/debounce.d.ts → ...code-playground/types/utils/debounce.d.ts b/...u-monaco-editor/types/utils/debounce.d.ts → ...code-playground/types/utils/debounce.d.ts
diff --git a/...-monaco-editor/types/utils/enClosure.d.ts → ...ode-playground/types/utils/enClosure.d.ts b/...-monaco-editor/types/utils/enClosure.d.ts → ...ode-playground/types/utils/enClosure.d.ts
diff --git a/...editor/types/utils/getReferencePaths.d.ts → ...ground/types/utils/getReferencePaths.d.ts b/...editor/types/utils/getReferencePaths.d.ts → ...ground/types/utils/getReferencePaths.d.ts
diff --git a/...s/wu-monaco-editor/types/utils/index.d.ts → ...wu-code-playground/types/utils/index.d.ts b/...s/wu-monaco-editor/types/utils/index.d.ts → ...wu-code-playground/types/utils/index.d.ts
diff --git a/...onaco-editor/types/utils/resolvePath.d.ts → ...e-playground/types/utils/resolvePath.d.ts b/...onaco-editor/types/utils/resolvePath.d.ts → ...e-playground/types/utils/resolvePath.d.ts
diff --git a/.../packages/wu-monaco-editor/yarn-error.log → ...ackages/wu-code-playground/yarn-error.log b/.../packages/wu-monaco-editor/yarn-error.log → ...ackages/wu-code-playground/yarn-error.log
diff --git a/component/packages/wu-code-sandbox/index.html b/component/packages/wu-code-sandbox/index.html
@@ -9,6 +9,7 @@
             margin: 0;
         }
     </style>
+    <script src="https://unpkg.com/@wu-component/web-core-plus@0.3.6/dist/index.umd.js"></script>
 </head>
 <body style="width: 100%;height: 100%;margin: 0;">
 <wu-code-sandbox style="width: 100%;height: 100%"></wu-code-sandbox>

diff --git a/component/packages/wu-code-sandbox/src/index.tsx b/component/packages/wu-code-sandbox/src/index.tsx
@@ -1,8 +1,8 @@
-import { Component, h, OnConnected, Prop, WuComponent } from "@wu-component/web-core-plus";
+import { Component, Emit, h, OnConnected, Prop, WuComponent } from "@wu-component/web-core-plus";
 import css from './index.scss';
 import { PreviewProxy, LoadDependencies } from "./sandbox";
 import { Store } from "./Store";
-import srcdoc from './srcdoc.txt';
+import srcdoc from './srcdoc.html';
 
 @Component({
     name: 'wu-code-sandbox',
@@ -77,25 +77,35 @@ export class WuMonacoEditorPreview extends WuComponent implements OnConnected {
         // 示例话沙箱代理
         this.proxy = new PreviewProxy(this.container, {
             on_fetch_progress: (progress: any) => {
+                // this.emitEvent(progress);
                 // pending_imports = progress;
             },
             on_error: (event: any) => {
+                // this.emitEvent(event);
                 console.log("on_error", event);
             },
             on_unhandled_rejection: (event: any) => {
+                // this.emitEvent(event);
                 console.log("on_unhandled_rejection", event);
             },
             on_console: (log: any) => {
+                // this.emitEvent(log);
                 console.log("log", log);
             },
             on_console_group: (action: any) => {
+                // this.emitEvent(action);
                 // group_logs(action.label, false);
             },
-            on_console_group_end: () => {
+            on_console_group_end: (event: any) => {
+                // this.emitEvent(event);
                 // ungroup_logs();
             },
             on_console_group_collapsed: (action: any) => {
+                // this.emitEvent(event);
                 // group_logs(action.label, true);
+            },
+            on_default_event: (event: any) => {
+                this.emitEvent(event);
             }
         });
         // 沙箱实例完成
@@ -131,10 +141,22 @@ export class WuMonacoEditorPreview extends WuComponent implements OnConnected {
 
     }
 
+    /**
+     * 沙箱加载依赖
+     * @param options
+     */
     public loadDependencies(options: LoadDependencies) {
         return this.proxy.load_depend(options);
     }
 
+    @Emit("message")
+    public emitEvent(data: any) {
+        return {
+            data: data || {}
+        };
+
+    }
+
     public override render(_renderProps = {}, _store = {}) {
         const sandbox = () => [ 'allow-forms', 'allow-modals', 'allow-pointer-lock', 'allow-popups',  'allow-same-origin', 'allow-scripts', 'allow-top-navigation-by-user-activation' ].join(' ');
         return (

diff --git a/component/packages/wu-code-sandbox/src/sandbox/PreviewProxy.ts b/component/packages/wu-code-sandbox/src/sandbox/PreviewProxy.ts
@@ -68,7 +68,7 @@ export class PreviewProxy {
         if (event.source !== this.iframe.contentWindow) return;
 
         const { action, args } = event.data;
-
+        this.handlers.on_default_event(event);
         switch (action) {
             case 'cmd_error':
             case 'cmd_ok':

diff --git a/...t/packages/wu-code-sandbox/src/srcdoc.txt → .../packages/wu-code-sandbox/src/srcdoc.html b/...t/packages/wu-code-sandbox/src/srcdoc.txt → .../packages/wu-code-sandbox/src/srcdoc.html
diff --git a/component/packages/wu-code-sandbox/types/index.d.ts b/component/packages/wu-code-sandbox/types/index.d.ts
@@ -16,6 +16,13 @@ export declare class WuMonacoEditorPreview extends WuComponent implements OnConn
      * @param code
      */
     runCode(type: string, code: string): void;
+    /**
+     * 沙箱加载依赖
+     * @param options
+     */
     loadDependencies(options: LoadDependencies): Promise<unknown>;
+    emitEvent(data: any): {
+        data: any;
+    };
     render(_renderProps?: {}, _store?: {}): any;
 }
diff --git a/component/packages/wu-monaco-editor/public/co/index.umd.js b/component/packages/wu-monaco-editor/public/co/index.umd.js
diff --git a/component/packages/wu-monaco-editor/public/si/index.umd.js b/component/packages/wu-monaco-editor/public/si/index.umd.js
diff --git a/component/packages/wu-monaco-editor/src/core/createEditor.ts b/component/packages/wu-monaco-editor/src/core/createEditor.ts
diff --git a/component/packages/wu-monaco-editor/src/core/index.ts b/component/packages/wu-monaco-editor/src/core/index.ts
diff --git a/component/packages/wu-monaco-editor/src/core/monaco.ts b/component/packages/wu-monaco-editor/src/core/monaco.ts
diff --git a/component/packages/wu-monaco-editor/src/editor/index.scss b/component/packages/wu-monaco-editor/src/editor/index.scss
diff --git a/component/packages/wu-monaco-editor/src/editor/index.tsx b/component/packages/wu-monaco-editor/src/editor/index.tsx
diff --git a/component/packages/wu-monaco-editor/src/preview/Store.ts b/component/packages/wu-monaco-editor/src/preview/Store.ts