@graph-artifact/core 0.1.4 → 0.1.6

package/dist/components/NodeDetail.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { memo, useMemo } from 'react';
-import { renderMarkdown } from '../renderMarkdown.js';
+import ReactMarkdown from 'react-markdown';
 import { useTheme } from '../ThemeContext.js';
 import { getConfig } from '../config.js';
 /**
@@ -50,6 +50,10 @@ ${scope} a:hover { text-decoration: underline; }
 ${scope} hr { border: none; border-top: ${theme.borderWidth.sm} solid ${theme.color.gray2}; margin: ${theme.space[4]} 0; }
 `;
 }
+function normalizeNotesMarkdown(md) {
+    // Preserve intentional line breaks without remark plugins.
+    return md.replace(/\r\n/g, '\n').trim().replace(/\n/g, '  \n');
+}
 export const NodeDetail = memo(function NodeDetail({ nodeId, nodeLabel, meta, onClose }) {
     const theme = useTheme();
     const { library } = getConfig();
@@ -61,6 +65,10 @@ export const NodeDetail = memo(function NodeDetail({ nodeId, nodeLabel, meta, on
     const hasDetails = details && Object.keys(details).length > 0;
     const hasContent = hasNotes || hasDetails || status;
     const markdownCss = useMemo(() => hasNotes ? buildMarkdownStyles(theme) : '', [hasNotes, theme]);
+    const markdownComponents = useMemo(() => ({
+        // Ensure links are safe/new-tab, even if consumer overrides global CSS.
+        a: ({ href, children }) => (_jsx("a", { href: href, target: "_blank", rel: "noopener noreferrer", children: children })),
+    }), []);
     return (_jsxs("div", { style: {
             position: 'absolute', top: 0, right: 0,
             width: 380, height: '100%',
@@ -105,7 +113,7 @@ ${markdownCss}` }), _jsx("div", { style: {
                                     width: detail.statusDotSize, height: detail.statusDotSize,
                                     borderRadius: theme.radius.full,
                                     backgroundColor: statusStyle.text,
-                                } }), status] })), hasNotes && (_jsx("div", { "data-graph-detail-notes": "", dangerouslySetInnerHTML: { __html: renderMarkdown(meta.notes) } })), hasDetails && (_jsxs("div", { style: { marginTop: theme.space[5] }, children: [_jsx("h3", { style: {
+                                } }), status] })), hasNotes && (_jsx("div", { "data-graph-detail-notes": "", children: _jsx(ReactMarkdown, { components: markdownComponents, children: normalizeNotesMarkdown(meta.notes) }) })), hasDetails && (_jsxs("div", { style: { marginTop: theme.space[5] }, children: [_jsx("h3", { style: {
                                     fontSize: theme.font.size.xs, fontWeight: theme.font.weight.semibold, color: theme.color.gray3,
                                     textTransform: 'uppercase', letterSpacing: detail.letterSpacing, marginBottom: theme.space[2],
                                 }, children: "Details" }), _jsx("table", { style: { width: '100%', borderCollapse: 'collapse', fontSize: theme.font.size.base }, children: _jsx("tbody", { children: Object.entries(details).map(([key, value]) => (_jsxs("tr", { style: { borderBottom: `${theme.borderWidth.sm} solid ${theme.color.darkBg3}` }, children: [_jsx("td", { style: {

package/dist/components/nodes/FlowNode.js

@@ -12,11 +12,34 @@ const invisibleHandle = {
     background: 'transparent',
     pointerEvents: 'none',
 };
+function decodeHtmlEntities(src) {
+    // Keep this intentionally small; labels should be plain text.
+    return src
+        .replace(/ /gi, ' ')
+        .replace(/&/gi, '&')
+        .replace(/&lt;/gi, '<')
+        .replace(/&gt;/gi, '>')
+        .replace(/&quot;/gi, '"')
+        .replace(/&#39;/g, "'");
+}
+function htmlSubsetToMarkdown(src) {
+    // Mermaid labels often contain a tiny HTML subset: <br/>, <b>, <i>, etc.
+    // Convert the common cases to markdown so react-markdown renders them,
+    // and strip any remaining tags (avoid raw HTML rendering).
+    let s = src;
+    s = s.replace(/<\s*br\s*\/?\s*>/gi, '\n');
+    s = s.replace(/<\s*\/?\s*(strong|b)\s*>/gi, '**');
+    s = s.replace(/<\s*\/?\s*(em|i)\s*>/gi, '*');
+    s = s.replace(/<\s*\/?\s*code\s*>/gi, '`');
+    // Strip any remaining tags defensively
+    s = s.replace(/<[^>]*>/g, '');
+    return decodeHtmlEntities(s);
+}
 function normalizeLabelMarkdown(label) {
     // Mermaid treats "\n" inside labels as a hard line break.
     // react-markdown doesn't always preserve raw newlines, so force
     // CommonMark hard-breaks by adding two trailing spaces.
-    return label
+    return htmlSubsetToMarkdown(label)
         .replace(/\\n/g, '\n')
         .trim()
         .replace(/\n/g, '  \n');

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@graph-artifact/core",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "description": "Composable Mermaid-like parser, layout engine, and React renderer for interactive diagram artifacts.",
   "license": "MIT",
   "repository": {
@@ -50,8 +50,8 @@
     "build": "rm -rf dist && tsc",
     "typecheck": "tsc --noEmit",
     "smoke:core": "node scripts/smoke-core.mjs",
-    "test": "npm run typecheck && npm run smoke:core",
-    "prepack": "npm run build && npm run test"
+    "test": "npm run build && npm run typecheck && npm run smoke:core",
+    "prepack": "npm run test"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",