one-design-next 0.0.89 → 0.0.90

package/dist/preview-panel/iframeNavGuard.d.ts

@@ -0,0 +1,35 @@
+/**
+ * iframe 导航守卫：
+ *
+ * PreviewPanel 渲染 text/html 时使用 sandbox="allow-scripts" 的 iframe，
+ * 内部链接默认被沙箱拦截（既不响应点击，也不能逃逸到顶层）。
+ * 通过 `allowedNavigateDomains` 白名单放行特定域名：命中白名单的链接
+ * 在点击时以新窗口打开，其余链接继续拦截。
+ *
+ * 注意：开启白名单后 sandbox 必须追加 allow-popups / allow-popups-to-escape-sandbox
+ * （否则 window.open 被沙箱阻止），因此守卫脚本同时监听 click 与 auxclick
+ * （中键点击不触发 click，需单独拦截，否则可绕过白名单直接弹窗）。
+ */
+/**
+ * 判断 hostname 是否命中白名单。
+ * 支持精确匹配与子域名匹配（如白名单 `example.com` 可放行 `www.example.com`），
+ * 忽略大小写；返回 true 表示“允许跳转”。
+ */
+export declare function isDomainAllowed(hostname: string | null | undefined, allowedDomains: readonly string[] | undefined): boolean;
+/**
+ * 将导航守卫脚本注入 HTML，返回新的 srcDoc 字符串。
+ *
+ * 脚本逻辑（依赖 sandbox 已放行 allow-scripts / allow-popups /
+ * allow-popups-to-escape-sandbox）：
+ * - 锚点（`#xxx`）或非链接元素：不拦截，保留默认行为；
+ * - href 无法解析，或协议非 http/https（如 javascript:、data:）：拦截；
+ * - hostname 命中白名单：以新窗口打开（_blank + noopener）；
+ * - 其余链接：拦截（防止 iframe 被导航走 / 逃逸到顶层）；
+ * - click 与 auxclick（中键）都拦截，避免中键绕过白名单直接弹窗。
+ *
+ * 白名单通过 `window.__ODN_NAV_GUARD_ALLOWED__` 注入，便于校验脚本与数据解耦；
+ * 注入前将 `<` 转义为 `\u003c`，防止白名单含 `</script>` 时提前闭合脚本标签。
+ */
+export declare function injectNavGuardScript(html: string, allowedDomains: readonly string[]): string;
+/** 将 html 增强为“可白名单放行导航”的 srcDoc；未传白名单时原样返回。 */
+export declare function withNavGuard(html: string, allowedDomains: readonly string[] | undefined): string;

package/dist/preview-panel/iframeNavGuard.js

