@rspress/plugin-playground 0.0.0-nightly-20230919160314 → 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -40,10 +40,18 @@ var import_react3 = __toESM(require("@monaco-editor/react"));
40
40
 
41
41
  // src/web/editor.tsx
42
42
  var import_react = __toESM(require("@monaco-editor/react"));
43
+
44
+ // src/web/constant.ts
45
+ var DEFAULT_BABEL_URL = "https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.22.20/babel.min.js";
46
+ var DEFAULT_MONACO_URL = "https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.43.0/min/vs";
47
+
48
+ // src/web/editor.tsx
43
49
  var import_jsx_runtime = require("react/jsx-runtime");
44
50
  function initLoader() {
45
51
  let loaderConfig = {
46
- paths: { vs: "https://unpkg.com/monaco-editor@0.43.0/min/vs" }
52
+ paths: {
53
+ vs: DEFAULT_MONACO_URL
54
+ }
47
55
  };
48
56
  try {
49
57
  const keys = Object.keys(__PLAYGROUND_MONACO_LOADER__);
@@ -93,7 +101,6 @@ function Editor(props) {
93
101
  }
94
102
 
95
103
  // src/web/runner.tsx
96
- var babel = __toESM(require("@babel/standalone"));
97
104
  var import_react2 = __toESM(require("react"));
98
105
 
99
106
  // src/web/ast.ts
@@ -152,6 +159,39 @@ function createGetImport(name, getDefault) {
152
159
  };
153
160
  }
154
161
 
162
+ // src/web/utils.ts
163
+ var loadingMap = /* @__PURE__ */ new Map();
164
+ function loadScript(url) {
165
+ const exists = loadingMap.get(url);
166
+ if (exists) {
167
+ return exists;
168
+ }
169
+ const n = new Promise((resolve) => {
170
+ const e = document.createElement("script");
171
+ e.src = url;
172
+ e.onload = () => resolve();
173
+ document.body.appendChild(e);
174
+ });
175
+ loadingMap.set(url, n);
176
+ return n;
177
+ }
178
+
179
+ // src/web/babel.ts
180
+ async function getBabel() {
181
+ if (!window.Babel) {
182
+ let babelUrl = DEFAULT_BABEL_URL;
183
+ try {
184
+ const u = __PLAYGROUND_BABEL_URL__;
185
+ if (u) {
186
+ babelUrl = u;
187
+ }
188
+ } catch (e) {
189
+ }
190
+ await loadScript(babelUrl);
191
+ }
192
+ return window.Babel;
193
+ }
194
+
155
195
  // src/web/runner.tsx
156
196
  var import_jsx_runtime2 = require("react/jsx-runtime");
157
197
  var Runner = class extends import_react2.Component {
@@ -179,8 +219,9 @@ var Runner = class extends import_react2.Component {
179
219
  this.doCompile(targetCode);
180
220
  }, 600);
181
221
  }
