@rspress/plugin-preview 1.46.2 → 1.47.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.
Files changed (4) hide show
  1. package/dist/index.js +501 -328
  2. package/package.json +4 -4
  3. package/static/env.d.ts +6 -0
  4. package/static/global-components/ContainerFixedPerComp.tsx +26 -3
package/dist/index.js CHANGED
@@ -1,5 +1,359 @@
1
1
  "use strict";
2
2
  var __webpack_modules__ = {
3
+ "./src/ast-helpers.ts": function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
4
+ __webpack_require__.d(__webpack_exports__, {
5
+ Wv: ()=>inferLanguageFromPath,
6
+ cQ: ()=>getExternalDemoContent,
7
+ en: ()=>createOtherFilesProp,
8
+ qz: ()=>getASTNodeImport
9
+ });
10
+ var node_path__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("node:path");
11
+ const getASTNodeImport = (name, from)=>({
12
+ type: 'mdxjsEsm',
13
+ value: `import ${name} from ${JSON.stringify(from)}`,
14
+ data: {
15
+ estree: {
16
+ type: 'Program',
17
+ sourceType: 'module',
18
+ body: [
19
+ {
20
+ type: 'ImportDeclaration',
21
+ specifiers: [
22
+ {
23
+ type: 'ImportDefaultSpecifier',
24
+ local: {
25
+ type: 'Identifier',
26
+ name
27
+ }
28
+ }
29
+ ],
30
+ source: {
31
+ type: 'Literal',
32
+ value: from,
33
+ raw: `${JSON.stringify(from)}`
34
+ }
35
+ }
36
+ ]
37
+ }
38
+ }
39
+ });
40
+ const getExternalDemoContent = (tempVar, language = 'tsx')=>({
41
+ type: 'mdxJsxFlowElement',
42
+ name: '',
43
+ attributes: [],
44
+ children: [
45
+ {
46
+ type: 'mdxJsxFlowElement',
47
+ name: 'pre',
48
+ attributes: [],
49
+ children: [
50
+ {
51
+ type: 'mdxJsxFlowElement',
52
+ name: 'code',
53
+ attributes: [
54
+ {
55
+ type: 'mdxJsxAttribute',
56
+ name: 'className',
57
+ value: `language-${language}`
58
+ },
59
+ {
60
+ type: 'mdxJsxAttribute',
61
+ name: 'children',
62
+ value: {
63
+ type: 'mdxJsxExpressionAttribute',
64
+ value: tempVar,
65
+ data: {
66
+ estree: {
67
+ type: 'Program',
68
+ body: [
69
+ {
70
+ type: 'ExpressionStatement',
71
+ expression: {
72
+ type: 'Identifier',
73
+ name: tempVar
74
+ }
75
+ }
76
+ ]
77
+ }
78
+ }
79
+ }
80
+ }
81
+ ]
82
+ }
83
+ ]
84
+ }
85
+ ]
86
+ });
87
+ function createProp(propName, propValue) {
88
+ return {
89
+ type: 'mdxJsxAttribute',
90
+ name: propName,
91
+ value: {
92
+ type: 'mdxJsxAttributeValueExpression',
93
+ value: JSON.stringify(propValue),
94
+ data: {
95
+ estree: {
96
+ type: 'Program',
97
+ body: [
98
+ propValue
99
+ ],
100
+ sourceType: 'module'
101
+ }
102
+ }
103
+ }
104
+ };
105
+ }
106
+ function createOtherFilesProp(otherFilesAttr) {
107
+ return createProp('otherFiles', {
108
+ type: 'ExpressionStatement',
109
+ expression: {
110
+ type: 'ArrayExpression',
111
+ elements: otherFilesAttr.map((file)=>({
112
+ type: 'Literal',
113
+ value: file,
114
+ raw: JSON.stringify(file)
115
+ }))
116
+ }
117
+ });
118
+ }
119
+ const SUPPORTED_CODE_LANGUAGES = new Set([
120
+ 'js',
121
+ 'jsx',
122
+ 'ts',
123
+ 'tsx',
124
+ 'json',
125
+ 'css',
126
+ 'less',
127
+ 'scss',
128
+ 'sass',
129
+ 'md',
130
+ 'mdx',
131
+ 'html'
132
+ ]);
133
+ const sanitizeLanguageValue = (language)=>{
134
+ const normalized = language.replace(/[^0-9a-z-]/gi, '');
135
+ return normalized || 'tsx';
136
+ };
137
+ const inferLanguageFromPath = (filePath)=>{
138
+ const ext = sanitizeLanguageValue((0, node_path__WEBPACK_IMPORTED_MODULE_0__.extname)(filePath).slice(1).toLowerCase());
139
+ if (!ext) return 'tsx';
140
+ if (SUPPORTED_CODE_LANGUAGES.has(ext)) return ext;
141
+ if ('mjs' === ext || 'cjs' === ext) return 'js';
142
+ return 'tsx';
143
+ };
144
+ },
145
+ "./src/constant.ts": function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
146
+ __webpack_require__.d(__webpack_exports__, {
147
+ Dh: ()=>staticPath,
148
+ WE: ()=>demoBlockComponentPath,
149
+ qp: ()=>virtualDir
150
+ });
151
+ var node_path__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("node:path");
152
+ var node_path__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/ __webpack_require__.n(node_path__WEBPACK_IMPORTED_MODULE_0__);
153
+ var _rspress_shared__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("@rspress/shared");
154
+ const staticPath = node_path__WEBPACK_IMPORTED_MODULE_0___default().join(__dirname, '..', 'static');
155
+ const demoBlockComponentPath = node_path__WEBPACK_IMPORTED_MODULE_0___default().join(staticPath, 'global-components', 'DemoBlock.tsx');
156
+ const virtualDir = node_path__WEBPACK_IMPORTED_MODULE_0___default().join(process.cwd(), 'node_modules', _rspress_shared__WEBPACK_IMPORTED_MODULE_1__.RSPRESS_TEMP_DIR, 'virtual-demo');
157
+ },
158
+ "./src/remarkPlugin.ts": function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
159
+ __webpack_require__.d(__webpack_exports__, {
160
+ D: ()=>demos,
161
+ T: ()=>remarkCodeToDemo
162
+ });
163
+ var node_fs__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__("node:fs");
164
+ var node_fs__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/ __webpack_require__.n(node_fs__WEBPACK_IMPORTED_MODULE_0__);
165
+ var node_path__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__("node:path");
166
+ var node_path__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/ __webpack_require__.n(node_path__WEBPACK_IMPORTED_MODULE_1__);
167
+ var _rspress_shared__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__("@rspress/shared");
168
+ var _rspress_shared__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/ __webpack_require__.n(_rspress_shared__WEBPACK_IMPORTED_MODULE_2__);
169
+ var _rspress_shared_node_utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__("@rspress/shared/node-utils");
170
+ var _rspress_shared_node_utils__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/ __webpack_require__.n(_rspress_shared_node_utils__WEBPACK_IMPORTED_MODULE_3__);
171
+ var unist_util_visit__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__("../../node_modules/.pnpm/unist-util-visit@4.1.2/node_modules/unist-util-visit/lib/index.js");
172
+ var _ast_helpers__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__("./src/ast-helpers.ts");
173
+ var _constant__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__("./src/constant.ts");
174
+ var _utils__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__("./src/utils.ts?589a");
175
+ const demos = {};
176
+ const remarkCodeToDemo = function({ getRouteMeta, previewMode, defaultRenderMode, position, previewLanguages, previewCodeTransform }) {
177
+ const routeMeta = getRouteMeta();
178
+ node_fs__WEBPACK_IMPORTED_MODULE_0___default().mkdirSync(_constant__WEBPACK_IMPORTED_MODULE_5__.qp, {
179
+ recursive: true
180
+ });
181
+ const data = this.data();
182
+ return (tree, vfile)=>{
183
+ const demoMdx = [];
184
+ const route = routeMeta.find((meta)=>(0, _rspress_shared__WEBPACK_IMPORTED_MODULE_2__.normalizePosixPath)(meta.absolutePath) === (0, _rspress_shared__WEBPACK_IMPORTED_MODULE_2__.normalizePosixPath)(vfile.path || vfile.history[0]));
185
+ if (!route) return;
186
+ const { pageName } = route;
187
+ demos[pageName] = [];
188
+ let title = pageName;
189
+ let index = 1;
190
+ let externalDemoIndex = 0;
191
+ function constructDemoNode(demoId, demoPath, currentNode, isMobileMode, externalDemoIndex) {
192
+ if (isMobileMode) {
193
+ const relativePathReg = new RegExp(/^\.\.?\/.*$/);
194
+ demos[pageName].push({
195
+ title,
196
+ id: demoId,
197
+ path: relativePathReg.test(demoPath) ? (0, node_path__WEBPACK_IMPORTED_MODULE_1__.resolve)(vfile.dirname || (0, node_path__WEBPACK_IMPORTED_MODULE_1__.dirname)(vfile.path), demoPath) : demoPath
198
+ });
199
+ } else demoMdx.push((0, _ast_helpers__WEBPACK_IMPORTED_MODULE_4__.qz)(`Demo${demoId}`, demoPath));
200
+ const tempVar = `externalDemoContent${externalDemoIndex}`;
201
+ if (void 0 !== externalDemoIndex) demoMdx.push((0, _ast_helpers__WEBPACK_IMPORTED_MODULE_4__.qz)(tempVar, `!!${demoPath}?raw`));
202
+ if (isMobileMode && 'fixed' === position) void 0 !== externalDemoIndex && Object.assign(currentNode, (0, _ast_helpers__WEBPACK_IMPORTED_MODULE_4__.cQ)(tempVar));
203
+ else if ('fixed-with-per-comp' === position) {
204
+ var _getNodeAttribute;
205
+ const entryFilePath = (0, _rspress_shared__WEBPACK_IMPORTED_MODULE_2__.normalizePosixPath)(demoPath);
206
+ const otherFiles = 'code' === currentNode.type ? [] : eval((null == (_getNodeAttribute = (0, _rspress_shared_node_utils__WEBPACK_IMPORTED_MODULE_3__.getNodeAttribute)(currentNode, 'otherFiles')) ? void 0 : _getNodeAttribute.value) ?? '[]');
207
+ const otherFilesAttr = otherFiles.map((filePath, idx)=>{
208
+ const demoPath = (0, node_path__WEBPACK_IMPORTED_MODULE_1__.resolve)(vfile.dirname || (0, node_path__WEBPACK_IMPORTED_MODULE_1__.dirname)(vfile.path), filePath);
209
+ const tempVar = `Demo${demoId}OtherFile${idx}`;
210
+ demoMdx.push((0, _ast_helpers__WEBPACK_IMPORTED_MODULE_4__.qz)(tempVar, `!!${demoPath}?raw`));
211
+ const language = (0, _ast_helpers__WEBPACK_IMPORTED_MODULE_4__.Wv)(filePath);
212
+ return {
213
+ label: (0, _rspress_shared__WEBPACK_IMPORTED_MODULE_2__.normalizePosixPath)((0, node_path__WEBPACK_IMPORTED_MODULE_1__.relative)(entryFilePath, filePath)),
214
+ tempVar,
215
+ language
216
+ };
217
+ });
218
+ const demoFileName = (0, node_path__WEBPACK_IMPORTED_MODULE_1__.basename)(demoPath);
219
+ const entryFile = '' === (0, node_path__WEBPACK_IMPORTED_MODULE_1__.extname)(demoFileName) ? `${demoFileName}.tsx` : demoFileName;
220
+ Object.assign(currentNode, {
221
+ type: 'mdxJsxFlowElement',
222
+ name: 'ContainerFixedPerComp',
223
+ attributes: [
224
+ {
225
+ type: 'mdxJsxAttribute',
226
+ name: 'isMobile',
227
+ value: isMobileMode
228
+ },
229
+ {
230
+ type: 'mdxJsxAttribute',
231
+ name: 'demoId',
232
+ value: demoId
233
+ },
234
+ {
235
+ type: 'mdxJsxAttribute',
236
+ name: 'entryFile',
237
+ value: entryFile
238
+ },
239
+ (0, _ast_helpers__WEBPACK_IMPORTED_MODULE_4__.en)(otherFilesAttr.map((i)=>i.label))
240
+ ],
241
+ children: [
242
+ void 0 === externalDemoIndex ? {
243
+ ...currentNode,
244
+ hasVisited: true
245
+ } : (0, _ast_helpers__WEBPACK_IMPORTED_MODULE_4__.cQ)(tempVar),
246
+ isMobileMode ? {
247
+ type: 'mdxJsxFlowElement',
248
+ name: null
249
+ } : {
250
+ type: 'mdxJsxFlowElement',
251
+ name: `Demo${demoId}`
252
+ },
253
+ ...otherFilesAttr.map((i)=>(0, _ast_helpers__WEBPACK_IMPORTED_MODULE_4__.cQ)(i.tempVar, i.language))
254
+ ]
255
+ });
256
+ } else Object.assign(currentNode, {
257
+ type: 'mdxJsxFlowElement',
258
+ name: 'Container',
259
+ attributes: [
260
+ {
261
+ type: 'mdxJsxAttribute',
262
+ name: 'isMobile',
263
+ value: isMobileMode
264
+ },
265
+ {
266
+ type: 'mdxJsxAttribute',
267
+ name: 'demoId',
268
+ value: demoId
269
+ }
270
+ ],
271
+ children: [
272
+ void 0 === externalDemoIndex ? {
273
+ ...currentNode,
274
+ hasVisited: true
275
+ } : (0, _ast_helpers__WEBPACK_IMPORTED_MODULE_4__.cQ)(tempVar),
276
+ isMobileMode ? {
277
+ type: 'mdxJsxFlowElement',
278
+ name: null
279
+ } : {
280
+ type: 'mdxJsxFlowElement',
281
+ name: `Demo${demoId}`
282
+ }
283
+ ]
284
+ });
285
+ }
286
+ (0, unist_util_visit__WEBPACK_IMPORTED_MODULE_6__.Vn)(tree, 'heading', (node)=>{
287
+ if (1 === node.depth) {
288
+ const firstChild = node.children[0];
289
+ title = firstChild && 'value' in firstChild && firstChild.value || title;
290
+ }
291
+ });
292
+ (0, unist_util_visit__WEBPACK_IMPORTED_MODULE_6__.Vn)(tree, 'mdxJsxFlowElement', (node)=>{
293
+ if ('code' === node.name) {
294
+ const src = (0, _rspress_shared_node_utils__WEBPACK_IMPORTED_MODULE_3__.getNodeAttribute)(node, 'src');
295
+ if ('string' != typeof src) return;
296
+ const currentMode = (0, _rspress_shared_node_utils__WEBPACK_IMPORTED_MODULE_3__.getNodeAttribute)(node, 'previewMode') ?? previewMode;
297
+ const isMobileAttr = (0, _rspress_shared_node_utils__WEBPACK_IMPORTED_MODULE_3__.getNodeAttribute)(node, 'isMobile');
298
+ let isMobileMode = false;
299
+ isMobileMode = void 0 === isMobileAttr ? 'iframe' === currentMode : null === isMobileAttr ? true : 'object' == typeof isMobileAttr ? 'false' !== isMobileAttr.value : 'false' !== isMobileAttr;
300
+ const id = (0, _utils__WEBPACK_IMPORTED_MODULE_7__.Ox)(pageName, index++);
301
+ constructDemoNode(id, src, node, isMobileMode, externalDemoIndex++);
302
+ }
303
+ });
304
+ (0, unist_util_visit__WEBPACK_IMPORTED_MODULE_6__.Vn)(tree, 'code', (node)=>{
305
+ if ('hasVisited' in node) return;
306
+ if (node.lang && previewLanguages.includes(node.lang)) {
307
+ var _node_meta, _node_meta1, _node_meta2, _node_meta3, _node_meta4, _node_meta5;
308
+ if ((null == (_node_meta = node.meta) ? void 0 : _node_meta.includes('pure')) || !(null == (_node_meta1 = node.meta) ? void 0 : _node_meta1.includes('preview')) && 'pure' === defaultRenderMode) return;
309
+ const value = (0, _utils__WEBPACK_IMPORTED_MODULE_7__.MQ)(previewCodeTransform({
310
+ language: node.lang,
311
+ code: node.value
312
+ }), _constant__WEBPACK_IMPORTED_MODULE_5__.WE);
313
+ const isMobileMode = (null == (_node_meta2 = node.meta) ? void 0 : _node_meta2.includes('mobile')) || (null == (_node_meta3 = node.meta) ? void 0 : _node_meta3.includes('iframe')) || !(null == (_node_meta4 = node.meta) ? void 0 : _node_meta4.includes('web')) && !(null == (_node_meta5 = node.meta) ? void 0 : _node_meta5.includes('internal')) && 'iframe' === previewMode;
314
+ const id = (0, _utils__WEBPACK_IMPORTED_MODULE_7__.Ox)(pageName, index++);
315
+ const virtualModulePath = (0, node_path__WEBPACK_IMPORTED_MODULE_1__.join)(_constant__WEBPACK_IMPORTED_MODULE_5__.qp, `${id}.tsx`);
316
+ constructDemoNode(id, virtualModulePath, node, isMobileMode);
317
+ if (node_fs__WEBPACK_IMPORTED_MODULE_0___default().existsSync(virtualModulePath)) {
318
+ const content = node_fs__WEBPACK_IMPORTED_MODULE_0___default().readFileSync(virtualModulePath, 'utf-8');
319
+ if (content === value) return;
320
+ }
321
+ node_fs__WEBPACK_IMPORTED_MODULE_0___default().writeFileSync(virtualModulePath, value);
322
+ }
323
+ });
324
+ tree.children.unshift(...demoMdx);
325
+ if (demos[pageName].length > 0) data.pageMeta.haveDemos = true;
326
+ };
327
+ };
328
+ },
329
+ "./src/utils.ts?589a": function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
330
+ __webpack_require__.d(__webpack_exports__, {
331
+ MQ: ()=>injectDemoBlockImport,
332
+ Ox: ()=>generateId,
333
+ nI: ()=>toValidVarName
334
+ });
335
+ const toValidVarName = (str)=>{
336
+ if (/^[a-zA-Z_$][0-9a-zA-Z_$]*$/.test(str)) return str;
337
+ return str.replace(/[^0-9a-zA-Z_$]/g, '_').replace(/^([0-9])/, '_$1');
338
+ };
339
+ const generateId = (pageName, index)=>`_${toValidVarName(pageName)}_${index}`;
340
+ const injectDemoBlockImport = (str, path)=>`
341
+ import DemoBlock from ${JSON.stringify(path)};
342
+ ${str}
343
+ `;
344
+ },
345
+ "@rspress/shared": function(module) {
346
+ module.exports = require("@rspress/shared");
347
+ },
348
+ "@rspress/shared/node-utils": function(module) {
349
+ module.exports = require("@rspress/shared/node-utils");
350
+ },
351
+ "node:fs": function(module) {
352
+ module.exports = require("node:fs");
353
+ },
354
+ "node:path": function(module) {
355
+ module.exports = require("node:path");
356
+ },
3
357
  "@rsbuild/plugin-less": function(module) {
4
358
  module.exports = import("@rsbuild/plugin-less").then(function(module) {
5
359
  return module;
@@ -9,6 +363,120 @@ var __webpack_modules__ = {
9
363
  module.exports = import("@rsbuild/plugin-sass").then(function(module) {
10
364
  return module;
11
365
  });
366
+ },
367
+ "../../node_modules/.pnpm/unist-util-visit@4.1.2/node_modules/unist-util-visit/lib/index.js": function(__unused_webpack___webpack_module__, __webpack_exports__, __webpack_require__) {
368
+ __webpack_require__.d(__webpack_exports__, {
369
+ Vn: ()=>lib_visit
370
+ });
371
+ const convert = function(test) {
372
+ if (null == test) return ok;
373
+ if ('string' == typeof test) return typeFactory(test);
374
+ if ('object' == typeof test) return Array.isArray(test) ? anyFactory(test) : propsFactory(test);
375
+ if ('function' == typeof test) return castFactory(test);
376
+ throw new Error('Expected function, string, or object as test');
377
+ };
378
+ function anyFactory(tests) {
379
+ const checks = [];
380
+ let index = -1;
381
+ while(++index < tests.length)checks[index] = convert(tests[index]);
382
+ return castFactory(any);
383
+ function any(...parameters) {
384
+ let index = -1;
385
+ while(++index < checks.length)if (checks[index].call(this, ...parameters)) return true;
386
+ return false;
387
+ }
388
+ }
389
+ function propsFactory(check) {
390
+ return castFactory(all);
391
+ function all(node) {
392
+ let key;
393
+ for(key in check)if (node[key] !== check[key]) return false;
394
+ return true;
395
+ }
396
+ }
397
+ function typeFactory(check) {
398
+ return castFactory(type);
399
+ function type(node) {
400
+ return node && node.type === check;
401
+ }
402
+ }
403
+ function castFactory(check) {
404
+ return assertion;
405
+ function assertion(node, ...parameters) {
406
+ return Boolean(node && 'object' == typeof node && 'type' in node && Boolean(check.call(this, node, ...parameters)));
407
+ }
408
+ }
409
+ function ok() {
410
+ return true;
411
+ }
412
+ function color(d) {
413
+ return '\u001B[33m' + d + '\u001B[39m';
414
+ }
415
+ const CONTINUE = true;
416
+ const EXIT = false;
417
+ const SKIP = 'skip';
418
+ const visitParents = function(tree, test, visitor, reverse) {
419
+ if ('function' == typeof test && 'function' != typeof visitor) {
420
+ reverse = visitor;
421
+ visitor = test;
422
+ test = null;
423
+ }
424
+ const is = convert(test);
425
+ const step = reverse ? -1 : 1;
426
+ factory(tree, void 0, [])();
427
+ function factory(node, index, parents) {
428
+ const value = node && 'object' == typeof node ? node : {};
429
+ if ('string' == typeof value.type) {
430
+ const name = 'string' == typeof value.tagName ? value.tagName : 'string' == typeof value.name ? value.name : void 0;
431
+ Object.defineProperty(visit, 'name', {
432
+ value: 'node (' + color(node.type + (name ? '<' + name + '>' : '')) + ')'
433
+ });
434
+ }
435
+ return visit;
436
+ function visit() {
437
+ let result = [];
438
+ let subresult;
439
+ let offset;
440
+ let grandparents;
441
+ if (!test || is(node, index, parents[parents.length - 1] || null)) {
442
+ result = toResult(visitor(node, parents));
443
+ if (result[0] === EXIT) return result;
444
+ }
445
+ if (node.children && result[0] !== SKIP) {
446
+ offset = (reverse ? node.children.length : -1) + step;
447
+ grandparents = parents.concat(node);
448
+ while(offset > -1 && offset < node.children.length){
449
+ subresult = factory(node.children[offset], offset, grandparents)();
450
+ if (subresult[0] === EXIT) return subresult;
451
+ offset = 'number' == typeof subresult[1] ? subresult[1] : offset + step;
452
+ }
453
+ }
454
+ return result;
455
+ }
456
+ }
457
+ };
458
+ function toResult(value) {
459
+ if (Array.isArray(value)) return value;
460
+ if ('number' == typeof value) return [
461
+ CONTINUE,
462
+ value
463
+ ];
464
+ return [
465
+ value
466
+ ];
467
+ }
468
+ const lib_visit = function(tree, test, visitor, reverse) {
469
+ if ('function' == typeof test && 'function' != typeof visitor) {
470
+ reverse = visitor;
471
+ visitor = test;
472
+ test = null;
473
+ }
474
+ visitParents(tree, test, overload, reverse);
475
+ function overload(node, parents) {
476
+ const parent = parents[parents.length - 1];
477
+ return visitor(node, parent ? parent.children.indexOf(node) : null, parent);
478
+ }
479
+ };
12
480
  }
13
481
  };
14
482
  var __webpack_module_cache__ = {};
@@ -59,34 +527,22 @@ var __webpack_exports__ = {};
59
527
  });
