diff --git a/index.html b/index.html index 03054df..7d9edc9 100644 --- a/index.html +++ b/index.html @@ -16,12 +16,19 @@ width: 784px; min-height: 100px; } + + .MenuBar-LogoLink_embedded-Yljpv { + display: none; + } -
- +
+
+
+
+ \ No newline at end of file diff --git a/package.json b/package.json index bcdbea1..994e1cc 100644 --- a/package.json +++ b/package.json @@ -17,6 +17,7 @@ "license": "MIT", "dependencies": { "@kevisual/router": "0.0.9", + "@stackblitz/sdk": "^1.11.0", "@webcontainer/api": "^1.5.3", "clsx": "^2.1.1", "dayjs": "^1.11.13", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 820e33c..55d160e 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,6 +11,9 @@ importers: '@kevisual/router': specifier: 0.0.9 version: 0.0.9 + '@stackblitz/sdk': + specifier: ^1.11.0 + version: 1.11.0 '@webcontainer/api': specifier: ^1.5.3 version: 1.5.3 @@ -450,6 +453,9 @@ packages: cpu: [x64] os: [win32] + '@stackblitz/sdk@1.11.0': + resolution: {integrity: sha512-DFQGANNkEZRzFk1/rDP6TcFdM82ycHE+zfl9C/M/jXlH68jiqHWHFMQURLELoD8koxvu/eW5uhg94NSAZlYrUQ==} + '@tailwindcss/node@4.0.16': resolution: {integrity: sha512-T6IK79hoCFScxD5tRxWMtwqwSs4sT81Vw+YbzL7RZD0/Ndm4y5kboV7LdQ97YGH6udoOZyVT/uEfrnU2L5Nkog==} @@ -1360,6 +1366,8 @@ snapshots: '@rollup/rollup-win32-x64-msvc@4.34.8': optional: true + '@stackblitz/sdk@1.11.0': {} + '@tailwindcss/node@4.0.16': dependencies: enhanced-resolve: 5.18.1 diff --git a/src/demo2/index.ts b/src/demo2/index.ts new file mode 100644 index 0000000..e69de29 diff --git a/src/demo2/main.ts b/src/demo2/main.ts new file mode 100644 index 0000000..1087e64 --- /dev/null +++ b/src/demo2/main.ts @@ -0,0 +1,77 @@ +import sdk from '@stackblitz/sdk'; + +const main = async () => { + const vm = await sdk.embedProject( + 'editor', + { + files: { + 'index.html': `

Hello World

`, + 'style.css': `body { background-color: #f0f0f0; }`, + '.pkgignore': `node_modules`, + // '.env': `TEMP_TOKEN=1234567890`, + 'package.json': `{ + "scripts": { + "dev": "vite", + "build": "vite build", + "lint": "eslint ." + }, + "dependencies": { + "vite": "^6.0.0", + "@kevisual/envision-cli": "^0.0.32" + }, + "startCommand": "pnpm i && pnpm dev" + }`, + }, + title: 'Hello World', + template: 'node', + settings: {}, + }, + { + view: 'preview', + clickToLoad: true, + height: '500px', + width: '800px', + // hideDevTools: true, + // hideExplorer: true, + // hideNavigation: true, + }, + ); + await vm.applyFsDiff({ + create: { + // '.env': `TEMP_TOKEN=1234567890`, + 'b.txt': `#!/bin/jsh +echo "Hello, World!" +`, + }, + destroy: [], + }); + const iframe = document.querySelector('iframe'); + // @ts-ignore + window.vm = vm; + iframe?.addEventListener('load', () => { + // vm.postMessage('hello', '*'); + const noTagLinks = document.createElement('style'); + noTagLinks.innerHTML = ` + .MenuBar-LogoLink_embedded-Yljpv { + display: none; + } + `; + iframe?.contentWindow?.document.appendChild(noTagLinks); + console.log(iframe?.contentWindow?.document); + }); +}; +// main(); +// const actions = document.getElementById('actions'); +// actions?.addEventListener('click', () => { +// main(); +// }); + +const main2 = async () => { + const vm = await sdk.embedProjectId('editor', 'sb1-j7dqwtjx'); + setTimeout(async () => { + // vm.postMessage('hello', '*'); + const res = await vm.getFsSnapshot(); + console.log(res); + }, 1000); +}; +main2(); diff --git a/vite.config.ts b/vite.config.ts index e23ed5b..894d9b3 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -31,8 +31,8 @@ export default defineConfig({ port: 7004, host: '0.0.0.0', headers: { - 'Cross-Origin-Embedder-Policy': 'require-corp', - 'Cross-Origin-Opener-Policy': 'same-origin', + // 'Cross-Origin-Embedder-Policy': 'require-corp', + // 'Cross-Origin-Opener-Policy': 'same-origin', }, proxy: { '/api': {