@docfuse/plugins 0.1.0

package/dist/client/mermaid.js

@@ -0,0 +1,366 @@
+// src/client/shared.ts
+var ICONS = {
+  copy: '<svg viewBox="0 0 24 24" aria-hidden="true"><rect x="9" y="9" width="11" height="11" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>',
+  check: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="m5 12 4 4L19 6"/></svg>',
+  source: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="m6 8-4 4 4 4M18 8l4 4-4 4M14.5 4l-5 16"/></svg>',
+  expand: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7"/></svg>',
+  "zoom-out": '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14"/></svg>',
+  "zoom-reset": '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M3 12a9 9 0 1 0 3-6.7L3 8"/><path d="M3 3v5h5"/></svg>',
+  "zoom-in": '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>'
+};
+var DIAGRAM_SCALE_MIN = 0.5;
+var DIAGRAM_SCALE_MAX = 2;
+var DIAGRAM_SCALE_STEP = 0.25;
+async function copyText(value) {
+  if (navigator.clipboard) {
+    try {
+      await navigator.clipboard.writeText(value);
+      return true;
+    } catch {
+    }
+  }
+  if (typeof document.execCommand !== "function") return false;
+  const textarea = document.createElement("textarea");
+  textarea.value = value;
+  textarea.setAttribute("readonly", "");
+  textarea.style.position = "fixed";
+  textarea.style.opacity = "0";
+  document.body.append(textarea);
+  textarea.select();
+  try {
+    return document.execCommand("copy");
+  } finally {
+    textarea.remove();
+  }
+}
+function setupActions(figure) {
+  const controller = new AbortController();
+  const copyTimers = /* @__PURE__ */ new Map();
+  const dialogs = /* @__PURE__ */ new Set();
+  const source = figure.dataset.dfSource ?? "";
+  const preview = figure.querySelector(".df-diagram-preview");
+  const sourcePanel = figure.querySelector(".df-diagram-source");
+  const zoomControls = figure.querySelector(".df-diagram-zoom-controls");
+  const buttons = figure.querySelectorAll("[data-df-diagram-action]");
+  const previewHidden = preview?.hidden;
+  const sourcePanelHidden = sourcePanel?.hidden;
+  const zoomControlsHidden = zoomControls?.hidden;
+  const previewZoomWidth = preview?.style.getPropertyValue("--df-diagram-zoom-width") ?? "";
+  const previewZoomMaxWidth = preview?.style.getPropertyValue("--df-diagram-zoom-max-width") ?? "";
+  const previewScale = preview?.getAttribute("data-df-scale");
+  let scale = 1;
+  const buttonStates = [...buttons].map((button) => ({
+    button,
+    innerHTML: button.innerHTML,
+    ariaLabel: button.getAttribute("aria-label"),
+    copied: button.getAttribute("data-copied"),
+    actionError: button.getAttribute("data-df-action-error"),
+    disabled: button.disabled
+  }));
+  const updateScale = () => {
+    if (!preview) return;
+    preview.style.setProperty("--df-diagram-zoom-width", `${scale * 100}%`);
+    preview.style.setProperty("--df-diagram-zoom-max-width", `${56.25 * scale}rem`);
+    preview.dataset.dfScale = String(scale);
+    for (const button of buttons) {
+      const action = button.dataset.dfDiagramAction;
+      if (action === "zoom-out") button.disabled = scale <= DIAGRAM_SCALE_MIN;
+      if (action === "zoom-in") button.disabled = scale >= DIAGRAM_SCALE_MAX;
+      if (action === "zoom-reset") button.disabled = scale === 1;
+    }
+  };
+  if (zoomControls) updateScale();
+  for (const button of buttons) {
+    const action = button.dataset.dfDiagramAction;
+    button.innerHTML = ICONS[action] ?? "";
+    button.addEventListener(
+      "click",
+      async () => {
+        try {
+          if (action === "copy") {
+            if (!await copyText(source)) throw new Error("Copy command failed");
+            button.innerHTML = ICONS.check;
+            button.dataset.copied = "true";
+            const activeTimer = copyTimers.get(button);
+            if (activeTimer !== void 0) window.clearTimeout(activeTimer);
+            const timer = window.setTimeout(() => {
+              if (copyTimers.get(button) !== timer) return;
+              copyTimers.delete(button);
+              button.innerHTML = ICONS.copy;
+              delete button.dataset.copied;
+            }, 1500);
+            copyTimers.set(button, timer);
+          } else if (action === "source" && preview && sourcePanel) {
+            const showingSource = !sourcePanel.hidden;
+            sourcePanel.hidden = showingSource;
+            preview.hidden = !showingSource;
+            if (zoomControls) zoomControls.hidden = !showingSource;
+            button.setAttribute(
+              "aria-label",
+              showingSource ? buttonStates.find((state) => state.button === button)?.ariaLabel ?? "Show source" : button.dataset.dfDiagramPreviewLabel ?? "Show preview"
+            );
+          } else if (action === "expand" && preview) {
+            const dialog = document.createElement("dialog");
+            dialogs.add(dialog);
+            dialog.className = "df-diagram-dialog";
+            const close = document.createElement("button");
+            close.type = "button";
+            close.className = "df-diagram-dialog-close";
+            close.setAttribute("aria-label", button.dataset.dfDiagramCloseLabel ?? "Close expanded diagram");
+            close.textContent = "\xD7";
+            close.addEventListener("click", () => dialog.close(), { signal: controller.signal });
+            const expandedPreview = preview.cloneNode(true);
+            expandedPreview.style.removeProperty("--df-diagram-zoom-width");
+            expandedPreview.style.removeProperty("--df-diagram-zoom-max-width");
+            delete expandedPreview.dataset.dfScale;
+            dialog.append(close, expandedPreview);
+            dialog.addEventListener(
+              "close",
+              () => {
+                dialogs.delete(dialog);
+                dialog.remove();
+              },
+              { signal: controller.signal }
+            );
+            document.body.append(dialog);
+            dialog.showModal();
+          } else if (action === "zoom-out") {
+            scale = Math.max(DIAGRAM_SCALE_MIN, scale - DIAGRAM_SCALE_STEP);
+            updateScale();
+          } else if (action === "zoom-reset") {
+            scale = 1;
+            updateScale();
+          } else if (action === "zoom-in") {
+            scale = Math.min(DIAGRAM_SCALE_MAX, scale + DIAGRAM_SCALE_STEP);
+            updateScale();
+          }
+        } catch (error) {
+          button.dataset.dfActionError = "true";
+          console.error("[docfuse] Diagram action failed:", error);
+        }
+      },
+      { signal: controller.signal }
+    );
+  }
+  return () => {
+    controller.abort();
+    copyTimers.forEach((timer) => window.clearTimeout(timer));
+    dialogs.forEach((dialog) => dialog.remove());
+    copyTimers.clear();
+    dialogs.clear();
+    if (preview && previewHidden !== void 0) preview.hidden = previewHidden;
+    if (sourcePanel && sourcePanelHidden !== void 0) sourcePanel.hidden = sourcePanelHidden;
+    if (zoomControls && zoomControlsHidden !== void 0) zoomControls.hidden = zoomControlsHidden;
+    if (preview) {
+      if (previewZoomWidth) preview.style.setProperty("--df-diagram-zoom-width", previewZoomWidth);
+      else preview.style.removeProperty("--df-diagram-zoom-width");
+      if (previewZoomMaxWidth) preview.style.setProperty("--df-diagram-zoom-max-width", previewZoomMaxWidth);
+      else preview.style.removeProperty("--df-diagram-zoom-max-width");
+      if (previewScale == null) preview.removeAttribute("data-df-scale");
+      else preview.setAttribute("data-df-scale", previewScale);
+    }
+    buttonStates.forEach(({ button, innerHTML, ariaLabel, copied, actionError, disabled }) => {
+      button.innerHTML = innerHTML;
+      button.disabled = disabled;
+      if (ariaLabel === null) button.removeAttribute("aria-label");
+      else button.setAttribute("aria-label", ariaLabel);
+      if (copied === null) button.removeAttribute("data-copied");
+      else button.setAttribute("data-copied", copied);
+      if (actionError === null) button.removeAttribute("data-df-action-error");
+      else button.setAttribute("data-df-action-error", actionError);
+    });
+  };
+}
+function enhanceDiagrams(root, kind, render) {
+  let active = true;
+  let disposed = false;
+  const figures = Array.from(root.querySelectorAll(`[data-df-plugin-diagram="${kind}"]`)).filter(
+    (figure) => figure.dataset.dfEnhanced !== "true"
+  );
+  const renderErrorStates = figures.map(
+    (figure) => [figure, figure.getAttribute("data-df-render-error")]
+  );
+  const cleanups = [];
+  const renders = [];
+  for (const figure of figures) {
+    figure.dataset.dfEnhanced = "true";
+    cleanups.push(setupActions(figure));
+    if (render) {
+      renders.push(
+        render(figure).catch((error) => {
+          if (!active) return;
+          figure.dataset.dfRenderError = "true";
+          console.error(`[docfuse] ${kind} render failed:`, error);
+        })
+      );
+    }
+  }
+  const dispose = () => {
+    if (disposed) return;
+    disposed = true;
+    active = false;
+    cleanups.reverse().forEach((cleanup) => cleanup());
+    renderErrorStates.forEach(([figure, renderError]) => {
+      delete figure.dataset.dfEnhanced;
+      if (renderError === null) figure.removeAttribute("data-df-render-error");
+      else figure.setAttribute("data-df-render-error", renderError);
+    });
+  };
+  return Object.assign(dispose, {
+    ready: Promise.all(renders).then(() => void 0),
+    dispose
+  });
+}
+
+// src/client/mermaid.ts
+var sequence = 0;
+var remoteModules = /* @__PURE__ */ new Map();
+var renderRevisions = /* @__PURE__ */ new WeakMap();
+var renderQueues = /* @__PURE__ */ new WeakMap();
+var cssSrgbComponent = String.raw`[-+]?(?:\d*\.?\d+)(?:e[-+]?\d+)?%?`;
+var cssSrgbPattern = new RegExp(
+  String.raw`^color\(\s*srgb\s+(${cssSrgbComponent})\s+(${cssSrgbComponent})\s+(${cssSrgbComponent})(?:\s*\/\s*(${cssSrgbComponent}))?\s*\)$`,
+  "i"
+);
+function clamp(value, minimum, maximum) {
+  return Math.min(maximum, Math.max(minimum, value));
+}
+function normalizedSrgbComponent(component) {
+  const percentage = component.endsWith("%");
+  const value = Number(percentage ? component.slice(0, -1) : component);
+  return clamp(value, 0, percentage ? 100 : 1) / (percentage ? 100 : 1);
+}
+function normalizeMermaidColor(value, fallback) {
+  const color = value.trim();
+  const match = color.match(cssSrgbPattern);
+  if (!match) return /^(?:color|oklch|oklab|lab|lch)\(/i.test(color) ? fallback : color || fallback;
+  const channels = match.slice(1, 4).map((channel) => Math.round(normalizedSrgbComponent(channel) * 255));
+  if (channels.some((channel) => !Number.isFinite(channel))) return fallback;
+  const alpha = match[4] === void 0 ? 1 : normalizedSrgbComponent(match[4]);
+  if (!Number.isFinite(alpha)) return fallback;
+  return alpha < 1 ? `rgba(${channels.join(", ")}, ${alpha})` : `rgb(${channels.join(", ")})`;
+}
+function queueMermaidRender(mermaidApi, render) {
+  const previous = renderQueues.get(mermaidApi) ?? Promise.resolve();
+  const request = previous.then(render);
+  const tail = request.then(
+    () => void 0,
+    () => void 0
+  );
+  renderQueues.set(mermaidApi, tail);
+  void tail.then(() => {
+    if (renderQueues.get(mermaidApi) === tail) renderQueues.delete(mermaidApi);
+  });
+  return request;
+}
+function resolveThemeColor(figure, token, fallback) {
+  const probe = figure.ownerDocument.createElement("span");
+  probe.style.color = `var(${token}, ${fallback})`;
+  probe.style.display = "none";
+  figure.append(probe);
+  const color = normalizeMermaidColor(getComputedStyle(probe).color, fallback);
+  probe.remove();
+  return color;
+}
+async function loadMermaidModule(moduleUrl, importer = (url) => import(
+  /* @vite-ignore */
+  url
+)) {
+  const cached = remoteModules.get(moduleUrl);
+  if (cached) return cached;
+  const pending = importer(moduleUrl).then((module) => "default" in module ? module.default : module);
+  remoteModules.set(moduleUrl, pending);
+  void pending.catch(() => {
+    if (remoteModules.get(moduleUrl) === pending) remoteModules.delete(moduleUrl);
+  });
+  return pending;
+}
+async function resolveMermaid(figure) {
+  const moduleUrl = figure.dataset.dfModuleUrl?.trim() || new URL("./mermaid/mermaid.esm.min.mjs", import.meta.url).href;
+  return loadMermaidModule(moduleUrl);
+}
+async function renderMermaid(figure) {
+  const preview = figure.querySelector(".df-diagram-preview");
+  if (!preview) return;
+  const revision = (renderRevisions.get(figure) ?? 0) + 1;
+  renderRevisions.set(figure, revision);
+  const isCurrent = () => figure.dataset.dfEnhanced === "true" && renderRevisions.get(figure) === revision;
+  const mermaidApi = await resolveMermaid(figure);
+  if (!isCurrent()) return;
+  const surface = resolveThemeColor(figure, "--df-diagram-surface", "#ffffff");
+  const foreground = resolveThemeColor(figure, "--df-diagram-foreground", "#1d1d1f");
+  const accent = resolveThemeColor(figure, "--df-diagram-accent", "#0071e3");
+  const muted = resolveThemeColor(figure, "--df-diagram-muted", "#6e6e73");
+  const line = resolveThemeColor(figure, "--df-diagram-line", "#d2d2d7");
+  const result = await queueMermaidRender(mermaidApi, async () => {
+    if (!isCurrent()) return void 0;
+    mermaidApi.initialize({
+      startOnLoad: false,
+      securityLevel: "strict",
+      theme: "base",
+      themeVariables: {
+        background: surface,
+        primaryColor: surface,
+        primaryTextColor: foreground,
+        primaryBorderColor: accent,
+        secondaryColor: surface,
+        secondaryTextColor: foreground,
+        secondaryBorderColor: line,
+        tertiaryColor: surface,
+        tertiaryTextColor: foreground,
+        tertiaryBorderColor: line,
+        lineColor: line,
+        textColor: foreground,
+        noteBkgColor: surface,
+        noteTextColor: foreground,
+        noteBorderColor: line,
+        actorTextColor: foreground,
+        actorBkg: surface,
+        actorBorder: line,
+        signalColor: muted,
+        signalTextColor: foreground
+      }
+    });
+    return mermaidApi.render(`df-mermaid-${++sequence}`, figure.dataset.dfSource ?? "");
+  });
+  if (!result || !isCurrent()) return;
+  preview.innerHTML = result.svg;
+  delete figure.dataset.dfRenderError;
+}
+function enhance(root = document) {
+  const diagrams = enhanceDiagrams(root, "mermaid", renderMermaid);
+  const document2 = root instanceof Document ? root : root.ownerDocument;
+  if (!document2) return diagrams;
+  let scheduledFrame;
+  const observer = new MutationObserver(() => {
+    if (scheduledFrame !== void 0) return;
+    scheduledFrame = requestAnimationFrame(() => {
+      scheduledFrame = void 0;
+      const figures = root.querySelectorAll('[data-df-plugin-diagram="mermaid"]');
+      for (const figure of figures) {
+        void renderMermaid(figure).catch((error) => {
+          figure.dataset.dfRenderError = "true";
+          console.error("[docfuse] Mermaid render failed:", error);
+        });
+      }
+    });
+  });
+  observer.observe(document2.documentElement, {
+    attributes: true,
+    attributeFilter: ["class", "data-theme", "style"]
+  });
+  let disposed = false;
+  const dispose = () => {
+    if (disposed) return;
+    disposed = true;
+    if (scheduledFrame !== void 0) cancelAnimationFrame(scheduledFrame);
+    observer.disconnect();
+    diagrams();
+  };
+  return Object.assign(dispose, { ready: diagrams.ready, dispose });
+}
+export {
+  enhance,
+  loadMermaidModule,
+  normalizeMermaidColor
+};

package/dist/client/plantuml.js

@@ -0,0 +1,221 @@
+// src/client/shared.ts
+var ICONS = {
+  copy: '<svg viewBox="0 0 24 24" aria-hidden="true"><rect x="9" y="9" width="11" height="11" rx="2"/><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"/></svg>',
+  check: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="m5 12 4 4L19 6"/></svg>',
+  source: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="m6 8-4 4 4 4M18 8l4 4-4 4M14.5 4l-5 16"/></svg>',
+  expand: '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M15 3h6v6M9 21H3v-6M21 3l-7 7M3 21l7-7"/></svg>',
+  "zoom-out": '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M5 12h14"/></svg>',
+  "zoom-reset": '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M3 12a9 9 0 1 0 3-6.7L3 8"/><path d="M3 3v5h5"/></svg>',
+  "zoom-in": '<svg viewBox="0 0 24 24" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>'
+};
+var DIAGRAM_SCALE_MIN = 0.5;
+var DIAGRAM_SCALE_MAX = 2;
+var DIAGRAM_SCALE_STEP = 0.25;
+async function copyText(value) {
+  if (navigator.clipboard) {
+    try {
+      await navigator.clipboard.writeText(value);
+      return true;
+    } catch {
+    }
+  }
+  if (typeof document.execCommand !== "function") return false;
+  const textarea = document.createElement("textarea");
+  textarea.value = value;
+  textarea.setAttribute("readonly", "");
+  textarea.style.position = "fixed";
+  textarea.style.opacity = "0";
+  document.body.append(textarea);
+  textarea.select();
+  try {
+    return document.execCommand("copy");
+  } finally {
+    textarea.remove();
+  }
+}
+function setupActions(figure) {
+  const controller = new AbortController();
+  const copyTimers = /* @__PURE__ */ new Map();
+  const dialogs = /* @__PURE__ */ new Set();
+  const source = figure.dataset.dfSource ?? "";
+  const preview = figure.querySelector(".df-diagram-preview");
+  const sourcePanel = figure.querySelector(".df-diagram-source");
+  const zoomControls = figure.querySelector(".df-diagram-zoom-controls");
+  const buttons = figure.querySelectorAll("[data-df-diagram-action]");
+  const previewHidden = preview?.hidden;
+  const sourcePanelHidden = sourcePanel?.hidden;
+  const zoomControlsHidden = zoomControls?.hidden;
+  const previewZoomWidth = preview?.style.getPropertyValue("--df-diagram-zoom-width") ?? "";
+  const previewZoomMaxWidth = preview?.style.getPropertyValue("--df-diagram-zoom-max-width") ?? "";
+  const previewScale = preview?.getAttribute("data-df-scale");
+  let scale = 1;
+  const buttonStates = [...buttons].map((button) => ({
+    button,
+    innerHTML: button.innerHTML,
+    ariaLabel: button.getAttribute("aria-label"),
+    copied: button.getAttribute("data-copied"),
+    actionError: button.getAttribute("data-df-action-error"),
+    disabled: button.disabled
+  }));
+  const updateScale = () => {
+    if (!preview) return;
+    preview.style.setProperty("--df-diagram-zoom-width", `${scale * 100}%`);
+    preview.style.setProperty("--df-diagram-zoom-max-width", `${56.25 * scale}rem`);
+    preview.dataset.dfScale = String(scale);
+    for (const button of buttons) {
+      const action = button.dataset.dfDiagramAction;
+      if (action === "zoom-out") button.disabled = scale <= DIAGRAM_SCALE_MIN;
+      if (action === "zoom-in") button.disabled = scale >= DIAGRAM_SCALE_MAX;
+      if (action === "zoom-reset") button.disabled = scale === 1;
+    }
+  };
+  if (zoomControls) updateScale();
+  for (const button of buttons) {
+    const action = button.dataset.dfDiagramAction;
+    button.innerHTML = ICONS[action] ?? "";
+    button.addEventListener(
+      "click",
+      async () => {
+        try {
+          if (action === "copy") {
+            if (!await copyText(source)) throw new Error("Copy command failed");
+            button.innerHTML = ICONS.check;
+            button.dataset.copied = "true";
+            const activeTimer = copyTimers.get(button);
+            if (activeTimer !== void 0) window.clearTimeout(activeTimer);
+            const timer = window.setTimeout(() => {
+              if (copyTimers.get(button) !== timer) return;
+              copyTimers.delete(button);
+              button.innerHTML = ICONS.copy;
+              delete button.dataset.copied;
+            }, 1500);
+            copyTimers.set(button, timer);
+          } else if (action === "source" && preview && sourcePanel) {
+            const showingSource = !sourcePanel.hidden;
+            sourcePanel.hidden = showingSource;
+            preview.hidden = !showingSource;
+            if (zoomControls) zoomControls.hidden = !showingSource;
+            button.setAttribute(
+              "aria-label",
+              showingSource ? buttonStates.find((state) => state.button === button)?.ariaLabel ?? "Show source" : button.dataset.dfDiagramPreviewLabel ?? "Show preview"
+            );
+          } else if (action === "expand" && preview) {
+            const dialog = document.createElement("dialog");
+            dialogs.add(dialog);
+            dialog.className = "df-diagram-dialog";
+            const close = document.createElement("button");
+            close.type = "button";
+            close.className = "df-diagram-dialog-close";
+            close.setAttribute("aria-label", button.dataset.dfDiagramCloseLabel ?? "Close expanded diagram");
+            close.textContent = "\xD7";
+            close.addEventListener("click", () => dialog.close(), { signal: controller.signal });
+            const expandedPreview = preview.cloneNode(true);
+            expandedPreview.style.removeProperty("--df-diagram-zoom-width");
+            expandedPreview.style.removeProperty("--df-diagram-zoom-max-width");
+            delete expandedPreview.dataset.dfScale;
+            dialog.append(close, expandedPreview);
+            dialog.addEventListener(
+              "close",
+              () => {
+                dialogs.delete(dialog);
+                dialog.remove();
+              },
+              { signal: controller.signal }
+            );
+            document.body.append(dialog);
+            dialog.showModal();
+          } else if (action === "zoom-out") {
+            scale = Math.max(DIAGRAM_SCALE_MIN, scale - DIAGRAM_SCALE_STEP);
+            updateScale();
+          } else if (action === "zoom-reset") {
+            scale = 1;
+            updateScale();
+          } else if (action === "zoom-in") {
+            scale = Math.min(DIAGRAM_SCALE_MAX, scale + DIAGRAM_SCALE_STEP);
+            updateScale();
+          }
+        } catch (error) {
+          button.dataset.dfActionError = "true";
+          console.error("[docfuse] Diagram action failed:", error);
+        }
+      },
+      { signal: controller.signal }
+    );
+  }
+  return () => {
+    controller.abort();
+    copyTimers.forEach((timer) => window.clearTimeout(timer));
+    dialogs.forEach((dialog) => dialog.remove());
+    copyTimers.clear();
+    dialogs.clear();
+    if (preview && previewHidden !== void 0) preview.hidden = previewHidden;
+    if (sourcePanel && sourcePanelHidden !== void 0) sourcePanel.hidden = sourcePanelHidden;
+    if (zoomControls && zoomControlsHidden !== void 0) zoomControls.hidden = zoomControlsHidden;
+    if (preview) {
+      if (previewZoomWidth) preview.style.setProperty("--df-diagram-zoom-width", previewZoomWidth);
+      else preview.style.removeProperty("--df-diagram-zoom-width");
+      if (previewZoomMaxWidth) preview.style.setProperty("--df-diagram-zoom-max-width", previewZoomMaxWidth);
+      else preview.style.removeProperty("--df-diagram-zoom-max-width");
+      if (previewScale == null) preview.removeAttribute("data-df-scale");
+      else preview.setAttribute("data-df-scale", previewScale);
+    }
+    buttonStates.forEach(({ button, innerHTML, ariaLabel, copied, actionError, disabled }) => {
+      button.innerHTML = innerHTML;
+      button.disabled = disabled;
+      if (ariaLabel === null) button.removeAttribute("aria-label");
+      else button.setAttribute("aria-label", ariaLabel);
+      if (copied === null) button.removeAttribute("data-copied");
+      else button.setAttribute("data-copied", copied);
+      if (actionError === null) button.removeAttribute("data-df-action-error");
+      else button.setAttribute("data-df-action-error", actionError);
+    });
+  };
+}
+function enhanceDiagrams(root, kind, render) {
+  let active = true;
+  let disposed = false;
+  const figures = Array.from(root.querySelectorAll(`[data-df-plugin-diagram="${kind}"]`)).filter(
+    (figure) => figure.dataset.dfEnhanced !== "true"
+  );
+  const renderErrorStates = figures.map(
+    (figure) => [figure, figure.getAttribute("data-df-render-error")]
+  );
+  const cleanups = [];
+  const renders = [];
+  for (const figure of figures) {
+    figure.dataset.dfEnhanced = "true";
+    cleanups.push(setupActions(figure));
+    if (render) {
+      renders.push(
+        render(figure).catch((error) => {
+          if (!active) return;
+          figure.dataset.dfRenderError = "true";
+          console.error(`[docfuse] ${kind} render failed:`, error);
+        })
+      );
+    }
+  }
+  const dispose = () => {
+    if (disposed) return;
+    disposed = true;
+    active = false;
+    cleanups.reverse().forEach((cleanup) => cleanup());
+    renderErrorStates.forEach(([figure, renderError]) => {
+      delete figure.dataset.dfEnhanced;
+      if (renderError === null) figure.removeAttribute("data-df-render-error");
+      else figure.setAttribute("data-df-render-error", renderError);
+    });
+  };
+  return Object.assign(dispose, {
+    ready: Promise.all(renders).then(() => void 0),
+    dispose
+  });
+}
+
+// src/client/plantuml.ts
+function enhance(root = document) {
+  return enhanceDiagrams(root, "plantuml");
+}
+export {
+  enhance
+};