@rspress/plugin-playground 1.43.0-canary-20240224 → 1.43.0-canary-202503021457

package/dist/cli/cjs/index.js

@@ -207,6 +207,7 @@ var __webpack_exports__ = {};
     var external_node_fs_default = /*#__PURE__*/ __webpack_require__.n(external_node_fs_namespaceObject);
     const external_node_path_namespaceObject = require("node:path");
     var external_node_path_default = /*#__PURE__*/ __webpack_require__.n(external_node_path_namespaceObject);
+    const node_utils_namespaceObject = require("@rspress/shared/node-utils");
     const external_rspack_plugin_virtual_module_namespaceObject = require("rspack-plugin-virtual-module");
     const DEFAULT_BABEL_URL = 'https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/7.22.20/babel.min.js';
     const DEFAULT_MONACO_URL = 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.43.0/min/vs';
@@ -229,15 +230,11 @@ var __webpack_exports__ = {};
         });
         return result;
     };
-    const getNodeAttribute = (node, attrName)=>{
-        var _node_attributes_find;
-        return null === (_node_attributes_find = node.attributes.find((attr)=>attr.name === attrName)) || void 0 === _node_attributes_find ? void 0 : _node_attributes_find.value;
-    };
     const getNodeMeta = (node, metaName)=>{
         if (!node.meta) return;
         const meta = node.meta.split(' ');
         const item = meta.find((x)=>x.startsWith(metaName));
-        if (null == item ? void 0 : item.startsWith(`${metaName}=`)) return item.substring(metaName.length + 1);
+        if (null == item ? void 0 : item.startsWith(`${metaName}=`)) return item.slice(metaName.length + 1);
         return item;
     };
     function createPlaygroundNode(currentNode, attrs) {
@@ -258,15 +255,15 @@ var __webpack_exports__ = {};
             if (!route) return;
             (0, lib.Vn)(tree, 'mdxJsxFlowElement', (node)=>{
                 if ('code' === node.name) {
-                    const src = getNodeAttribute(node, 'src');
-                    if (!src) return;
+                    const src = (0, node_utils_namespaceObject.getNodeAttribute)(node, 'src');
+                    if ('string' != typeof src) return;
                     const demoPath = (0, external_node_path_namespaceObject.join)((0, external_node_path_namespaceObject.dirname)(route.absolutePath), src);
                     if (!external_node_fs_default().existsSync(demoPath)) return;
-                    const direction = getNodeAttribute(node, 'direction') || '';
+                    const direction = (0, node_utils_namespaceObject.getNodeAttribute)(node, 'direction') || '';
                     const code = external_node_fs_default().readFileSync(demoPath, {
                         encoding: 'utf8'
                     });
-                    const language = src.substr(src.lastIndexOf('.') + 1);
+                    const language = src.slice(src.lastIndexOf('.') + 1);
                     createPlaygroundNode(node, [
                         [
                             'code',
@@ -290,8 +287,8 @@ var __webpack_exports__ = {};
             (0, lib.Vn)(tree, 'code', (node)=>{
                 if ('jsx' === node.lang || 'tsx' === node.lang) {
                     var _node_meta, _node_meta1;
-                    const hasPureMeta = null == node ? void 0 : null === (_node_meta = node.meta) || void 0 === _node_meta ? void 0 : _node_meta.includes('pure');
-                    const hasPlaygroundMeta = null == node ? void 0 : null === (_node_meta1 = node.meta) || void 0 === _node_meta1 ? void 0 : _node_meta1.includes('playground');
+                    const hasPureMeta = null === (_node_meta = node.meta) || void 0 === _node_meta ? void 0 : _node_meta.includes('pure');
+                    const hasPlaygroundMeta = null === (_node_meta1 = node.meta) || void 0 === _node_meta1 ? void 0 : _node_meta1.includes('playground');
                     let noTransform;
                     switch(defaultRenderMode){
                         case 'pure':
@@ -367,8 +364,8 @@ var __webpack_exports__ = {};
                         const ast = processor.parse(source);
                         visit(ast, 'mdxJsxFlowElement', (node)=>{
                             if ('code' === node.name) {
-                                const src = getNodeAttribute(node, 'src');
-                                if (!src) return;
+                                const src = (0, node_utils_namespaceObject.getNodeAttribute)(node, 'src');
+                                if ('string' != typeof src) return;
                                 const demoPath = (0, external_node_path_namespaceObject.join)(external_node_path_default().dirname(filepath), src);
                                 if (!external_node_fs_default().existsSync(demoPath)) return;
                                 const code = external_node_fs_default().readFileSync(demoPath, {

package/dist/cli/esm/index.mjs

@@ -1,5 +1,8 @@
+import { fileURLToPath as __webpack_fileURLToPath__ } from "node:url";
+import { dirname as __webpack_dirname__ } from "node:path";
 import * as __WEBPACK_EXTERNAL_MODULE_node_fs_5ea92f0c__ from "node:fs";
 import * as __WEBPACK_EXTERNAL_MODULE_node_path_c5b9b54f__ from "node:path";
+import * as __WEBPACK_EXTERNAL_MODULE__rspress_shared_node_utils_78947ce6__ from "@rspress/shared/node-utils";
 import * as __WEBPACK_EXTERNAL_MODULE_rspack_plugin_virtual_module_609978fd__ from "rspack-plugin-virtual-module";
 import * as __WEBPACK_EXTERNAL_MODULE__oxidation_compiler_napi_5e24345a__ from "@oxidation-compiler/napi";
 var __webpack_modules__ = {
@@ -200,7 +203,8 @@ const DEFAULT_MONACO_URL = 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor
 function normalizeUrl(u) {
     return u.replace(/\/\//g, '/');
 }
-const staticPath = __WEBPACK_EXTERNAL_MODULE_node_path_c5b9b54f__["default"].join(__dirname, '../../../static');
+var constant_dirname = __webpack_dirname__(__webpack_fileURLToPath__(import.meta.url));
+const staticPath = __WEBPACK_EXTERNAL_MODULE_node_path_c5b9b54f__["default"].join(constant_dirname, '../../../static');
 var lib = __webpack_require__("../../node_modules/.pnpm/unist-util-visit@4.1.2/node_modules/unist-util-visit/lib/index.js");
 const parseImports = (code, sourceExt)=>{
     const parsed = __WEBPACK_EXTERNAL_MODULE__oxidation_compiler_napi_5e24345a__["default"].parseSync(code, {
@@ -214,15 +218,11 @@ const parseImports = (code, sourceExt)=>{
     });
     return result;
 };
-const getNodeAttribute = (node, attrName)=>{
-    var _node_attributes_find;
-    return null === (_node_attributes_find = node.attributes.find((attr)=>attr.name === attrName)) || void 0 === _node_attributes_find ? void 0 : _node_attributes_find.value;
-};
 const getNodeMeta = (node, metaName)=>{
     if (!node.meta) return;
     const meta = node.meta.split(' ');
     const item = meta.find((x)=>x.startsWith(metaName));
-    if (null == item ? void 0 : item.startsWith(`${metaName}=`)) return item.substring(metaName.length + 1);
+    if (null == item ? void 0 : item.startsWith(`${metaName}=`)) return item.slice(metaName.length + 1);
     return item;
 };
 function createPlaygroundNode(currentNode, attrs) {
@@ -243,15 +243,15 @@ const remarkPlugin = ({ getRouteMeta, editorPosition, defaultRenderMode })=>{
         if (!route) return;
         (0, lib.Vn)(tree, 'mdxJsxFlowElement', (node)=>{
             if ('code' === node.name) {
-                const src = getNodeAttribute(node, 'src');
-                if (!src) return;
+                const src = (0, __WEBPACK_EXTERNAL_MODULE__rspress_shared_node_utils_78947ce6__.getNodeAttribute)(node, 'src');
+                if ('string' != typeof src) return;
                 const demoPath = (0, __WEBPACK_EXTERNAL_MODULE_node_path_c5b9b54f__.join)((0, __WEBPACK_EXTERNAL_MODULE_node_path_c5b9b54f__.dirname)(route.absolutePath), src);
                 if (!__WEBPACK_EXTERNAL_MODULE_node_fs_5ea92f0c__["default"].existsSync(demoPath)) return;
-                const direction = getNodeAttribute(node, 'direction') || '';
+                const direction = (0, __WEBPACK_EXTERNAL_MODULE__rspress_shared_node_utils_78947ce6__.getNodeAttribute)(node, 'direction') || '';
                 const code = __WEBPACK_EXTERNAL_MODULE_node_fs_5ea92f0c__["default"].readFileSync(demoPath, {
                     encoding: 'utf8'
                 });
-                const language = src.substr(src.lastIndexOf('.') + 1);
+                const language = src.slice(src.lastIndexOf('.') + 1);
                 createPlaygroundNode(node, [
                     [
                         'code',
@@ -275,8 +275,8 @@ const remarkPlugin = ({ getRouteMeta, editorPosition, defaultRenderMode })=>{
         (0, lib.Vn)(tree, 'code', (node)=>{
             if ('jsx' === node.lang || 'tsx' === node.lang) {
                 var _node_meta, _node_meta1;
-                const hasPureMeta = null == node ? void 0 : null === (_node_meta = node.meta) || void 0 === _node_meta ? void 0 : _node_meta.includes('pure');
-                const hasPlaygroundMeta = null == node ? void 0 : null === (_node_meta1 = node.meta) || void 0 === _node_meta1 ? void 0 : _node_meta1.includes('playground');
+                const hasPureMeta = null === (_node_meta = node.meta) || void 0 === _node_meta ? void 0 : _node_meta.includes('pure');
+                const hasPlaygroundMeta = null === (_node_meta1 = node.meta) || void 0 === _node_meta1 ? void 0 : _node_meta1.includes('playground');
                 let noTransform;
                 switch(defaultRenderMode){
                     case 'pure':
@@ -312,6 +312,7 @@ const remarkPlugin = ({ getRouteMeta, editorPosition, defaultRenderMode })=>{
         });
     };
 };
+var cli_rslib_entry_dirname = __webpack_dirname__(__webpack_fileURLToPath__(import.meta.url));
 let cli_rslib_entry_routeMeta;
 function pluginPlayground(options) {
     var _monacoLoader_paths;
@@ -352,8 +353,8 @@ function pluginPlayground(options) {
                     const ast = processor.parse(source);
                     visit(ast, 'mdxJsxFlowElement', (node)=>{
                         if ('code' === node.name) {
-                            const src = getNodeAttribute(node, 'src');
-                            if (!src) return;
+                            const src = (0, __WEBPACK_EXTERNAL_MODULE__rspress_shared_node_utils_78947ce6__.getNodeAttribute)(node, 'src');
+                            if ('string' != typeof src) return;
                             const demoPath = (0, __WEBPACK_EXTERNAL_MODULE_node_path_c5b9b54f__.join)(__WEBPACK_EXTERNAL_MODULE_node_path_c5b9b54f__["default"].dirname(filepath), src);
                             if (!__WEBPACK_EXTERNAL_MODULE_node_fs_5ea92f0c__["default"].existsSync(demoPath)) return;
                             const code = __WEBPACK_EXTERNAL_MODULE_node_fs_5ea92f0c__["default"].readFileSync(demoPath, {
@@ -427,7 +428,7 @@ function pluginPlayground(options) {
                     __PLAYGROUND_BABEL_URL__: JSON.stringify(babelUrl)
                 },
                 include: [
-                    (0, __WEBPACK_EXTERNAL_MODULE_node_path_c5b9b54f__.join)(__dirname, '..', '..', '..')
+                    (0, __WEBPACK_EXTERNAL_MODULE_node_path_c5b9b54f__.join)(cli_rslib_entry_dirname, '..', '..', '..')
                 ]
             },
             html: {

package/dist/web/cjs/index.js

@@ -59,14 +59,14 @@ function initLoader() {
     try {
         const keys = Object.keys(__PLAYGROUND_MONACO_LOADER__);
         if (keys.length > 0) loaderConfig = __PLAYGROUND_MONACO_LOADER__;
-    } catch (e) {}
+    } catch (_e) {}
     react_namespaceObject.loader.config(loaderConfig);
 }
 initLoader();
 function getMonacoOptions() {
     try {
         return __PLAYGROUND_MONACO_OPTIONS__;
-    } catch (e) {}
+    } catch (_e) {}
     return {};
 }
 function Editor(props) {
@@ -79,9 +79,9 @@ function Editor(props) {
         themeProp,
         dark
     ]);
-    return /*#__PURE__*/ external_react_default().createElement("div", {
+    return /*#__PURE__*/ React.createElement("div", {
         className: `rspress-playground-editor ${className}`
-    }, /*#__PURE__*/ external_react_default().createElement(react_default(), {
+    }, /*#__PURE__*/ React.createElement(react_default(), {
         ...rest,
         theme: theme,
         options: {
@@ -187,6 +187,16 @@ async function getBabel() {
         throw e;
     }
 }
+function _define_property(obj, key, value) {
+    if (key in obj) Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+    });
+    else obj[key] = value;
+    return obj;
+}
 const DEBOUNCE_TIME = 800;
 class Runner extends external_react_namespaceObject.Component {
     static getDerivedStateFromError(error) {
@@ -197,7 +207,7 @@ class Runner extends external_react_namespaceObject.Component {
     }
     waitCompile(targetCode) {
         if (this.timer) clearTimeout(this.timer);
-        this.timer = setTimeout(()=>{
+        this.timer = window.setTimeout(()=>{
             this.timer = null;
             this.doCompile(targetCode);
         }, DEBOUNCE_TIME);
@@ -303,7 +313,7 @@ class Runner extends external_react_namespaceObject.Component {
         }, error.message));
     }
     constructor(props){
-        super(props);
+        super(props), _define_property(this, "timer", null);
         this.state = {
             error: void 0,
             comp: null

package/dist/web/esm/index.d.ts

@@ -5,6 +5,7 @@ import { default as MonacoEditor } from '@monaco-editor/react';
 import { loader as MonacoEditorLoader } from '@monaco-editor/react';
 import { EditorProps as MonacoEditorProps } from '@monaco-editor/react';
 import { default as React_2 } from 'react';
+import { ReactElement } from 'react';
 
 export declare function Editor(props: EditorProps): JSX_2.Element;
 
@@ -21,7 +22,7 @@ export declare class Runner extends Component<RunnerProps, RunnerState> {
         error: Error;
         comp: null;
     };
-    timer: any;
+    timer: number | null;
     constructor(props: RunnerProps);
     waitCompile(targetCode: string): void;
     doCompile(targetCode: string): Promise<void>;
@@ -39,7 +40,7 @@ declare interface RunnerProps extends HTMLAttributes<HTMLDivElement> {
 
 declare interface RunnerState {
     error?: Error;
-    comp: any;
+    comp: ReactElement | null;
 }
 
 export { }

package/dist/web/esm/index.mjs

@@ -1,4 +1,5 @@
 import * as __WEBPACK_EXTERNAL_MODULE__monaco_editor_react_be42f315__ from "@monaco-editor/react";
+import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
 import * as __WEBPACK_EXTERNAL_MODULE__rspress_core_runtime_7dc96146__ from "@rspress/core/runtime";
 import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
 const DEFAULT_MONACO_URL = 'https://cdnjs.cloudflare.com/ajax/libs/monaco-editor/0.43.0/min/vs';
@@ -11,14 +12,14 @@ function initLoader() {
     try {
         const keys = Object.keys(__PLAYGROUND_MONACO_LOADER__);
         if (keys.length > 0) loaderConfig = __PLAYGROUND_MONACO_LOADER__;
-    } catch (e) {}
+    } catch (_e) {}
     __WEBPACK_EXTERNAL_MODULE__monaco_editor_react_be42f315__.loader.config(loaderConfig);
 }
 initLoader();
 function getMonacoOptions() {
     try {
         return __PLAYGROUND_MONACO_OPTIONS__;
-    } catch (e) {}
+    } catch (_e) {}
     return {};
 }
 function Editor(props) {
@@ -31,31 +32,32 @@ function Editor(props) {
         themeProp,
         dark
     ]);
-    return /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement("div", {
-        className: `rspress-playground-editor ${className}`
-    }, /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__monaco_editor_react_be42f315__["default"], {
-        ...rest,
-        theme: theme,
-        options: {
-            minimap: {
-                enabled: true,
-                autohide: true
-            },
-            fontSize: 14,
-            lineNumbersMinChars: 7,
-            scrollBeyondLastLine: false,
-            automaticLayout: true,
-            wordBasedSuggestions: true,
-            quickSuggestions: true,
-            scrollbar: {
-                verticalScrollbarSize: 8,
-                horizontalScrollbarSize: 8
-            },
-            scrollPredominantAxis: false,
-            ...getMonacoOptions(),
-            ...options
-        }
-    }));
+    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("div", {
+        className: `rspress-playground-editor ${className}`,
+        children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__monaco_editor_react_be42f315__["default"], {
+            ...rest,
+            theme: theme,
+            options: {
+                minimap: {
+                    enabled: true,
+                    autohide: true
+                },
+                fontSize: 14,
+                lineNumbersMinChars: 7,
+                scrollBeyondLastLine: false,
+                automaticLayout: true,
+                wordBasedSuggestions: true,
+                quickSuggestions: true,
+                scrollbar: {
+                    verticalScrollbarSize: 8,
+                    horizontalScrollbarSize: 8
+                },
+                scrollPredominantAxis: false,
+                ...getMonacoOptions(),
+                ...options
+            }
+        })
+    });
 }
 function createVariableDeclaration(id, init) {
     return {
@@ -139,6 +141,16 @@ async function getBabel() {
         throw e;
     }
 }
+function _define_property(obj, key, value) {
+    if (key in obj) Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+    });
+    else obj[key] = value;
+    return obj;
+}
 const DEBOUNCE_TIME = 800;
 class Runner extends __WEBPACK_EXTERNAL_MODULE_react__.Component {
     static getDerivedStateFromError(error) {
@@ -149,7 +161,7 @@ class Runner extends __WEBPACK_EXTERNAL_MODULE_react__.Component {
     }
     waitCompile(targetCode) {
         if (this.timer) clearTimeout(this.timer);
-        this.timer = setTimeout(()=>{
+        this.timer = window.setTimeout(()=>{
             this.timer = null;
             this.doCompile(targetCode);
         }, DEBOUNCE_TIME);
@@ -247,15 +259,20 @@ class Runner extends __WEBPACK_EXTERNAL_MODULE_react__.Component {
     render() {
         const { className = '', code, language, getImport, ...rest } = this.props;
         const { error, comp } = this.state;
-        return /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement("div", {
+        return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)("div", {
             className: `rspress-playground-runner ${className}`,
-            ...rest
-        }, comp, error && /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement("pre", {
-            className: "rspress-playground-error"
-        }, error.message));
+            ...rest,
+            children: [
+                comp,
+                error && /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("pre", {
+                    className: "rspress-playground-error",
+                    children: error.message
+                })
+            ]
+        });
     }
     constructor(props){
-        super(props);
+        super(props), _define_property(this, "timer", null);
         this.state = {
             error: void 0,
             comp: null

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rspress/plugin-playground",
-  "version": "1.43.0-canary-20240224",
+  "version": "1.43.0-canary-202503021457",
   "description": "A plugin for rspress to preview the code block in markdown/mdx file.",
   "bugs": "https://github.com/web-infra-dev/rspress/issues",
   "repository": {
@@ -34,11 +34,12 @@
     "@oxidation-compiler/napi": "^0.2.0",
     "remark-gfm": "3.0.1",
     "rspack-plugin-virtual-module": "0.1.13",
-    "@rspress/shared": "1.43.0-canary-20240224"
+    "@rspress/shared": "1.43.0-canary-202503021457"
   },
   "devDependencies": {
     "@babel/types": "^7.26.7",
-    "@rslib/core": "0.4.1",
+    "@rsbuild/plugin-react": "~1.1.0",
+    "@rslib/core": "0.5.2",
     "@types/babel__core": "^7.20.5",
     "@types/babel__standalone": "^7.1.9",
     "@types/babel__traverse": "^7.20.6",
@@ -46,6 +47,7 @@
     "@types/node": "^18.11.17",
     "@types/react": "^18.3.18",
     "@types/react-dom": "^18.3.5",
+    "mdast-util-mdx-jsx": "^2.1.4",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-router-dom": "^6.29.0",
@@ -54,7 +56,7 @@
     "unist-util-visit": "^4.1.2"
   },
   "peerDependencies": {
-    "@rspress/core": "^1.42.0",
+    "@rspress/core": "^1.43.0-canary-202503021457",
     "react": ">=17.0.0",
     "react-router-dom": "^6.8.1"
   },

package/static/global-components/Playground.tsx

@@ -1,4 +1,5 @@
 import { usePageData } from '@rspress/core/runtime';
+// @ts-ignore Cannot find module _rspress_playground_imports
 import getImport from '_rspress_playground_imports';
 import React, {
   type HTMLAttributes,
@@ -10,7 +11,7 @@ import { Editor, Runner } from '../../dist/web/esm';
 
 // inject by builder in cli/index.ts
 declare global {
-  const __PLAYGROUND_DIRECTION__: any;
+  const __PLAYGROUND_DIRECTION__: Direction;
 }
 
 type Direction = 'horizontal' | 'vertical';
@@ -45,7 +46,7 @@ function useDirection(props: PlaygroundProps): Direction {
   // inject by config
   try {
     return __PLAYGROUND_DIRECTION__;
-  } catch (e) {
+  } catch (_e) {
     // ignore
   }