60
528
  const external_node_net_namespaceObject = require("node:net");
61
529
  var external_node_net_default = /*#__PURE__*/ __webpack_require__.n(external_node_net_namespaceObject);
62
- const external_node_path_namespaceObject = require("node:path");
63
- var external_node_path_default = /*#__PURE__*/ __webpack_require__.n(external_node_path_namespaceObject);
530
+ var external_node_path_ = __webpack_require__("node:path");
64
531
  const core_namespaceObject = require("@rsbuild/core");
65
532
  const plugin_babel_namespaceObject = require("@rsbuild/plugin-babel");
66
533
  const plugin_react_namespaceObject = require("@rsbuild/plugin-react");
67
534
  const plugin_solid_namespaceObject = require("@rsbuild/plugin-solid");
68
- const shared_namespaceObject = require("@rspress/shared");
535
+ var shared_ = __webpack_require__("@rspress/shared");
69
536
  const external_lodash_namespaceObject = require("lodash");
70
- const staticPath = external_node_path_default().join(__dirname, '..', 'static');
71
- const demoBlockComponentPath = external_node_path_default().join(staticPath, 'global-components', 'DemoBlock.tsx');
72
- const virtualDir = external_node_path_default().join(process.cwd(), 'node_modules', shared_namespaceObject.RSPRESS_TEMP_DIR, 'virtual-demo');
73
- const external_node_fs_namespaceObject = require("node:fs");
74
- var external_node_fs_default = /*#__PURE__*/ __webpack_require__.n(external_node_fs_namespaceObject);
75
- const toValidVarName = (str)=>{
76
- if (/^[a-zA-Z_$][0-9a-zA-Z_$]*$/.test(str)) return str;
77
- return str.replace(/[^0-9a-zA-Z_$]/g, '_').replace(/^([0-9])/, '_$1');
78
- };
79
- const generateId = (pageName, index)=>`_${toValidVarName(pageName)}_${index}`;
80
- const injectDemoBlockImport = (str, path)=>`
81
- import DemoBlock from ${JSON.stringify(path)};
82
- ${str}
83
- `;
537
+ var constant = __webpack_require__("./src/constant.ts");
538
+ var external_node_fs_ = __webpack_require__("node:fs");
539
+ var utils = __webpack_require__("./src/utils.ts?589a");
84
540
  function generateEntryForPerComponent(demos, entryCssPath, framework) {
85
541
  const sourceEntry = {};
86
542
  Object.values(demos).forEach((routes)=>{
87
543
  routes.forEach((route)=>{
88
544
  const { id, path: demoPath } = route;
89
- const entry = (0, external_node_path_namespaceObject.join)(virtualDir, `${id}.entry.tsx`);
545
+ const entry = (0, external_node_path_.join)(constant.qp, `${id}.entry.tsx`);
90
546
  const solidEntry = `
91
547
  import { render } from 'solid-js/web';
92
548
  import ${JSON.stringify(entryCssPath)};
@@ -100,7 +556,7 @@ var __webpack_exports__ = {};
100
556
  render(<Demo />, document.getElementById('root'));
101
557
  `;
102
558
  const entryContent = 'react' === framework ? reactEntry : solidEntry;
103
- (0, external_node_fs_namespaceObject.writeFileSync)(entry, entryContent);
559
+ (0, external_node_fs_.writeFileSync)(entry, entryContent);
104
560
  sourceEntry[id] = entry;
105
561
  });
106
562
  });
@@ -139,16 +595,16 @@ var __webpack_exports__ = {};
139
595
  render(() => <App /> , document.getElementById('root'));
140
596
  `;
141
597
  const renderContent = 'solid' === framework ? solidContent : reactContent;
142
- const id = `_${toValidVarName(key)}`;
143
- const entry = (0, external_node_path_namespaceObject.join)(virtualDir, `${id}.entry.tsx`);
144
- (0, external_node_fs_namespaceObject.writeFileSync)(entry, renderContent);
598
+ const id = `_${(0, utils.nI)(key)}`;
599
+ const entry = (0, external_node_path_.join)(constant.qp, `${id}.entry.tsx`);
600
+ (0, external_node_fs_.writeFileSync)(entry, renderContent);
145
601
  sourceEntry[id] = entry;
146
602
  });
147
603
  return sourceEntry;
148
604
  }
149
605
  function generateEntry(demos, framework, position) {
150
606
  const sourceEntry = {};
151
- const entryCssPath = (0, external_node_path_namespaceObject.join)(staticPath, 'global-styles', 'entry.css');
607
+ const entryCssPath = (0, external_node_path_.join)(constant.Dh, 'global-styles', 'entry.css');
152
608
  if ('follow' === position) {
153
609
  const entries = generateEntryForPerComponent(demos, entryCssPath, framework);
154
610
  Object.assign(sourceEntry, entries);
@@ -163,293 +619,8 @@ var __webpack_exports__ = {};
163
619
  }
164
620
  return sourceEntry;
165
621
  }
166
- const node_utils_namespaceObject = require("@rspress/shared/node-utils");
167
- const convert = function(test) {
168
- if (null == test) return ok;
169
- if ('string' == typeof test) return typeFactory(test);
170
- if ('object' == typeof test) return Array.isArray(test) ? anyFactory(test) : propsFactory(test);
171
- if ('function' == typeof test) return castFactory(test);
172
- throw new Error('Expected function, string, or object as test');
173
- };
174
- function anyFactory(tests) {
175
- const checks = [];
176
- let index = -1;
177
- while(++index < tests.length)checks[index] = convert(tests[index]);
178
- return castFactory(any);
179
- function any(...parameters) {
180
- let index = -1;
181
- while(++index < checks.length)if (checks[index].call(this, ...parameters)) return true;
182
- return false;
183
- }
184
- }
185
- function propsFactory(check) {
186
- return castFactory(all);
187
- function all(node) {
188
- let key;
189
- for(key in check)if (node[key] !== check[key]) return false;
190
- return true;
191
- }
192
- }
193
- function typeFactory(check) {
194
- return castFactory(type);
195
- function type(node) {
196
- return node && node.type === check;
197
- }
198
- }
199
- function castFactory(check) {
200
- return assertion;
201
- function assertion(node, ...parameters) {
202
- return Boolean(node && 'object' == typeof node && 'type' in node && Boolean(check.call(this, node, ...parameters)));
203
- }
204
- }
205
- function ok() {
206
- return true;
207
- }
208
- function color(d) {
209
- return '\u001B[33m' + d + '\u001B[39m';
210
- }
211
- const CONTINUE = true;
212
- const EXIT = false;
213
- const SKIP = 'skip';
214
- const visitParents = function(tree, test, visitor, reverse) {
215
- if ('function' == typeof test && 'function' != typeof visitor) {
216
- reverse = visitor;
217
- visitor = test;
218
- test = null;
219
- }
220
- const is = convert(test);
221
- const step = reverse ? -1 : 1;
222
- factory(tree, void 0, [])();
223
- function factory(node, index, parents) {
224
- const value = node && 'object' == typeof node ? node : {};
225
- if ('string' == typeof value.type) {
226
- const name = 'string' == typeof value.tagName ? value.tagName : 'string' == typeof value.name ? value.name : void 0;
227
- Object.defineProperty(visit, 'name', {
228
- value: 'node (' + color(node.type + (name ? '<' + name + '>' : '')) + ')'
229
- });
230
- }
231
- return visit;
232
- function visit() {
233
- let result = [];
234
- let subresult;
235
- let offset;
236
- let grandparents;
237
- if (!test || is(node, index, parents[parents.length - 1] || null)) {
238
- result = toResult(visitor(node, parents));
239
- if (result[0] === EXIT) return result;
240
- }
241
- if (node.children && result[0] !== SKIP) {
242
- offset = (reverse ? node.children.length : -1) + step;
243
- grandparents = parents.concat(node);
244
- while(offset > -1 && offset < node.children.length){
245
- subresult = factory(node.children[offset], offset, grandparents)();
246
- if (subresult[0] === EXIT) return subresult;
247
- offset = 'number' == typeof subresult[1] ? subresult[1] : offset + step;
248
- }
249
- }
250
- return result;
251
- }
252
- }
253
- };
254
- function toResult(value) {
255
- if (Array.isArray(value)) return value;
256
- if ('number' == typeof value) return [
257
- CONTINUE,
258
- value
259
- ];
260
- return [
261
- value
262
- ];
263
- }
264
- const lib_visit = function(tree, test, visitor, reverse) {
265
- if ('function' == typeof test && 'function' != typeof visitor) {
266
- reverse = visitor;
267
- visitor = test;
268
- test = null;
269
- }
270
- visitParents(tree, test, overload, reverse);
271
- function overload(node, parents) {
272
- const parent = parents[parents.length - 1];
273
- return visitor(node, parent ? parent.children.indexOf(node) : null, parent);
274
- }
275
- };
276
- const getASTNodeImport = (name, from)=>({
277
- type: 'mdxjsEsm',
278
- value: `import ${name} from ${JSON.stringify(from)}`,
279
- data: {
280
- estree: {
281
- type: 'Program',
282
- sourceType: 'module',
283
- body: [
284
- {
285
- type: 'ImportDeclaration',
286
- specifiers: [
287
- {
288
- type: 'ImportDefaultSpecifier',
289
- local: {
290
- type: 'Identifier',
291
- name
292
- }
293
- }
294
- ],
295
- source: {
296
- type: 'Literal',
297
- value: from,
298
- raw: `${JSON.stringify(from)}`
299
- }
300
- }
301
- ]
302
- }
303
- }
304
- });
305
- const getExternalDemoContent = (tempVar)=>({
306
- type: 'mdxJsxFlowElement',
307
- name: '',
308
- attributes: [],
309
- children: [
310
- {
311
- type: 'mdxJsxFlowElement',
312
- name: 'pre',
313
- attributes: [],
314
- children: [
315
- {
316
- type: 'mdxJsxFlowElement',
317
- name: 'code',
318
- attributes: [
319
- {
320
- type: 'mdxJsxAttribute',
321
- name: 'className',
322
- value: 'language-tsx'
323
- },
324
- {
325
- type: 'mdxJsxAttribute',
326
- name: 'children',
327
- value: {
328
- type: 'mdxJsxExpressionAttribute',
329
- value: tempVar,
330
- data: {
331
- estree: {
332
- type: 'Program',
333
- body: [
334
- {
335
- type: 'ExpressionStatement',
336
- expression: {
337
- type: 'Identifier',
338
- name: tempVar
339
- }
340
- }
341
- ]
342
- }
343
- }
344
- }
345
- }
346
- ]
347
- }
348
- ]
349
- }
350
- ]
351
- });
352
- const remarkPlugin_demos = {};
353
- const remarkCodeToDemo = function({ getRouteMeta, previewMode, defaultRenderMode, position, previewLanguages, previewCodeTransform }) {
354
- const routeMeta = getRouteMeta();
355
- external_node_fs_default().mkdirSync(virtualDir, {
356
- recursive: true
357
- });
358
- const data = this.data();
359
- return (tree, vfile)=>{
360
- const demoMdx = [];
361
- const route = routeMeta.find((meta)=>(0, shared_namespaceObject.normalizePosixPath)(meta.absolutePath) === (0, shared_namespaceObject.normalizePosixPath)(vfile.path || vfile.history[0]));
362
- if (!route) return;
363
- const { pageName } = route;
364
- remarkPlugin_demos[pageName] = [];
365
- let title = pageName;
366
- let index = 1;
367
- let externalDemoIndex = 0;
368
- function constructDemoNode(demoId, demoPath, currentNode, isMobileMode, externalDemoIndex) {
369
- if (isMobileMode) {
370
- const relativePathReg = new RegExp(/^\.\.?\/.*$/);
371
- remarkPlugin_demos[pageName].push({
372
- title,
373
- id: demoId,
374
- path: relativePathReg.test(demoPath) ? (0, external_node_path_namespaceObject.resolve)(vfile.dirname || (0, external_node_path_namespaceObject.dirname)(vfile.path), demoPath) : demoPath
375
- });
376
- } else demoMdx.push(getASTNodeImport(`Demo${demoId}`, demoPath));
377
- const tempVar = `externalDemoContent${externalDemoIndex}`;
378
- if (void 0 !== externalDemoIndex) demoMdx.push(getASTNodeImport(tempVar, `!!${demoPath}?raw`));
379
- if (isMobileMode && 'fixed' === position) void 0 !== externalDemoIndex && Object.assign(currentNode, getExternalDemoContent(tempVar));
380
- else Object.assign(currentNode, {
381
- type: 'mdxJsxFlowElement',
382
- name: 'fixed-with-per-comp' === position ? 'ContainerFixedPerComp' : 'Container',
383
- attributes: [
384
- {
385
- type: 'mdxJsxAttribute',
386
- name: 'isMobile',
387
- value: isMobileMode
388
- },
389
- {
390
- type: 'mdxJsxAttribute',
391
- name: 'demoId',
392
- value: demoId
393
- }
394
- ],
395
- children: [
396
- void 0 === externalDemoIndex ? {
397
- ...currentNode,
398
- hasVisited: true
399
- } : getExternalDemoContent(tempVar),
400
- isMobileMode ? {
401
- type: 'mdxJsxFlowElement',
402
- name: null
403
- } : {
404
- type: 'mdxJsxFlowElement',
405
- name: `Demo${demoId}`
406
- }
407
- ]
408
- });
409
- }
410
- lib_visit(tree, 'heading', (node)=>{
411
- if (1 === node.depth) {
412
- const firstChild = node.children[0];
413
- title = firstChild && 'value' in firstChild && firstChild.value || title;
414
- }
415
- });
416
- lib_visit(tree, 'mdxJsxFlowElement', (node)=>{
417
- if ('code' === node.name) {
418
- const src = (0, node_utils_namespaceObject.getNodeAttribute)(node, 'src');
419
- if ('string' != typeof src) return;
420
- const currentMode = (0, node_utils_namespaceObject.getNodeAttribute)(node, 'previewMode') ?? previewMode;
421
- const isMobileAttr = (0, node_utils_namespaceObject.getNodeAttribute)(node, 'isMobile');
422
- let isMobileMode = false;
423
- isMobileMode = void 0 === isMobileAttr ? 'iframe' === currentMode : null === isMobileAttr ? true : 'object' == typeof isMobileAttr ? 'false' !== isMobileAttr.value : 'false' !== isMobileAttr;
424
- const id = generateId(pageName, index++);
425
- constructDemoNode(id, src, node, isMobileMode, externalDemoIndex++);
426
- }
427
- });
428
- lib_visit(tree, 'code', (node)=>{
429
- if ('hasVisited' in node) return;
430
- if (node.lang && previewLanguages.includes(node.lang)) {
431
- var _node_meta, _node_meta1, _node_meta2, _node_meta3, _node_meta4, _node_meta5;
432
- if ((null == (_node_meta = node.meta) ? void 0 : _node_meta.includes('pure')) || !(null == (_node_meta1 = node.meta) ? void 0 : _node_meta1.includes('preview')) && 'pure' === defaultRenderMode) return;
433
- const value = injectDemoBlockImport(previewCodeTransform({
434
- language: node.lang,
435
- code: node.value
436
- }), demoBlockComponentPath);
437
- const isMobileMode = (null == (_node_meta2 = node.meta) ? void 0 : _node_meta2.includes('mobile')) || (null == (_node_meta3 = node.meta) ? void 0 : _node_meta3.includes('iframe')) || !(null == (_node_meta4 = node.meta) ? void 0 : _node_meta4.includes('web')) && !(null == (_node_meta5 = node.meta) ? void 0 : _node_meta5.includes('internal')) && 'iframe' === previewMode;
438
- const id = generateId(pageName, index++);
439
- const virtualModulePath = (0, external_node_path_namespaceObject.join)(virtualDir, `${id}.tsx`);
440
- constructDemoNode(id, virtualModulePath, node, isMobileMode);
441
- if (external_node_fs_default().existsSync(virtualModulePath)) {
442
- const content = external_node_fs_default().readFileSync(virtualModulePath, 'utf-8');
443
- if (content === value) return;
444
- }
445
- external_node_fs_default().writeFileSync(virtualModulePath, value);
446
- }
447
- });
448
- tree.children.unshift(...demoMdx);
449
- if (remarkPlugin_demos[pageName].length > 0) data.pageMeta.haveDemos = true;
450
- };
451
- };
452
- let src_routeMeta;
622
+ var remarkPlugin = __webpack_require__("./src/remarkPlugin.ts");
623
+ let routeMeta;
453
624
  const DEFAULT_PREVIEW_LANGUAGES = [
454
625
  'jsx',
455
626
  'tsx'
@@ -458,7 +629,7 @@ var __webpack_exports__ = {};
458
629
  const { isMobile = false, iframeOptions = {}, iframePosition = 'follow', defaultRenderMode = 'preview', previewLanguages = DEFAULT_PREVIEW_LANGUAGES, previewCodeTransform = ({ code })=>code } = options ?? {};
459
630
  const previewMode = (null == options ? void 0 : options.previewMode) ?? (isMobile ? 'iframe' : 'internal');
460
631
  const { devPort = 7890, framework = 'react', position = iframePosition, builderConfig = {} } = iframeOptions;
461
- const getRouteMeta = ()=>src_routeMeta;
632
+ const getRouteMeta = ()=>routeMeta;
462
633
  let lastDemos;
463
634
  let devServer;
464
635
  let clientConfig;
@@ -471,7 +642,7 @@ var __webpack_exports__ = {};
471
642
  return config;
472
643
  },
473
644
  routeGenerated (routes) {
474
- src_routeMeta = routes;
645
+ routeMeta = routes;
475
646
  },
476
647
  async beforeBuild (_, isProd) {
477
648
  if (!isProd) try {
@@ -493,12 +664,12 @@ var __webpack_exports__ = {};
493
664
  },
494
665
  async afterBuild (config, isProd) {
495
666
  var _devServer_server;
496
- if ((0, external_lodash_namespaceObject.isEqual)(remarkPlugin_demos, lastDemos)) return;
497
- lastDemos = (0, external_lodash_namespaceObject.cloneDeep)(remarkPlugin_demos);
667
+ if ((0, external_lodash_namespaceObject.isEqual)(remarkPlugin.D, lastDemos)) return;
668
+ lastDemos = (0, external_lodash_namespaceObject.cloneDeep)(remarkPlugin.D);
498
669
  await (null == devServer ? void 0 : null == (_devServer_server = devServer.server) ? void 0 : _devServer_server.close());
499
670
  devServer = void 0;
500
- const sourceEntry = generateEntry(remarkPlugin_demos, framework, position);
501
- const outDir = (0, external_node_path_namespaceObject.join)(config.outDir ?? 'doc_build', '~demo');
671
+ const sourceEntry = generateEntry(remarkPlugin.D, framework, position);
672
+ const outDir = (0, external_node_path_.join)(config.outDir ?? 'doc_build', '~demo');
502
673
  if (0 === Object.keys(sourceEntry).length) return;
503
674
  const { html, source, output, performance } = clientConfig ?? {};
504
675
  const { preEntry, ...otherSourceOptions } = source ?? {};
@@ -522,7 +693,7 @@ var __webpack_exports__ = {};
522
693
  },
523
694
  output: {
524
695
  ...output,
525
- assetPrefix: (null == output ? void 0 : output.assetPrefix) ? `${(0, shared_namespaceObject.removeTrailingSlash)(output.assetPrefix)}/~demo` : '/~demo',
696
+ assetPrefix: (null == output ? void 0 : output.assetPrefix) ? `${(0, shared_.removeTrailingSlash)(output.assetPrefix)}/~demo` : '/~demo',
526
697
  distPath: {
527
698
  root: outDir
528
699
  },
@@ -534,12 +705,14 @@ var __webpack_exports__ = {};
534
705
  callerName: 'rspress',
535
706
  rsbuildConfig
536
707
  });
537
- const { pluginSass } = await Promise.resolve().then(__webpack_require__.bind(__webpack_require__, "@rsbuild/plugin-sass"));
538
- const { pluginLess } = await Promise.resolve().then(__webpack_require__.bind(__webpack_require__, "@rsbuild/plugin-less"));
539
- rsbuildInstance.addPlugins([
540
- pluginSass(),
708
+ const { PLUGIN_SASS_NAME, pluginSass } = await Promise.resolve().then(__webpack_require__.bind(__webpack_require__, "@rsbuild/plugin-sass"));
709
+ const { PLUGIN_LESS_NAME, pluginLess } = await Promise.resolve().then(__webpack_require__.bind(__webpack_require__, "@rsbuild/plugin-less"));
710
+ if (!rsbuildInstance.isPluginExists(PLUGIN_LESS_NAME)) rsbuildInstance.addPlugins([
541
711
  pluginLess()
542
712
  ]);
713
+ if (!rsbuildInstance.isPluginExists(PLUGIN_SASS_NAME)) rsbuildInstance.addPlugins([
714
+ pluginSass()
715
+ ]);
543
716
  if ('solid' === framework) rsbuildInstance.addPlugins([
544
717
  (0, plugin_babel_namespaceObject.pluginBabel)({
545
718
  include: /\.(?:jsx|tsx)$/
@@ -555,7 +728,7 @@ var __webpack_exports__ = {};
555
728
  builderConfig: {
556
729
  source: {
557
730
  include: [
558
- (0, external_node_path_namespaceObject.join)(__dirname, '..')
731
+ (0, external_node_path_.join)(__dirname, '..')
559
732
  ]
560
733
  },
561
734
  tools: {
@@ -593,7 +766,7 @@ var __webpack_exports__ = {};
593
766
  markdown: {
594
767
  remarkPlugins: [
595
768
  [
596
- remarkCodeToDemo,
769
+ remarkPlugin.T,
597
770
  {
598
771
  getRouteMeta,
599
772
  position,
@@ -605,16 +778,16 @@ var __webpack_exports__ = {};
605
778
  ]
606
779
  ],
607
780
  globalComponents: [
608
- (0, external_node_path_namespaceObject.join)(staticPath, 'global-components', 'Container.tsx'),
609
- (0, external_node_path_namespaceObject.join)(staticPath, 'global-components', 'ContainerFixedPerComp.tsx')
781
+ (0, external_node_path_.join)(constant.Dh, 'global-components', 'Container.tsx'),
782
+ (0, external_node_path_.join)(constant.Dh, 'global-components', 'ContainerFixedPerComp.tsx')
610
783
  ]
611
784
  },
612
785
  globalUIComponents: 'fixed-with-per-comp' === position ? [
613
- (0, external_node_path_namespaceObject.join)(staticPath, 'global-components', 'DeviceFixedPerComp.tsx')
786
+ (0, external_node_path_.join)(constant.Dh, 'global-components', 'DeviceFixedPerComp.tsx')
614
787
  ] : 'fixed' === position ? [
615
- (0, external_node_path_namespaceObject.join)(staticPath, 'global-components', 'Device.tsx')
788
+ (0, external_node_path_.join)(constant.Dh, 'global-components', 'Device.tsx')
616
789
  ] : [],
617
- globalStyles: (0, external_node_path_namespaceObject.join)(staticPath, 'global-styles', `${previewMode}.css`)
790
+ globalStyles: (0, external_node_path_.join)(constant.Dh, 'global-styles', `${previewMode}.css`)
618
791
  };
619
792
  }
620
793
  })();
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rspress/plugin-preview",
3
- "version": "1.46.2",
3
+ "version": "1.47.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": {
@@ -25,8 +25,8 @@
25
25
  "@rsbuild/plugin-solid": "~1.0.5",
26
26
  "lodash": "4.17.21",
27
27
  "qrcode.react": "^3.2.0",
28
- "@rspress/shared": "1.46.2",
29
- "@rspress/theme-default": "1.46.2"
28
+ "@rspress/shared": "1.47.0",
29
+ "@rspress/theme-default": "1.47.0"
30
30
  },
31
31
  "devDependencies": {
32
32
  "@rslib/core": "~0.6.9",
@@ -45,7 +45,7 @@
45
45
  "unist-util-visit": "^4.1.2"
46
46
  },
47
47
  "peerDependencies": {
48
- "@rspress/core": "^1.46.2",
48
+ "@rspress/core": "^1.47.0",
49
49
  "react": ">=17.0.0",
50
50
  "react-router-dom": "^6.8.1"
51
51
  },
package/static/env.d.ts CHANGED
@@ -4,3 +4,9 @@ declare module 'virtual-meta' {
4
4
  const demos: Record<string, []>;
5
5
  export { demos };
6
6
  }
7
+
8
+ declare module '@theme' {
9
+ const Tabs: React.FC<{ children: React.ReactNode }>;
10
+ const Tab: React.FC<{ children: React.ReactNode; label: string }>;
11
+ export { Tabs, Tab };
12
+ }
package/static/global-components/ContainerFixedPerComp.tsx CHANGED
@@ -1,4 +1,5 @@
1
1
  import { NoSSR, useLang, usePageData, withBase } from '@rspress/core/runtime';
2
+ import { Tab, Tabs } from '@theme';
2
3
  import { type MouseEvent, useCallback, useState } from 'react';
3
4
  import IconCode from './icons/Code';
4
5
  import { publishIframeUrl } from './useIframeUrlPerComp';
@@ -7,9 +8,30 @@ type ContainerProps = {
7
8
  children: React.ReactNode[];
8
9
  isMobile: 'true' | 'false';
9
10
  demoId: string;
11
+ entryFile?: string;
12
+ otherFiles?: string[];
10
13
  };
11
14
 
12
- const MobileContainerFixedPerComp: React.FC<ContainerProps> = props => {
15
+ const getTabs = (entryFile?: string, otherFiles?: string[], children?: any) => {
16
+ if (entryFile && otherFiles && otherFiles.length > 0) {
17
+ return (
18
+ <Tabs>
19
+ <Tab label={entryFile}>{children?.[0]}</Tab>
20
+ {children.slice(2).map((child: any, i: number) => {
21
+ const filename = otherFiles ? otherFiles[i] : `File ${i + 1}`;
22
+ return (
23
+ <Tab key={filename} label={filename}>
24
+ {child || null}
25
+ </Tab>
26
+ );
27
+ })}
28
+ </Tabs>
29
+ );
30
+ }
31
+ return null;
32
+ };
33
+
34
+ const MobileContainerFixedPerComp: React.FC<ContainerProps & {}> = props => {
13
35
  const { children, demoId } = props;
14
36
  const { page } = usePageData();
15
37
  const url = `/~demo/${demoId}`;
@@ -32,7 +54,7 @@ const MobileContainerFixedPerComp: React.FC<ContainerProps> = props => {
32
54
 
33
55
  return (
34
56
  <div className="rspress-preview-code" onClick={setIframeUrl}>
35
- {children}
57
+ {getTabs(props.entryFile, props.otherFiles, children) || children}
36
58
  </div>
37
59
  );
38
60
  };
@@ -86,7 +108,8 @@ const ContainerFixedPerComp = (props: ContainerProps) => {
86
108
  : 'rspress-preview-code-hide'
87
109
  }`}
88
110
  >
89
- {children?.[0]}
111
+ {getTabs(props.entryFile, props.otherFiles, children) ||
112
+ children?.[0]}
90
113
  </div>
91
114
  </div>
92
115
  </div>