182
- doCompile(targetCode) {
222
+ async doCompile(targetCode) {
183
223
  const { language, getImport } = this.props;
224
+ const babel = await getBabel();
184
225
  try {
185
226
  const presets = [
186
227
  [babel.availablePresets.react],
@@ -1 +1 @@
1
- {"version":3,"mappings":"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","names":[],"sources":["../../../src/web/index.ts","../../../src/web/editor.tsx","../../../src/web/runner.tsx","../../../src/web/ast.ts"],"sourcesContent":["export {\n default as MonacoEditor,\n loader as MonacoEditorLoader,\n EditorProps as MonacoEditorProps,\n} from '@monaco-editor/react';\nexport { Editor } from './editor';\nexport { Runner } from './runner';\n","import React from 'react';\nimport MonacoEditor, {\n loader,\n EditorProps as MonacoEditorProps,\n} from '@monaco-editor/react';\n\n// inject by builder in cli/index.ts\n// see: https://modernjs.dev/builder/api/config-source.html#sourcedefine\ndeclare global {\n const __PLAYGROUND_MONACO_LOADER__: any;\n const __PLAYGROUND_MONACO_OPTIONS__: any;\n}\n\nfunction initLoader() {\n let loaderConfig = {\n paths: { vs: 'https://unpkg.com/monaco-editor@0.43.0/min/vs' },\n };\n\n try {\n const keys = Object.keys(__PLAYGROUND_MONACO_LOADER__);\n\n if (keys.length > 0) {\n loaderConfig = __PLAYGROUND_MONACO_LOADER__;\n }\n } catch (e) {\n // ignore\n }\n\n loader.config(loaderConfig);\n}\ninitLoader();\n\nfunction getMonacoOptions() {\n try {\n return __PLAYGROUND_MONACO_OPTIONS__;\n } catch (e) {\n // ignore\n }\n return {};\n}\n\nexport type EditorProps = Partial<MonacoEditorProps>;\n\nexport function Editor(props: EditorProps) {\n const { options, className = '', ...rest } = props || {};\n\n return (\n <div className={`rspress-playground-editor ${className}`}>\n <MonacoEditor\n {...rest}\n theme=\"light\"\n options={{\n minimap: {\n enabled: true,\n autohide: true,\n },\n fontSize: 14,\n lineNumbersMinChars: 7,\n scrollBeyondLastLine: false,\n automaticLayout: true,\n wordBasedSuggestions: true,\n quickSuggestions: true,\n scrollbar: {\n verticalScrollbarSize: 8,\n horizontalScrollbarSize: 8,\n },\n scrollPredominantAxis: false,\n ...getMonacoOptions(),\n ...options,\n }}\n />\n </div>\n );\n}\n","import * as babel from '@babel/standalone';\nimport type { Node } from '@babel/types';\nimport React, { Component, HTMLAttributes } from 'react';\nimport {\n createGetImport,\n createObjectPattern,\n createVariableDeclaration,\n} from './ast';\n\ninterface RunnerProps extends HTMLAttributes<HTMLDivElement> {\n code: string;\n language: string;\n getImport: (name: string, getDefault?: boolean) => void;\n}\n\ninterface RunnerState {\n error?: Error;\n comp: any;\n}\n\nclass Runner extends Component<RunnerProps, RunnerState> {\n static getDerivedStateFromError(error: Error) {\n return {\n error,\n comp: null,\n };\n }\n\n timer: any;\n\n constructor(props: RunnerProps) {\n super(props);\n\n this.state = {\n error: undefined,\n comp: null,\n };\n\n this.doCompile = this.doCompile.bind(this);\n this.waitCompile = this.waitCompile.bind(this);\n }\n\n waitCompile(targetCode: string) {\n if (this.timer) {\n clearTimeout(this.timer);\n }\n this.timer = setTimeout(() => {\n this.timer = null;\n this.doCompile(targetCode);\n }, 600);\n }\n\n doCompile(targetCode: string) {\n const { language, getImport } = this.props;\n try {\n const presets = [\n [babel.availablePresets.react],\n [babel.availablePresets.env, { modules: 'commonjs' }],\n ];\n if (language === 'tsx' || language === 'ts') {\n presets.unshift([\n babel.availablePresets.typescript,\n {\n allExtensions: true,\n isTSX: language === 'tsx',\n },\n ]);\n }\n const result = babel.transform(targetCode, {\n sourceType: 'module',\n presets,\n plugins: [\n {\n visitor: {\n ImportDeclaration(path) {\n const pkg = path.node.source.value;\n const code: Node[] = [];\n for (const specifier of path.node.specifiers) {\n // import X from 'xxx'\n if (specifier.type === 'ImportDefaultSpecifier') {\n // const ${specifier.local.name} = __get_import()\n code.push(\n createVariableDeclaration(\n specifier.local.name,\n createGetImport(pkg, true),\n ),\n );\n }\n // import * as X from 'xxx'\n if (specifier.type === 'ImportNamespaceSpecifier') {\n // const ${specifier.local.name} = __get_import()\n code.push(\n createVariableDeclaration(\n specifier.local.name,\n createGetImport(pkg),\n ),\n );\n }\n // import { a, b, c } from 'xxx'\n if (specifier.type === 'ImportSpecifier') {\n // const {${specifier.local.name}} = __get_import()\n code.push(\n createVariableDeclaration(\n createObjectPattern([specifier.local.name]),\n createGetImport(pkg),\n ),\n );\n }\n }\n path.replaceWithMultiple(code);\n },\n },\n },\n ],\n });\n\n // Code has been updated\n if (targetCode !== this.props.code || !result || !result.code) {\n return;\n }\n\n const runExports: any = {};\n // eslint-disable-next-line @typescript-eslint/no-implied-eval, no-new-func\n const func = new Function('__get_import', 'exports', result.code);\n func(getImport, runExports);\n\n if (runExports.default) {\n this.setState({\n error: undefined,\n comp: React.createElement(runExports.default),\n });\n return;\n }\n\n this.setState({\n error: new Error('No default export'),\n comp: null,\n });\n } catch (e) {\n // Code has been updated\n if (targetCode !== this.props.code) {\n return;\n }\n console.error(e);\n this.setState({\n error: e as Error,\n comp: null,\n });\n }\n }\n\n componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {\n console.error(error);\n console.error(errorInfo);\n }\n\n componentDidMount() {\n this.doCompile(this.props.code);\n }\n\n componentDidUpdate(prevProps: RunnerProps) {\n if (prevProps.code !== this.props.code) {\n this.waitCompile(this.props.code);\n }\n }\n\n render() {\n const { className = '', code, language, getImport, ...rest } = this.props;\n const { error, comp } = this.state;\n\n if (error) {\n return (\n <div className={`rspress-playground-runner ${className}`} {...rest}>\n <span style={{ color: 'red' }}>{error.message}</span>\n </div>\n );\n }\n\n return (\n <div className={`rspress-playground-runner ${className}`} {...rest}>\n {comp}\n </div>\n );\n }\n}\n\nexport { Runner };\n","import type {\n CallExpression,\n Expression,\n ObjectPattern,\n VariableDeclaration,\n} from '@babel/types';\n\nexport function createVariableDeclaration(\n id: string | ObjectPattern,\n init: Expression,\n): VariableDeclaration {\n return {\n type: 'VariableDeclaration',\n declarations: [\n {\n type: 'VariableDeclarator',\n id:\n typeof id === 'string'\n ? {\n type: 'Identifier',\n name: id,\n }\n : id,\n init,\n },\n ],\n kind: 'const',\n };\n}\n\nexport function createObjectPattern(names: string[]): ObjectPattern {\n return {\n type: 'ObjectPattern',\n properties: names.map(name => ({\n type: 'ObjectProperty',\n key: {\n type: 'Identifier',\n name,\n },\n computed: false,\n method: false,\n shorthand: true,\n value: {\n type: 'Identifier',\n name,\n },\n })),\n };\n}\n\nexport function createGetImport(\n name: string,\n getDefault?: boolean,\n): CallExpression {\n return {\n type: 'CallExpression',\n callee: {\n type: 'Identifier',\n name: '__get_import',\n },\n arguments: [\n {\n type: 'StringLiteral',\n value: name,\n },\n {\n type: 'BooleanLiteral',\n value: Boolean(getDefault),\n },\n ],\n };\n}\n"]}
1
+ {"version":3,"mappings":"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","names":[],"sources":["../../../src/web/index.ts","../../../src/web/editor.tsx","../../../src/web/constant.ts","../../../src/web/runner.tsx","../../../src/web/ast.ts","../../../src/web/utils.ts","../../../src/web/babel.ts"],"sourcesContent":["export {\n default as MonacoEditor,\n loader as MonacoEditorLoader,\n EditorProps as MonacoEditorProps,\n} from '@monaco-editor/react';\nexport { Editor } from './editor';\nexport { Runner } from './runner';\n","import React from 'react';\nimport MonacoEditor, {\n loader,\n EditorProps as MonacoEditorProps,\n} from '@monaco-editor/react';\nimport { DEFAULT_MONACO_URL } from './constant';\n\n// inject by builder in cli/index.ts\n// see: https://modernjs.dev/builder/api/config-source.html#sourcedefine\ndeclare global {\n const __PLAYGROUND_MONACO_LOADER__: any;\n const __PLAYGROUND_MONACO_OPTIONS__: any;\n}\n\nfunction initLoader() {\n let loaderConfig = {\n paths: {\n vs: DEFAULT_MONACO_URL,\n },\n };\n\n try {\n const keys = Object.keys(__PLAYGROUND_MONACO_LOADER__);\n\n if (keys.length > 0) {\n loaderConfig = __PLAYGROUND_MONACO_LOADER__;\n }\n } catch (e) {\n // ignore\n }\n\n loader.config(loaderConfig);\n}\ninitLoader();\n\nfunction getMonacoOptions() {\n try {\n return __PLAYGROUND_MONACO_OPTIONS__;\n } catch (e) {\n // ignore\n }\n return {};\n}\n\nexport type EditorProps = Partial<MonacoEditorProps>;\n\nexport function Editor(props: EditorProps) {\n const { options, className = '', ...rest } = props || {};\n\n return (\n <div className={`rspress-playground-editor ${className}`}>\n <MonacoEditor\n {...rest}\n theme=\"light\"\n options={{\n minimap: {\n enabled: true,\n autohide: true,\n },\n fontSize: 14,\n lineNumbersMinChars: 7,\n scrollBeyondLastLine: false,\n automaticLayout: true,\n wordBasedSuggestions: true,\n quickSuggestions: true,\n scrollbar: {\n verticalScrollbarSize: 8,\n horizontalScrollbarSize: 8,\n },\n scrollPredominantAxis: false,\n ...getMonacoOptions(),\n ...options,\n }}\n />\n </div>\n );\n}\n","export const DEFAULT_BABEL_URL =\n 'https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.22.20/babel.min.js';\n\nexport const DEFAULT_MONACO_URL =\n 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.43.0/min/vs';\n","import type { Node } from '@babel/types';\nimport React, { Component, HTMLAttributes } from 'react';\nimport {\n createGetImport,\n createObjectPattern,\n createVariableDeclaration,\n} from './ast';\nimport { getBabel } from './babel';\n\ninterface RunnerProps extends HTMLAttributes<HTMLDivElement> {\n code: string;\n language: string;\n getImport: (name: string, getDefault?: boolean) => void;\n}\n\ninterface RunnerState {\n error?: Error;\n comp: any;\n}\n\nclass Runner extends Component<RunnerProps, RunnerState> {\n static getDerivedStateFromError(error: Error) {\n return {\n error,\n comp: null,\n };\n }\n\n timer: any;\n\n constructor(props: RunnerProps) {\n super(props);\n\n this.state = {\n error: undefined,\n comp: null,\n };\n\n this.doCompile = this.doCompile.bind(this);\n this.waitCompile = this.waitCompile.bind(this);\n }\n\n waitCompile(targetCode: string) {\n if (this.timer) {\n clearTimeout(this.timer);\n }\n this.timer = setTimeout(() => {\n this.timer = null;\n this.doCompile(targetCode);\n }, 600);\n }\n\n async doCompile(targetCode: string) {\n const { language, getImport } = this.props;\n const babel = await getBabel();\n try {\n const presets = [\n [babel.availablePresets.react],\n [babel.availablePresets.env, { modules: 'commonjs' }],\n ];\n if (language === 'tsx' || language === 'ts') {\n presets.unshift([\n babel.availablePresets.typescript,\n {\n allExtensions: true,\n isTSX: language === 'tsx',\n },\n ]);\n }\n const result = babel.transform(targetCode, {\n sourceType: 'module',\n presets,\n plugins: [\n {\n visitor: {\n ImportDeclaration(path) {\n const pkg = path.node.source.value;\n const code: Node[] = [];\n for (const specifier of path.node.specifiers) {\n // import X from 'xxx'\n if (specifier.type === 'ImportDefaultSpecifier') {\n // const ${specifier.local.name} = __get_import()\n code.push(\n createVariableDeclaration(\n specifier.local.name,\n createGetImport(pkg, true),\n ),\n );\n }\n // import * as X from 'xxx'\n if (specifier.type === 'ImportNamespaceSpecifier') {\n // const ${specifier.local.name} = __get_import()\n code.push(\n createVariableDeclaration(\n specifier.local.name,\n createGetImport(pkg),\n ),\n );\n }\n // import { a, b, c } from 'xxx'\n if (specifier.type === 'ImportSpecifier') {\n // const {${specifier.local.name}} = __get_import()\n code.push(\n createVariableDeclaration(\n createObjectPattern([specifier.local.name]),\n createGetImport(pkg),\n ),\n );\n }\n }\n path.replaceWithMultiple(code);\n },\n },\n },\n ],\n });\n\n // Code has been updated\n if (targetCode !== this.props.code || !result || !result.code) {\n return;\n }\n\n const runExports: any = {};\n // eslint-disable-next-line @typescript-eslint/no-implied-eval, no-new-func\n const func = new Function('__get_import', 'exports', result.code);\n func(getImport, runExports);\n\n if (runExports.default) {\n this.setState({\n error: undefined,\n comp: React.createElement(runExports.default),\n });\n return;\n }\n\n this.setState({\n error: new Error('No default export'),\n comp: null,\n });\n } catch (e) {\n // Code has been updated\n if (targetCode !== this.props.code) {\n return;\n }\n console.error(e);\n this.setState({\n error: e as Error,\n comp: null,\n });\n }\n }\n\n componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {\n console.error(error);\n console.error(errorInfo);\n }\n\n componentDidMount() {\n this.doCompile(this.props.code);\n }\n\n componentDidUpdate(prevProps: RunnerProps) {\n if (prevProps.code !== this.props.code) {\n this.waitCompile(this.props.code);\n }\n }\n\n render() {\n const { className = '', code, language, getImport, ...rest } = this.props;\n const { error, comp } = this.state;\n\n if (error) {\n return (\n <div className={`rspress-playground-runner ${className}`} {...rest}>\n <span style={{ color: 'red' }}>{error.message}</span>\n </div>\n );\n }\n\n return (\n <div className={`rspress-playground-runner ${className}`} {...rest}>\n {comp}\n </div>\n );\n }\n}\n\nexport { Runner };\n","import type {\n CallExpression,\n Expression,\n ObjectPattern,\n VariableDeclaration,\n} from '@babel/types';\n\nexport function createVariableDeclaration(\n id: string | ObjectPattern,\n init: Expression,\n): VariableDeclaration {\n return {\n type: 'VariableDeclaration',\n declarations: [\n {\n type: 'VariableDeclarator',\n id:\n typeof id === 'string'\n ? {\n type: 'Identifier',\n name: id,\n }\n : id,\n init,\n },\n ],\n kind: 'const',\n };\n}\n\nexport function createObjectPattern(names: string[]): ObjectPattern {\n return {\n type: 'ObjectPattern',\n properties: names.map(name => ({\n type: 'ObjectProperty',\n key: {\n type: 'Identifier',\n name,\n },\n computed: false,\n method: false,\n shorthand: true,\n value: {\n type: 'Identifier',\n name,\n },\n })),\n };\n}\n\nexport function createGetImport(\n name: string,\n getDefault?: boolean,\n): CallExpression {\n return {\n type: 'CallExpression',\n callee: {\n type: 'Identifier',\n name: '__get_import',\n },\n arguments: [\n {\n type: 'StringLiteral',\n value: name,\n },\n {\n type: 'BooleanLiteral',\n value: Boolean(getDefault),\n },\n ],\n };\n}\n","const loadingMap = new Map<string, Promise<void>>();\n\nexport function loadScript(url: string): Promise<void> {\n const exists = loadingMap.get(url);\n if (exists) {\n return exists;\n }\n const n: Promise<void> = new Promise(resolve => {\n const e = document.createElement('script');\n e.src = url;\n e.onload = () => resolve();\n document.body.appendChild(e);\n });\n loadingMap.set(url, n);\n return n;\n}\n\nexport function normalizeUrl(u: string) {\n return u.replace(/\\/\\//g, '/');\n}\n","import type babel from '@babel/standalone';\nimport { DEFAULT_BABEL_URL } from './constant';\nimport { loadScript } from './utils';\n\ndeclare global {\n // inject by builder in cli/index.ts\n // see: https://modernjs.dev/builder/api/config-source.html#sourcedefine\n const __PLAYGROUND_BABEL_URL__: any;\n interface Window {\n Babel: typeof babel;\n }\n}\n\nasync function getBabel() {\n if (!window.Babel) {\n let babelUrl = DEFAULT_BABEL_URL;\n try {\n const u = __PLAYGROUND_BABEL_URL__;\n if (u) {\n babelUrl = u;\n }\n } catch (e) {\n // ignore\n }\n await loadScript(babelUrl);\n }\n return window.Babel;\n}\n\nexport { getBabel };\n"]}
@@ -26,7 +26,7 @@ declare class Runner extends Component<RunnerProps, RunnerState> {
26
26
  timer: any;
27
27
  constructor(props: RunnerProps);
28
28
  waitCompile(targetCode: string): void;
29
- doCompile(targetCode: string): void;
29
+ doCompile(targetCode: string): Promise<void>;
30
30
  componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void;
31
31
  componentDidMount(): void;
32
32
  componentDidUpdate(prevProps: RunnerProps): void;
@@ -4,10 +4,16 @@ import { default as default2, loader as loader2, EditorProps } from "@monaco-edi
4
4
  // src/web/editor.tsx
5
5
  import { jsx as _jsx } from "react/jsx-runtime";
6
6
  import MonacoEditor, { loader } from "@monaco-editor/react";
7
+
8
+ // src/web/constant.ts
9
+ var DEFAULT_BABEL_URL = "https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.22.20/babel.min.js";
10
+ var DEFAULT_MONACO_URL = "https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.43.0/min/vs";
11
+
12
+ // src/web/editor.tsx
7
13
  function initLoader() {
8
14
  let loaderConfig = {
9
15
  paths: {
10
- vs: "https://unpkg.com/monaco-editor@0.43.0/min/vs"
16
+ vs: DEFAULT_MONACO_URL
11
17
  }
12
18
  };
13
19
  try {
@@ -59,7 +65,6 @@ function Editor(props) {
59
65
 
60
66
  // src/web/runner.tsx
61
67
  import { jsx as _jsx2 } from "react/jsx-runtime";
62
- import * as babel from "@babel/standalone";
63
68
  import React, { Component } from "react";
64
69
 
65
70
  // src/web/ast.ts
@@ -118,6 +123,39 @@ function createGetImport(name, getDefault) {
118
123
  };
119
124
  }
120
125
 
126
+ // src/web/utils.ts
127
+ var loadingMap = /* @__PURE__ */ new Map();
128
+ function loadScript(url) {
129
+ const exists = loadingMap.get(url);
130
+ if (exists) {
131
+ return exists;
132
+ }
133
+ const n = new Promise((resolve) => {
134
+ const e = document.createElement("script");
135
+ e.src = url;
136
+ e.onload = () => resolve();
137
+ document.body.appendChild(e);
138
+ });
139
+ loadingMap.set(url, n);
140
+ return n;
141
+ }
142
+
143
+ // src/web/babel.ts
144
+ async function getBabel() {
145
+ if (!window.Babel) {
146
+ let babelUrl = DEFAULT_BABEL_URL;
147
+ try {
148
+ const u = __PLAYGROUND_BABEL_URL__;
149
+ if (u) {
150
+ babelUrl = u;
151
+ }
152
+ } catch (e) {
153
+ }
154
+ await loadScript(babelUrl);
155
+ }
156
+ return window.Babel;
157
+ }
158
+
121
159
  // src/web/runner.tsx
122
160
  function _define_property(obj, key, value) {
123
161
  if (key in obj) {
@@ -148,8 +186,9 @@ var Runner = class extends Component {
148
186
  this.doCompile(targetCode);
149
187
  }, 600);
150
188
  }
151
- doCompile(targetCode) {
189
+ async doCompile(targetCode) {
152
190
  const { language, getImport } = this.props;
191
+ const babel = await getBabel();
153
192
  try {
154
193
  const presets = [
155
194
  [
@@ -1 +1 @@
1
- {"version":3,"mappings":"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","names":["MonacoEditor","default","MonacoEditorLoader","loader","MonacoEditorProps","initLoader","loaderConfig","paths","vs","keys","Object","__PLAYGROUND_MONACO_LOADER__","length","e","config","getMonacoOptions","__PLAYGROUND_MONACO_OPTIONS__","Editor","props","options","className","rest","div","theme","minimap","enabled","autohide","fontSize","lineNumbersMinChars","scrollBeyondLastLine","automaticLayout","wordBasedSuggestions","quickSuggestions","scrollbar","verticalScrollbarSize","horizontalScrollbarSize","scrollPredominantAxis","babel","React","Component","createVariableDeclaration","id","init","type","declarations","name","kind","createObjectPattern","names","properties","map","key","computed","method","shorthand","value","createGetImport","getDefault","callee","arguments","Boolean","Runner","getDerivedStateFromError","error","comp","waitCompile","targetCode","timer","clearTimeout","setTimeout","doCompile","language","getImport","presets","availablePresets","react","env","modules","unshift","typescript","allExtensions","isTSX","result","transform","sourceType","plugins","visitor","ImportDeclaration","path","pkg","node","source","code","specifier","specifiers","push","local","replaceWithMultiple","runExports","func","Function","setState","undefined","createElement","Error","console","componentDidCatch","errorInfo","componentDidMount","componentDidUpdate","prevProps","render","state","span","style","color","message","constructor","bind"],"sources":["../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/index.ts","../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/editor.tsx","../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/runner.tsx","../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/ast.ts"],"sourcesContent":["export {\n default as MonacoEditor,\n loader as MonacoEditorLoader,\n EditorProps as MonacoEditorProps,\n} from '@monaco-editor/react';\nexport { Editor } from './editor';\nexport { Runner } from './runner';\n","import React from 'react';\nimport MonacoEditor, {\n loader,\n EditorProps as MonacoEditorProps,\n} from '@monaco-editor/react';\n\n// inject by builder in cli/index.ts\n// see: https://modernjs.dev/builder/api/config-source.html#sourcedefine\ndeclare global {\n const __PLAYGROUND_MONACO_LOADER__: any;\n const __PLAYGROUND_MONACO_OPTIONS__: any;\n}\n\nfunction initLoader() {\n let loaderConfig = {\n paths: { vs: 'https://unpkg.com/monaco-editor@0.43.0/min/vs' },\n };\n\n try {\n const keys = Object.keys(__PLAYGROUND_MONACO_LOADER__);\n\n if (keys.length > 0) {\n loaderConfig = __PLAYGROUND_MONACO_LOADER__;\n }\n } catch (e) {\n // ignore\n }\n\n loader.config(loaderConfig);\n}\ninitLoader();\n\nfunction getMonacoOptions() {\n try {\n return __PLAYGROUND_MONACO_OPTIONS__;\n } catch (e) {\n // ignore\n }\n return {};\n}\n\nexport type EditorProps = Partial<MonacoEditorProps>;\n\nexport function Editor(props: EditorProps) {\n const { options, className = '', ...rest } = props || {};\n\n return (\n <div className={`rspress-playground-editor ${className}`}>\n <MonacoEditor\n {...rest}\n theme=\"light\"\n options={{\n minimap: {\n enabled: true,\n autohide: true,\n },\n fontSize: 14,\n lineNumbersMinChars: 7,\n scrollBeyondLastLine: false,\n automaticLayout: true,\n wordBasedSuggestions: true,\n quickSuggestions: true,\n scrollbar: {\n verticalScrollbarSize: 8,\n horizontalScrollbarSize: 8,\n },\n scrollPredominantAxis: false,\n ...getMonacoOptions(),\n ...options,\n }}\n />\n </div>\n );\n}\n","import * as babel from '@babel/standalone';\nimport type { Node } from '@babel/types';\nimport React, { Component, HTMLAttributes } from 'react';\nimport {\n createGetImport,\n createObjectPattern,\n createVariableDeclaration,\n} from './ast';\n\ninterface RunnerProps extends HTMLAttributes<HTMLDivElement> {\n code: string;\n language: string;\n getImport: (name: string, getDefault?: boolean) => void;\n}\n\ninterface RunnerState {\n error?: Error;\n comp: any;\n}\n\nclass Runner extends Component<RunnerProps, RunnerState> {\n static getDerivedStateFromError(error: Error) {\n return {\n error,\n comp: null,\n };\n }\n\n timer: any;\n\n constructor(props: RunnerProps) {\n super(props);\n\n this.state = {\n error: undefined,\n comp: null,\n };\n\n this.doCompile = this.doCompile.bind(this);\n this.waitCompile = this.waitCompile.bind(this);\n }\n\n waitCompile(targetCode: string) {\n if (this.timer) {\n clearTimeout(this.timer);\n }\n this.timer = setTimeout(() => {\n this.timer = null;\n this.doCompile(targetCode);\n }, 600);\n }\n\n doCompile(targetCode: string) {\n const { language, getImport } = this.props;\n try {\n const presets = [\n [babel.availablePresets.react],\n [babel.availablePresets.env, { modules: 'commonjs' }],\n ];\n if (language === 'tsx' || language === 'ts') {\n presets.unshift([\n babel.availablePresets.typescript,\n {\n allExtensions: true,\n isTSX: language === 'tsx',\n },\n ]);\n }\n const result = babel.transform(targetCode, {\n sourceType: 'module',\n presets,\n plugins: [\n {\n visitor: {\n ImportDeclaration(path) {\n const pkg = path.node.source.value;\n const code: Node[] = [];\n for (const specifier of path.node.specifiers) {\n // import X from 'xxx'\n if (specifier.type === 'ImportDefaultSpecifier') {\n // const ${specifier.local.name} = __get_import()\n code.push(\n createVariableDeclaration(\n specifier.local.name,\n createGetImport(pkg, true),\n ),\n );\n }\n // import * as X from 'xxx'\n if (specifier.type === 'ImportNamespaceSpecifier') {\n // const ${specifier.local.name} = __get_import()\n code.push(\n createVariableDeclaration(\n specifier.local.name,\n createGetImport(pkg),\n ),\n );\n }\n // import { a, b, c } from 'xxx'\n if (specifier.type === 'ImportSpecifier') {\n // const {${specifier.local.name}} = __get_import()\n code.push(\n createVariableDeclaration(\n createObjectPattern([specifier.local.name]),\n createGetImport(pkg),\n ),\n );\n }\n }\n path.replaceWithMultiple(code);\n },\n },\n },\n ],\n });\n\n // Code has been updated\n if (targetCode !== this.props.code || !result || !result.code) {\n return;\n }\n\n const runExports: any = {};\n // eslint-disable-next-line @typescript-eslint/no-implied-eval, no-new-func\n const func = new Function('__get_import', 'exports', result.code);\n func(getImport, runExports);\n\n if (runExports.default) {\n this.setState({\n error: undefined,\n comp: React.createElement(runExports.default),\n });\n return;\n }\n\n this.setState({\n error: new Error('No default export'),\n comp: null,\n });\n } catch (e) {\n // Code has been updated\n if (targetCode !== this.props.code) {\n return;\n }\n console.error(e);\n this.setState({\n error: e as Error,\n comp: null,\n });\n }\n }\n\n componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {\n console.error(error);\n console.error(errorInfo);\n }\n\n componentDidMount() {\n this.doCompile(this.props.code);\n }\n\n componentDidUpdate(prevProps: RunnerProps) {\n if (prevProps.code !== this.props.code) {\n this.waitCompile(this.props.code);\n }\n }\n\n render() {\n const { className = '', code, language, getImport, ...rest } = this.props;\n const { error, comp } = this.state;\n\n if (error) {\n return (\n <div className={`rspress-playground-runner ${className}`} {...rest}>\n <span style={{ color: 'red' }}>{error.message}</span>\n </div>\n );\n }\n\n return (\n <div className={`rspress-playground-runner ${className}`} {...rest}>\n {comp}\n </div>\n );\n }\n}\n\nexport { Runner };\n","import type {\n CallExpression,\n Expression,\n ObjectPattern,\n VariableDeclaration,\n} from '@babel/types';\n\nexport function createVariableDeclaration(\n id: string | ObjectPattern,\n init: Expression,\n): VariableDeclaration {\n return {\n type: 'VariableDeclaration',\n declarations: [\n {\n type: 'VariableDeclarator',\n id:\n typeof id === 'string'\n ? {\n type: 'Identifier',\n name: id,\n }\n : id,\n init,\n },\n ],\n kind: 'const',\n };\n}\n\nexport function createObjectPattern(names: string[]): ObjectPattern {\n return {\n type: 'ObjectPattern',\n properties: names.map(name => ({\n type: 'ObjectProperty',\n key: {\n type: 'Identifier',\n name,\n },\n computed: false,\n method: false,\n shorthand: true,\n value: {\n type: 'Identifier',\n name,\n },\n })),\n };\n}\n\nexport function createGetImport(\n name: string,\n getDefault?: boolean,\n): CallExpression {\n return {\n type: 'CallExpression',\n callee: {\n type: 'Identifier',\n name: '__get_import',\n },\n arguments: [\n {\n type: 'StringLiteral',\n value: name,\n },\n {\n type: 'BooleanLiteral',\n value: Boolean(getDefault),\n },\n ],\n };\n}\n"]}
1
+ {"version":3,"mappings":"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","names":["MonacoEditor","default","MonacoEditorLoader","loader","MonacoEditorProps","DEFAULT_BABEL_URL","DEFAULT_MONACO_URL","initLoader","loaderConfig","paths","vs","keys","Object","__PLAYGROUND_MONACO_LOADER__","length","e","config","getMonacoOptions","__PLAYGROUND_MONACO_OPTIONS__","Editor","props","options","className","rest","div","theme","minimap","enabled","autohide","fontSize","lineNumbersMinChars","scrollBeyondLastLine","automaticLayout","wordBasedSuggestions","quickSuggestions","scrollbar","verticalScrollbarSize","horizontalScrollbarSize","scrollPredominantAxis","React","Component","createVariableDeclaration","id","init","type","declarations","name","kind","createObjectPattern","names","properties","map","key","computed","method","shorthand","value","createGetImport","getDefault","callee","arguments","Boolean","loadingMap","Map","loadScript","url","exists","get","n","Promise","resolve","document","createElement","src","onload","body","appendChild","set","getBabel","window","Babel","babelUrl","u","__PLAYGROUND_BABEL_URL__","Runner","getDerivedStateFromError","error","comp","waitCompile","targetCode","timer","clearTimeout","setTimeout","doCompile","language","getImport","babel","presets","availablePresets","react","env","modules","unshift","typescript","allExtensions","isTSX","result","transform","sourceType","plugins","visitor","ImportDeclaration","path","pkg","node","source","code","specifier","specifiers","push","local","replaceWithMultiple","runExports","func","Function","setState","undefined","Error","console","componentDidCatch","errorInfo","componentDidMount","componentDidUpdate","prevProps","render","state","span","style","color","message","constructor","bind"],"sources":["../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/index.ts","../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/editor.tsx","../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/constant.ts","../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/runner.tsx","../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/ast.ts","../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/utils.ts","../../../src/web/home/runner/work/rspress/rspress/packages/plugin-playground/src/web/babel.ts"],"sourcesContent":["export {\n default as MonacoEditor,\n loader as MonacoEditorLoader,\n EditorProps as MonacoEditorProps,\n} from '@monaco-editor/react';\nexport { Editor } from './editor';\nexport { Runner } from './runner';\n","import React from 'react';\nimport MonacoEditor, {\n loader,\n EditorProps as MonacoEditorProps,\n} from '@monaco-editor/react';\nimport { DEFAULT_MONACO_URL } from './constant';\n\n// inject by builder in cli/index.ts\n// see: https://modernjs.dev/builder/api/config-source.html#sourcedefine\ndeclare global {\n const __PLAYGROUND_MONACO_LOADER__: any;\n const __PLAYGROUND_MONACO_OPTIONS__: any;\n}\n\nfunction initLoader() {\n let loaderConfig = {\n paths: {\n vs: DEFAULT_MONACO_URL,\n },\n };\n\n try {\n const keys = Object.keys(__PLAYGROUND_MONACO_LOADER__);\n\n if (keys.length > 0) {\n loaderConfig = __PLAYGROUND_MONACO_LOADER__;\n }\n } catch (e) {\n // ignore\n }\n\n loader.config(loaderConfig);\n}\ninitLoader();\n\nfunction getMonacoOptions() {\n try {\n return __PLAYGROUND_MONACO_OPTIONS__;\n } catch (e) {\n // ignore\n }\n return {};\n}\n\nexport type EditorProps = Partial<MonacoEditorProps>;\n\nexport function Editor(props: EditorProps) {\n const { options, className = '', ...rest } = props || {};\n\n return (\n <div className={`rspress-playground-editor ${className}`}>\n <MonacoEditor\n {...rest}\n theme=\"light\"\n options={{\n minimap: {\n enabled: true,\n autohide: true,\n },\n fontSize: 14,\n lineNumbersMinChars: 7,\n scrollBeyondLastLine: false,\n automaticLayout: true,\n wordBasedSuggestions: true,\n quickSuggestions: true,\n scrollbar: {\n verticalScrollbarSize: 8,\n horizontalScrollbarSize: 8,\n },\n scrollPredominantAxis: false,\n ...getMonacoOptions(),\n ...options,\n }}\n />\n </div>\n );\n}\n","export const DEFAULT_BABEL_URL =\n 'https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.22.20/babel.min.js';\n\nexport const DEFAULT_MONACO_URL =\n 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.43.0/min/vs';\n","import type { Node } from '@babel/types';\nimport React, { Component, HTMLAttributes } from 'react';\nimport {\n createGetImport,\n createObjectPattern,\n createVariableDeclaration,\n} from './ast';\nimport { getBabel } from './babel';\n\ninterface RunnerProps extends HTMLAttributes<HTMLDivElement> {\n code: string;\n language: string;\n getImport: (name: string, getDefault?: boolean) => void;\n}\n\ninterface RunnerState {\n error?: Error;\n comp: any;\n}\n\nclass Runner extends Component<RunnerProps, RunnerState> {\n static getDerivedStateFromError(error: Error) {\n return {\n error,\n comp: null,\n };\n }\n\n timer: any;\n\n constructor(props: RunnerProps) {\n super(props);\n\n this.state = {\n error: undefined,\n comp: null,\n };\n\n this.doCompile = this.doCompile.bind(this);\n this.waitCompile = this.waitCompile.bind(this);\n }\n\n waitCompile(targetCode: string) {\n if (this.timer) {\n clearTimeout(this.timer);\n }\n this.timer = setTimeout(() => {\n this.timer = null;\n this.doCompile(targetCode);\n }, 600);\n }\n\n async doCompile(targetCode: string) {\n const { language, getImport } = this.props;\n const babel = await getBabel();\n try {\n const presets = [\n [babel.availablePresets.react],\n [babel.availablePresets.env, { modules: 'commonjs' }],\n ];\n if (language === 'tsx' || language === 'ts') {\n presets.unshift([\n babel.availablePresets.typescript,\n {\n allExtensions: true,\n isTSX: language === 'tsx',\n },\n ]);\n }\n const result = babel.transform(targetCode, {\n sourceType: 'module',\n presets,\n plugins: [\n {\n visitor: {\n ImportDeclaration(path) {\n const pkg = path.node.source.value;\n const code: Node[] = [];\n for (const specifier of path.node.specifiers) {\n // import X from 'xxx'\n if (specifier.type === 'ImportDefaultSpecifier') {\n // const ${specifier.local.name} = __get_import()\n code.push(\n createVariableDeclaration(\n specifier.local.name,\n createGetImport(pkg, true),\n ),\n );\n }\n // import * as X from 'xxx'\n if (specifier.type === 'ImportNamespaceSpecifier') {\n // const ${specifier.local.name} = __get_import()\n code.push(\n createVariableDeclaration(\n specifier.local.name,\n createGetImport(pkg),\n ),\n );\n }\n // import { a, b, c } from 'xxx'\n if (specifier.type === 'ImportSpecifier') {\n // const {${specifier.local.name}} = __get_import()\n code.push(\n createVariableDeclaration(\n createObjectPattern([specifier.local.name]),\n createGetImport(pkg),\n ),\n );\n }\n }\n path.replaceWithMultiple(code);\n },\n },\n },\n ],\n });\n\n // Code has been updated\n if (targetCode !== this.props.code || !result || !result.code) {\n return;\n }\n\n const runExports: any = {};\n // eslint-disable-next-line @typescript-eslint/no-implied-eval, no-new-func\n const func = new Function('__get_import', 'exports', result.code);\n func(getImport, runExports);\n\n if (runExports.default) {\n this.setState({\n error: undefined,\n comp: React.createElement(runExports.default),\n });\n return;\n }\n\n this.setState({\n error: new Error('No default export'),\n comp: null,\n });\n } catch (e) {\n // Code has been updated\n if (targetCode !== this.props.code) {\n return;\n }\n console.error(e);\n this.setState({\n error: e as Error,\n comp: null,\n });\n }\n }\n\n componentDidCatch(error: Error, errorInfo: React.ErrorInfo) {\n console.error(error);\n console.error(errorInfo);\n }\n\n componentDidMount() {\n this.doCompile(this.props.code);\n }\n\n componentDidUpdate(prevProps: RunnerProps) {\n if (prevProps.code !== this.props.code) {\n this.waitCompile(this.props.code);\n }\n }\n\n render() {\n const { className = '', code, language, getImport, ...rest } = this.props;\n const { error, comp } = this.state;\n\n if (error) {\n return (\n <div className={`rspress-playground-runner ${className}`} {...rest}>\n <span style={{ color: 'red' }}>{error.message}</span>\n </div>\n );\n }\n\n return (\n <div className={`rspress-playground-runner ${className}`} {...rest}>\n {comp}\n </div>\n );\n }\n}\n\nexport { Runner };\n","import type {\n CallExpression,\n Expression,\n ObjectPattern,\n VariableDeclaration,\n} from '@babel/types';\n\nexport function createVariableDeclaration(\n id: string | ObjectPattern,\n init: Expression,\n): VariableDeclaration {\n return {\n type: 'VariableDeclaration',\n declarations: [\n {\n type: 'VariableDeclarator',\n id:\n typeof id === 'string'\n ? {\n type: 'Identifier',\n name: id,\n }\n : id,\n init,\n },\n ],\n kind: 'const',\n };\n}\n\nexport function createObjectPattern(names: string[]): ObjectPattern {\n return {\n type: 'ObjectPattern',\n properties: names.map(name => ({\n type: 'ObjectProperty',\n key: {\n type: 'Identifier',\n name,\n },\n computed: false,\n method: false,\n shorthand: true,\n value: {\n type: 'Identifier',\n name,\n },\n })),\n };\n}\n\nexport function createGetImport(\n name: string,\n getDefault?: boolean,\n): CallExpression {\n return {\n type: 'CallExpression',\n callee: {\n type: 'Identifier',\n name: '__get_import',\n },\n arguments: [\n {\n type: 'StringLiteral',\n value: name,\n },\n {\n type: 'BooleanLiteral',\n value: Boolean(getDefault),\n },\n ],\n };\n}\n","const loadingMap = new Map<string, Promise<void>>();\n\nexport function loadScript(url: string): Promise<void> {\n const exists = loadingMap.get(url);\n if (exists) {\n return exists;\n }\n const n: Promise<void> = new Promise(resolve => {\n const e = document.createElement('script');\n e.src = url;\n e.onload = () => resolve();\n document.body.appendChild(e);\n });\n loadingMap.set(url, n);\n return n;\n}\n\nexport function normalizeUrl(u: string) {\n return u.replace(/\\/\\//g, '/');\n}\n","import type babel from '@babel/standalone';\nimport { DEFAULT_BABEL_URL } from './constant';\nimport { loadScript } from './utils';\n\ndeclare global {\n // inject by builder in cli/index.ts\n // see: https://modernjs.dev/builder/api/config-source.html#sourcedefine\n const __PLAYGROUND_BABEL_URL__: any;\n interface Window {\n Babel: typeof babel;\n }\n}\n\nasync function getBabel() {\n if (!window.Babel) {\n let babelUrl = DEFAULT_BABEL_URL;\n try {\n const u = __PLAYGROUND_BABEL_URL__;\n if (u) {\n babelUrl = u;\n }\n } catch (e) {\n // ignore\n }\n await loadScript(babelUrl);\n }\n return window.Babel;\n}\n\nexport { getBabel };\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rspress/plugin-playground",
3
- "version": "0.0.0-nightly-20230919160314",
3
+ "version": "0.1.0",
4
4
  "description": "A plugin for rspress to preview the code block in markdown/mdx file.",
5
5
  "bugs": "https://github.com/web-infra-dev/rspress/issues",
6
6
  "repository": {
@@ -32,13 +32,12 @@
32
32
  "dist/"
33
33
  ],
34
34
  "dependencies": {
35
- "@babel/standalone": "^7.22.17",
36
35
  "@mdx-js/mdx": "2.2.1",
37
- "@modern-js/utils": "2.34.0",
36
+ "@modern-js/utils": "2.35.1",
38
37
  "@monaco-editor/react": "~4.4.6",
39
38
  "@oxidation-compiler/napi": "^0.1.0",
40
39
  "remark-gfm": "3.0.1",
41
- "@rspress/shared": "0.0.0-nightly-20230919160314"
40
+ "@rspress/shared": "0.1.0"
42
41
  },
43
42
  "devDependencies": {
44
43
  "@babel/types": "^7.22.17",
@@ -60,7 +59,7 @@
60
59
  "unist-util-visit": "^4.1.1"
61
60
  },
62
61
  "peerDependencies": {
63
- "@rspress/core": "0.0.0-nightly-20230919160314",
62
+ "@rspress/core": "*",
64
63
  "react": ">=17",
65
64
  "react-router-dom": "^6.8.1"
66
65
  },