@@ -0,0 +1,67 @@
+/* cspell:words noopener */
+/**
+ * iframe 导航守卫：
+ *
+ * PreviewPanel 渲染 text/html 时使用 sandbox="allow-scripts" 的 iframe，
+ * 内部链接默认被沙箱拦截（既不响应点击，也不能逃逸到顶层）。
+ * 通过 `allowedNavigateDomains` 白名单放行特定域名：命中白名单的链接
+ * 在点击时以新窗口打开，其余链接继续拦截。
+ *
+ * 注意：开启白名单后 sandbox 必须追加 allow-popups / allow-popups-to-escape-sandbox
+ * （否则 window.open 被沙箱阻止），因此守卫脚本同时监听 click 与 auxclick
+ * （中键点击不触发 click，需单独拦截，否则可绕过白名单直接弹窗）。
+ */
+
+/**
+ * 判断 hostname 是否命中白名单。
+ * 支持精确匹配与子域名匹配（如白名单 `example.com` 可放行 `www.example.com`），
+ * 忽略大小写；返回 true 表示“允许跳转”。
+ */
+export function isDomainAllowed(hostname, allowedDomains) {
+  if (!hostname || !allowedDomains || allowedDomains.length === 0) {
+    return false;
+  }
+  var normalized = hostname.toLowerCase();
+  return allowedDomains.some(function (domain) {
+    if (!domain || typeof domain !== 'string') return false;
+    var allowed = domain.trim().toLowerCase();
+    if (!allowed) return false;
+    return normalized === allowed || normalized.endsWith(".".concat(allowed));
+  });
+}
+
+/**
+ * 将导航守卫脚本注入 HTML，返回新的 srcDoc 字符串。
+ *
+ * 脚本逻辑（依赖 sandbox 已放行 allow-scripts / allow-popups /
+ * allow-popups-to-escape-sandbox）：
+ * - 锚点（`#xxx`）或非链接元素：不拦截，保留默认行为；
+ * - href 无法解析，或协议非 http/https（如 javascript:、data:）：拦截；
+ * - hostname 命中白名单：以新窗口打开（_blank + noopener）；
+ * - 其余链接：拦截（防止 iframe 被导航走 / 逃逸到顶层）；
+ * - click 与 auxclick（中键）都拦截，避免中键绕过白名单直接弹窗。
+ *
+ * 白名单通过 `window.__ODN_NAV_GUARD_ALLOWED__` 注入，便于校验脚本与数据解耦；
+ * 注入前将 `<` 转义为 `\u003c`，防止白名单含 `</script>` 时提前闭合脚本标签。
+ */
+export function injectNavGuardScript(html, allowedDomains) {
+  // JSON.stringify 不转义 <，这里显式转义，避免白名单内出现 </script> 闭合脚本
+  var serializedDomains = JSON.stringify(allowedDomains).replace(/</g, "\\u003c");
+  var navGuardScript = "\n<script>\nwindow.__ODN_NAV_GUARD_ALLOWED__ = ".concat(serializedDomains, ";\n(function () {\n  var allowed = window.__ODN_NAV_GUARD_ALLOWED__ || [];\n  function hostnameAllowed(hostname) {\n    if (!hostname || allowed.length === 0) return false;\n    hostname = hostname.toLowerCase();\n    return allowed.some(function (domain) {\n      if (!domain) return false;\n      domain = domain.toLowerCase();\n      return hostname === domain || hostname.slice(-(domain.length + 1)) === '.' + domain;\n    });\n  }\n  function isSafeHttp(url) {\n    return url.protocol === 'http:' || url.protocol === 'https:';\n  }\n  function intercept(event) {\n    var target = event.target;\n    if (!target || target.nodeType !== 1) return;\n    var anchor = target.closest && target.closest('a[href]');\n    if (!anchor) return;\n    var href = anchor.getAttribute('href') || '';\n    if (href.charAt(0) === '#') return;\n    if (href.indexOf('javascript:') === 0 || href.indexOf('data:') === 0) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n    var url;\n    try {\n      url = new URL(href, window.location.href);\n    } catch (e) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n    if (!isSafeHttp(url)) {\n      event.preventDefault();\n      event.stopPropagation();\n      return;\n    }\n    if (hostnameAllowed(url.hostname)) {\n      event.preventDefault();\n      event.stopPropagation();\n      window.open(url.href, '_blank', 'noopener');\n      return;\n    }\n    event.preventDefault();\n    event.stopPropagation();\n  }\n  if (document.addEventListener) {\n    document.addEventListener('click', intercept, true);\n    document.addEventListener('auxclick', intercept, true);\n  }\n})();\n</script>");
+  var lower = html.toLowerCase();
+  if (lower.includes('</body>')) {
+    return html.replace(/<\/body>/i, "".concat(navGuardScript, "</body>"));
+  }
+  if (lower.includes('</head>')) {
+    return html.replace(/<\/head>/i, "".concat(navGuardScript, "</head>"));
+  }
+  return "".concat(html).concat(navGuardScript);
+}
+
+/** 将 html 增强为“可白名单放行导航”的 srcDoc；未传白名单时原样返回。 */
+export function withNavGuard(html, allowedDomains) {
+  if (!allowedDomains || allowedDomains.length === 0) {
+    return html;
+  }
+  return injectNavGuardScript(html, allowedDomains);
+}

package/dist/preview-panel/index.d.ts

@@ -78,8 +78,18 @@ export interface PreviewPanelProps {
      * 未传则不渲染 Tooltip（向后兼容）。
      */
     actionTooltips?: PreviewPanelActionTooltips;
+    /**
+     * HTML 预览（`text/html`）时允许跳转的域名白名单。
+     *
+     * iframe 默认 `sandbox="allow-scripts"`，内部链接一律被沙箱拦截；
+     * 传入本配置后，命中白名单的链接在点击时会以新窗口打开，其余链接保持拦截。
+     * 支持精确匹配与子域名匹配（如 `example.com` 可放行 `www.example.com`），
+     * 忽略大小写；协议仅放行 `http:` / `https:`，`javascript:` 等始终拦截。
+     * 未传时保持原行为不变。
+     */
+    allowedNavigateDomains?: string[];
 }
