@c2-markdown-ui/marked-ext 0.0.0-stage → 1.4.3

package/README.md

@@ -1,3 +1,71 @@
-# Temporary Holding Version
+# @c2-markdown-ui/marked-ext
+**Turn your Markdown parser into a widget factory.**
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Transform `markdown-ui-widget` code blocks into interactive components with zero configuration.
+
+✨ [Try the live demo](https://markdown-ui.com/) ✨
+
+Works with any Marked.js setup—just add the extension and widgets come alive.
+
+## Get started in 30 seconds
+
+```bash
+npm install @c2-markdown-ui/marked-ext marked
+```
+
+```typescript
+import { Marked } from 'marked';
+import { markedUiExtension } from '@c2-markdown-ui/marked-ext';
+
+const marked = new Marked();
+marked.use(markedUiExtension);
+
+// This markdown...
+const markdown = `
+\`\`\`markdown-ui-widget
+select env [dev staging prod]
+\`\`\`
+`;
+
+const html = marked.parse(markdown);
+// ...becomes interactive widgets!
+```
+
+## Two syntaxes, same magic
+
+Write widgets in **JSON** (traditional) or **DSL** (60% more concise):
+
+**DSL** ⚡
+```markdown
+text-input username "Username" "Enter username"
+button-group env [dev staging prod] dev
+select region [us-east-1 us-west-2] us-east-1
+form config "Submit"
+  text-input name "Name" 
+  select env [dev prod]
+chart-line
+title: Revenue Growth
+Month,Sales
+Jan,100
+Feb,150
+```
+
+**JSON** 📝
+```json
+{"type": "text-input", "id": "username", "label": "Username"}
+```
+
+Both work identically—the extension auto-detects the format.
+
+## How it works
+
+1. **Detects** `markdown-ui-widget` code blocks in your Markdown
+2. **Encodes** widget config as URL-encoded JSON with unique IDs
+3. **Generates** `<markdown-ui-widget>` custom elements
+4. **Renders** with your framework (React, Svelte, Vue)
+
+Perfect separation—any parser, any renderer, any framework.
+
+**Next step:** Add a renderer like `@c2-markdown-ui/react` or `@c2-markdown-ui/svelte` to see your widgets come alive.
+
+MIT © 2025

package/dist/ext.d.ts

@@ -0,0 +1,21 @@
+import { type MarkedExtension } from 'marked';
+export interface MarkedUiExtensionOptions {
+    /**
+     * Enable streaming mode for AI content generation.
+     * When true, uses streaming-aware parser that handles incomplete input gracefully.
+     */
+    streaming?: boolean;
+}
+/**
+ * Create a marked extension for markdown-ui widgets.
+ * @param options Configuration options
+ */
+export declare function createMarkedUiExtension(options?: MarkedUiExtensionOptions): MarkedExtension;
+/**
+ * Default marked extension (non-streaming mode for backward compatibility)
+ */
+export declare const markedUiExtension: MarkedExtension;
+/**
+ * Streaming-aware marked extension for AI content generation
+ */
+export declare const markedUiStreamingExtension: MarkedExtension;

package/dist/ext.js

@@ -0,0 +1,69 @@
+import { nanoid } from 'nanoid';
+import { parseDSL, parseDSLStreaming } from '@c2-markdown-ui/mdui-lang';
+/**
+ * Create a marked extension for markdown-ui widgets.
+ * @param options Configuration options
+ */
+export function createMarkedUiExtension(options = {}) {
+    const { streaming = false } = options;
+    return {
+        renderer: {
+            code(token) {
+                const lang = token.lang;
+                if (lang === "markdown-ui-widget") {
+                    const text = token.text.trim();
+                    let payloadJson = {};
+                    let finalPayload;
+                    // Try JSON first
+                    try {
+                        payloadJson = JSON.parse(text);
+                        finalPayload = text; // Use original JSON
+                    }
+                    catch (e) {
+                        // Not JSON, try DSL parsing
+                        if (streaming) {
+                            // Use streaming-aware parser for AI content
+                            const result = parseDSLStreaming(text);
+                            if (result.widget) {
+                                payloadJson = result.widget;
+                                // Add streaming metadata
+                                payloadJson._streaming = !result.complete;
+                                payloadJson._pending = result.pending;
+                                finalPayload = JSON.stringify(payloadJson);
+                            }
+                            else {
+                                // Can't even detect widget type, render as code block
+                                return false;
+                            }
+                        }
+                        else {
+                            // Use standard parser
+                            const result = parseDSL(text);
+                            if (result.success && result.widget) {
+                                payloadJson = result.widget;
+                                finalPayload = JSON.stringify(result.widget);
+                            }
+                            else {
+                                // Failed to parse, render as code block
+                                return false;
+                            }
+                        }
+                    }
+                    const payload = encodeURIComponent(finalPayload);
+                    const id = payloadJson.id || nanoid();
+                    return `<markdown-ui-widget id="${id}" content="${payload}"></markdown-ui-widget>\n`;
+                }
+                // fall back to default rendering
+                return false; // tells marked to use its default renderer for other languages
+            },
+        },
+    };
+}
+/**
+ * Default marked extension (non-streaming mode for backward compatibility)
+ */
+export const markedUiExtension = createMarkedUiExtension({ streaming: false });
+/**
+ * Streaming-aware marked extension for AI content generation
+ */
+export const markedUiStreamingExtension = createMarkedUiExtension({ streaming: true });

package/package.json

@@ -1,6 +1,41 @@
 {
+  "version": "1.4.3",
+  "description": "Marked extension for markdown-ui widgets",
   "name": "@c2-markdown-ui/marked-ext",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "type": "module",
+  "main": "./dist/ext.js",
+  "types": "./dist/ext.d.ts",
+  "files": [
+    "dist/"
+  ],
+  "exports": {
+    ".": {
+      "import": "./dist/ext.js",
+      "require": "./dist/ext.js",
+      "types": "./dist/ext.d.ts"
+    }
+  },
+  "scripts": {
+    "build": "tsc",
+    "prepublishOnly": "npm run build"
+  },
+  "keywords": [
+    "marked",
+    "markdown",
+    "extension",
+    "widgets"
+  ],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "@c2-markdown-ui/mdui-lang": "^0.4.4",
+    "nanoid": "^5.1.5"
+  },
+  "devDependencies": {
+    "@types/node": "^24.3.0",
+    "marked": "^16.2.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}