@webmcp-auto-ui/sdk 2.5.38 → 2.5.39

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webmcp-auto-ui/sdk",
-  "version": "2.5.38",
+  "version": "2.5.39",
   "description": "Skills CRUD, HyperSkill format, Svelte 5 stores",
   "license": "AGPL-3.0-or-later",
   "type": "module",

package/src/canvas-to-notebook.ts

@@ -4,6 +4,8 @@
  * present, snapshot fallback otherwise.
  */
 
+import { pickFence } from './recipes/fence.js';
+
 export interface WidgetLineage {
   widgetType: string;
   widgetParams: Record<string, unknown>;
@@ -138,13 +140,64 @@ export function canvasToNotebookMarkdown(
   return fm.join('\n') + '\n' + body.join('\n').replace(/\n+$/, '') + '\n';
 }
 
+export interface CanvasToNotebookData {
+  title?: string;
+  description?: string;
+  /** Active MCP servers (name, url) — to seed the notebook widget's data. */
+  servers?: Array<{ name: string; url: string }>;
+  /** Active bundled WebMCP server ids. */
+  webmcpServers?: string[];
+  /** Cells ready to feed into a NotebookState. */
+  cells: Array<{
+    id: string;
+    type: 'md' | 'sql' | 'js';
+    content: string;
+    varname?: string;
+    status?: 'idle';
+  }>;
+}
+
+/** Same logic as canvasToNotebookMarkdown but returns structured cells for direct widget mounting. */
+export function canvasToNotebookCells(
+  blocks: CanvasBlock[],
+  getLineage: (blockId: string) => WidgetLineage | null,
+  opts: CanvasToNotebookOptions = {},
+): CanvasToNotebookData {
+  let counter = 0;
+  const cells: CanvasToNotebookData['cells'] = [];
+
+  for (const block of blocks) {
+    const raw = lineageToCells(block, getLineage(block.id));
+    for (const cell of raw) {
+      const entry: CanvasToNotebookData['cells'][number] = {
+        id: `c${counter++}`,
+        type: cell.kind,
+        content: cell.content,
+        status: 'idle',
+      };
+      if (cell.varname !== undefined) entry.varname = cell.varname;
+      cells.push(entry);
+    }
+  }
+
+  const out: CanvasToNotebookData = { cells };
+  if (opts.title) out.title = opts.title;
+  if (opts.description) out.description = opts.description;
+  if (opts.servers && opts.servers.length > 0) out.servers = opts.servers;
+  if (opts.webmcpServers && opts.webmcpServers.length > 0) out.webmcpServers = opts.webmcpServers;
+  return out;
+}
+
 function renderCell(cell: NotebookCell): string {
   if (cell.kind === 'md') return cell.content;
   if (cell.kind === 'sql') {
     const meta = cell.varname ? `-- @meta {"varname": "${cell.varname}"}\n` : '';
-    return '```sql\n' + meta + cell.content + '\n```';
+    const body = meta + cell.content;
+    const fence = pickFence(body);
+    return fence + 'sql\n' + body + '\n' + fence;
   }
-  return '```js\n' + cell.content + '\n```';
+  const fence = pickFence(cell.content);
+  return fence + 'js\n' + cell.content + '\n' + fence;
 }
 
 function pickArrayParamKey(params: Record<string, unknown>): string | null {

package/src/index.ts

@@ -91,7 +91,7 @@ export type { RemoteMcpRegistryEntry } from './remote-mcp-registry.js';
 // import { canvas } from '@webmcp-auto-ui/sdk/canvas'
 
 // Recipe runner — markdown-fence parser + JS/TS/SQL/etc executor over MCP
-export { parseBody, runCode, estimateTokens, safeStringify, findCodeParamName, buildToolArgs, parseWidgetDisplayCall } from './recipes/index.js';
+export { parseBody, pickFence, runCode, estimateTokens, safeStringify, findCodeParamName, buildToolArgs, parseWidgetDisplayCall } from './recipes/index.js';
 export type { ParsedSegment, RunResult, RunLog, RunTab, RecipeData } from './recipes/index.js';
 
 // Short URL — domain-dependent compact token
@@ -104,10 +104,11 @@ export { extractSampleData } from './widget-sample-data.js';
 export { unwrap } from './unwrap.js';
 
 // Canvas → HyperSkill notebook serializer
-export { lineageToCells, canvasToNotebookMarkdown } from './canvas-to-notebook.js';
+export { lineageToCells, canvasToNotebookMarkdown, canvasToNotebookCells } from './canvas-to-notebook.js';
 export type {
   WidgetLineage,
   CanvasToNotebookOptions,
+  CanvasToNotebookData,
   NotebookCell,
   CanvasBlock,
 } from './canvas-to-notebook.js';

package/src/recipes/fence.ts

@@ -0,0 +1,12 @@
+/**
+ * Pick a backtick fence longer than any run of backticks inside `content`.
+ * CommonMark rule: a fenced code block opens with N≥3 backticks; the content
+ * must not contain a closing fence of the same length, and the closing fence
+ * must be at least as long as the opening. Choosing N = max(3, longestRun+1)
+ * makes round-trips safe even when the cell content embeds Markdown fences.
+ */
+export function pickFence(content: string): string {
+  const runs = content.match(/`+/g) ?? [];
+  const longest = runs.reduce((m, r) => Math.max(m, r.length), 0);
+  return '`'.repeat(Math.max(3, longest + 1));
+}

package/src/recipes/index.ts

@@ -1,3 +1,4 @@
 export { parseBody } from './parse.js';
+export { pickFence } from './fence.js';
 export { runCode, estimateTokens, safeStringify, findCodeParamName, buildToolArgs, parseWidgetDisplayCall } from './runner.js';
 export type { ParsedSegment, RunResult, RunLog, RunTab, RecipeData } from './types.js';

package/src/recipes/parse.ts

@@ -16,14 +16,17 @@ export function parseBody(body: string): ParsedSegment[] {
 
   const segments: ParsedSegment[] = [];
   // Match fenced code blocks with optional language tag.
-  // Non-greedy body; allow any chars between the fences.
-  const re = /```([a-zA-Z0-9_+-]*)\r?\n([\s\S]*?)```/g;
+  // Variable-length fence (≥3 backticks, CommonMark §4.5): the closing fence
+  // must use the same number of backticks as the opening — captured via \1.
+  // This allows cells whose content embeds ``` (e.g. widget('text', { content: "...```js..." }))
+  // to be encoded with a longer fence (4+ backticks) without premature closure.
+  const re = /(`{3,})([a-zA-Z0-9_+-]*)\r?\n([\s\S]*?)\r?\n\1[ \t]*(?=\r?\n|$)/g;
 
   let lastIndex = 0;
   let match: RegExpExecArray | null;
 
   while ((match = re.exec(body)) !== null) {
-    const [full, langRaw, codeRaw] = match;
+    const [full, , langRaw, codeRaw] = match;
     const start = match.index;
 
     if (start > lastIndex) {