-export declare function PreviewPanel({ tabs, activeTabId, onTabChange, onTabClose, onCloseAll, artifacts, onArtifactOpen, onDownload, onOpenInBrowser, onShare, fullscreen, onFullscreenChange, open, emptyTitle, emptyDescription, widthMode, actionTooltips, }: PreviewPanelProps): import("react").JSX.Element;
+export declare function PreviewPanel({ tabs, activeTabId, onTabChange, onTabClose, onCloseAll, artifacts, onArtifactOpen, onDownload, onOpenInBrowser, onShare, fullscreen, onFullscreenChange, open, emptyTitle, emptyDescription, widthMode, actionTooltips, allowedNavigateDomains, }: PreviewPanelProps): import("react").JSX.Element;
 export declare namespace PreviewPanel {
     var displayName: string;
 }

package/dist/preview-panel/index.js

@@ -12,6 +12,7 @@ import Popover from "../popover";
 import StreamText from "../stream-text";
 import Tooltip from "../tooltip";
 import { CsvPreviewTable } from "./CsvPreviewTable";
+import { withNavGuard } from "./iframeNavGuard";
 import { isCsvTab, parseCsv } from "./parseCsv";
 import "./style";
 
@@ -91,7 +92,8 @@ export function PreviewPanel(_ref2) {
     emptyDescription = _ref2$emptyDescriptio === void 0 ? '对话生成的附件会显示在这里' : _ref2$emptyDescriptio,
     _ref2$widthMode = _ref2.widthMode,
     widthMode = _ref2$widthMode === void 0 ? 'half' : _ref2$widthMode,
-    actionTooltips = _ref2.actionTooltips;
+    actionTooltips = _ref2.actionTooltips,
+    allowedNavigateDomains = _ref2.allowedNavigateDomains;
   var activeTab = (_ref3 = (_tabs$find = tabs.find(function (t) {
     return t.id === activeTabId;
   })) !== null && _tabs$find !== void 0 ? _tabs$find : tabs[0]) !== null && _ref3 !== void 0 ? _ref3 : null;
@@ -187,6 +189,10 @@ export function PreviewPanel(_ref2) {
     if (!activeTab || !isCsvTab(activeTab.type, activeTab.name)) return null;
     return parseCsv(activeTab.content);
   }, [activeTab]);
+  var hasNavGuard = !!allowedNavigateDomains && allowedNavigateDomains.length > 0;
+  var htmlSrcDoc = useMemo(function () {
+    return (activeTab === null || activeTab === void 0 ? void 0 : activeTab.type) === 'text/html' ? withNavGuard(activeTab.content, allowedNavigateDomains) : undefined;
+  }, [activeTab, allowedNavigateDomains]);
   var handleOpenInBrowser = function handleOpenInBrowser() {
     if (!activeTab) return;
     if (onOpenInBrowser) {
@@ -447,9 +453,10 @@ export function PreviewPanel(_ref2) {
     "data-odn-preview-panel-scroll": true,
     onScroll: handlePreviewScroll
   }, activeTab.type === 'text/html' ? /*#__PURE__*/React.createElement("iframe", {
-    srcDoc: activeTab.content,
-    sandbox: "allow-scripts",
+    srcDoc: htmlSrcDoc,
+    sandbox: hasNavGuard ? 'allow-scripts allow-popups allow-popups-to-escape-sandbox' : 'allow-scripts',
     "data-odn-preview-panel-iframe": true,
+    "data-odn-preview-panel-iframe-nav-guard": hasNavGuard || undefined,
     title: activeTab.name
   }) : isMarkdownTab(activeTab) ? /*#__PURE__*/React.createElement("div", {
     "data-odn-preview-panel-markdown": true

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "one-design-next",
-  "version": "0.0.89",
+  "version": "0.0.90",
   "description": "One Design Next from TAD@tencent.com",
   "license": "MIT",
   "type": "module",