From 65b21f3594d6f584d3b97bc0057453489dbb8408 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=AA=86=E6=B2=9B?= Date: Mon, 25 Sep 2023 17:15:13 +0800 Subject: [PATCH 1/3] =?UTF-8?q?feat(Doc):=20=E6=96=B0=E5=A2=9E=20CodeSandb?= =?UTF-8?q?ox=20=E6=94=AF=E6=8C=81?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 3 +- site/plugin-doc/demo.js | 1 + .../codeSandbox/getCodeSandboxParams.js | 77 +++++++++++++++++++ site/src/components/codeSandbox/index.vue | 63 +++++++++++++++ site/src/main.js | 2 + src/_common | 2 +- 6 files changed, 146 insertions(+), 2 deletions(-) create mode 100644 site/src/components/codeSandbox/getCodeSandboxParams.js create mode 100644 site/src/components/codeSandbox/index.vue diff --git a/package.json b/package.json index 391d9447b7..0800161a37 100644 --- a/package.json +++ b/package.json @@ -91,6 +91,7 @@ "@types/sortablejs": "^1.15.1", "@types/tinycolor2": "^1.4.3", "@types/validator": "^13.7.17", + "codesandbox": "^2.2.3", "dayjs": "^1.11.9", "lodash": "^4.17.21", "mitt": "^3.0.1", @@ -203,4 +204,4 @@ "attributes": "helper/attributes.json" }, "web-types": "helper/web-types.json" -} \ No newline at end of file +} diff --git a/site/plugin-doc/demo.js b/site/plugin-doc/demo.js index 728d257968..83c91279d7 100644 --- a/site/plugin-doc/demo.js +++ b/site/plugin-doc/demo.js @@ -17,6 +17,7 @@ export default function renderDemo(md, container) { const tpl = `
+
diff --git a/site/src/components/codeSandbox/getCodeSandboxParams.js b/site/src/components/codeSandbox/getCodeSandboxParams.js new file mode 100644 index 0000000000..3e5dd943a8 --- /dev/null +++ b/site/src/components/codeSandbox/getCodeSandboxParams.js @@ -0,0 +1,77 @@ +import { getParameters } from 'codesandbox/lib/api/define'; +import orgPkg from '../../../../package.json'; + +const indexHtml = ` + + + TDesign Demo + + +
+ + +`; + +const App = ` + + +`; + +const mainJs = `import { createApp } from 'vue'; +import TDesign from 'tdesign-vue-next'; +import App from './App.vue'; +import 'tdesign-vue-next/es/style/index.css'; + +const app = createApp(App) +app.use(TDesign); +app.mount("#app"); +`; + +export function getCodeSandboxParams(code, meta) { + return getParameters({ + files: { + 'package.json': { + content: JSON.stringify({ + title: meta.title, + dependencies: { + vue: orgPkg.devDependencies.vue, + less: orgPkg.devDependencies.less, + 'tdesign-vue-next': orgPkg.version, + 'tdesign-icons-vue-next': orgPkg.dependencies['tdesign-icons-vue-next'], + }, + devDependencies: { + '@vue/cli-plugin-babel': '~4.5.0', + }, + }), + isBinary: false, + }, + 'index.html': { + content: indexHtml, + isBinary: false, + }, + 'src/Demo.vue': { + content: code, + isBinary: false, + }, + 'src/App.vue': { + content: App, + isBinary: false, + }, + 'src/main.js': { + content: mainJs, + isBinary: false, + }, + }, + }); +} diff --git a/site/src/components/codeSandbox/index.vue b/site/src/components/codeSandbox/index.vue new file mode 100644 index 0000000000..be42919a65 --- /dev/null +++ b/site/src/components/codeSandbox/index.vue @@ -0,0 +1,63 @@ + + + + + diff --git a/site/src/main.js b/site/src/main.js index d9843dd2f3..0c89cc8550 100644 --- a/site/src/main.js +++ b/site/src/main.js @@ -4,6 +4,7 @@ import App from './app.vue'; import router from './routes'; import Stackblitz from './components/stackblitz/index.vue'; +import CodeSandbox from './components/codeSandbox/index.vue'; import BaseUsage from './components/base-usage.vue'; // import tdesign style @@ -27,6 +28,7 @@ registerLocaleChange(); const app = createApp(App); app.component('Stackblitz', Stackblitz); +app.component('CodeSandbox', CodeSandbox); app.component('BaseUsage', BaseUsage); app.use(TDesign).use(router).mount('#app'); diff --git a/src/_common b/src/_common index 02a9d42cdc..de01dcf0da 160000 --- a/src/_common +++ b/src/_common @@ -1 +1 @@ -Subproject commit 02a9d42cdc64416e33c17007ef9fbe37f607c3f6 +Subproject commit de01dcf0dac68ad2a8309951ce021ec101381683 From b2eb15c83657837d397b85ca2a48d3ca49bd0cbd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=AA=86=E6=B2=9B?= Date: Tue, 26 Sep 2023 11:18:45 +0800 Subject: [PATCH 2/3] =?UTF-8?q?refactor(Doc):=20=E8=B0=83=E6=95=B4codesand?= =?UTF-8?q?box=E6=8C=89=E9=92=AE=E4=BD=8D=E7=BD=AE?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- site/plugin-doc/demo.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/plugin-doc/demo.js b/site/plugin-doc/demo.js index 83c91279d7..cc357a71ec 100644 --- a/site/plugin-doc/demo.js +++ b/site/plugin-doc/demo.js @@ -17,8 +17,8 @@ export default function renderDemo(md, container) { const tpl = `
- +
<${demoDefName} /> From a763b5be42a3a84acf912e418f1f9e7c49e0ddd9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=AA=86=E6=B2=9B?= Date: Tue, 26 Sep 2023 12:19:03 +0800 Subject: [PATCH 3/3] =?UTF-8?q?chore(Doc):=20=E6=9B=B4=E6=96=B0=E4=BE=9D?= =?UTF-8?q?=E8=B5=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- .../codeSandbox/getCodeSandboxParams.js | 26 +++++++++++-------- 2 files changed, 16 insertions(+), 12 deletions(-) diff --git a/package.json b/package.json index 0800161a37..ecc9b77638 100644 --- a/package.json +++ b/package.json @@ -91,7 +91,6 @@ "@types/sortablejs": "^1.15.1", "@types/tinycolor2": "^1.4.3", "@types/validator": "^13.7.17", - "codesandbox": "^2.2.3", "dayjs": "^1.11.9", "lodash": "^4.17.21", "mitt": "^3.0.1", @@ -137,6 +136,7 @@ "camelcase": "~6.3.0", "cli-color": "^2.0.3", "clipboard": "^2.0.11", + "codesandbox": "^2.2.3", "cypress": "^12.17.2", "cz-git": "^1.7.0", "czg": "^1.7.0", diff --git a/site/src/components/codeSandbox/getCodeSandboxParams.js b/site/src/components/codeSandbox/getCodeSandboxParams.js index 3e5dd943a8..d06d050d55 100644 --- a/site/src/components/codeSandbox/getCodeSandboxParams.js +++ b/site/src/components/codeSandbox/getCodeSandboxParams.js @@ -42,18 +42,22 @@ export function getCodeSandboxParams(code, meta) { return getParameters({ files: { 'package.json': { - content: JSON.stringify({ - title: meta.title, - dependencies: { - vue: orgPkg.devDependencies.vue, - less: orgPkg.devDependencies.less, - 'tdesign-vue-next': orgPkg.version, - 'tdesign-icons-vue-next': orgPkg.dependencies['tdesign-icons-vue-next'], + content: JSON.stringify( + { + title: meta.title, + dependencies: { + vue: orgPkg.devDependencies.vue, + less: orgPkg.devDependencies.less, + 'tdesign-vue-next': orgPkg.version, + 'tdesign-icons-vue-next': orgPkg.dependencies['tdesign-icons-vue-next'], + }, + devDependencies: { + '@vue/cli-plugin-babel': '~4.5.0', + }, }, - devDependencies: { - '@vue/cli-plugin-babel': '~4.5.0', - }, - }), + null, + 2, + ), isBinary: false, }, 'index.html': {