@macrowing/filepilot-parser-mdoc 0.1.0

package/dist/index.cjs

@@ -0,0 +1,247 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.tsx
+var index_exports = {};
+__export(index_exports, {
+  default: () => MdocParser
+});
+module.exports = __toCommonJS(index_exports);
+var import_react = require("react");
+var import_react_dom = __toESM(require("react-dom"), 1);
+var import_client = require("react-dom/client");
+var import_bundles = require("@docflow/editor/bundles/index.css");
+var import_bundles2 = require("@docflow/mobile/bundles/index.css");
+var import_jsx_runtime = require("react/jsx-runtime");
+var reactRoots = /* @__PURE__ */ new WeakMap();
+var ensureReactDomLegacyRender = () => {
+  const legacyReactDOM = import_react_dom.default;
+  legacyReactDOM.render ?? (legacyReactDOM.render = (node, container) => {
+    const root = reactRoots.get(container) ?? (0, import_client.createRoot)(container);
+    reactRoots.set(container, root);
+    root.render(node);
+    return void 0;
+  });
+  legacyReactDOM.unmountComponentAtNode ?? (legacyReactDOM.unmountComponentAtNode = (container) => {
+    const root = reactRoots.get(container);
+    if (!root) return false;
+    root.unmount();
+    reactRoots.delete(container);
+    return true;
+  });
+};
+var HIGHLIGHT_ATTRIBUTE = "data-filepilot-block-range-highlight";
+var PREVIOUS_BACKGROUND_ATTRIBUTE = "data-filepilot-previous-background-color";
+var PREVIOUS_BACKGROUND_PRIORITY_ATTRIBUTE = "data-filepilot-previous-background-priority";
+var getDocflowBlocks = (container) => {
+  if (!container) return [];
+  const blocks = Array.from(container.querySelectorAll(".doc-block"));
+  return blocks.length ? blocks : Array.from(container.querySelectorAll("[component-name]"));
+};
+var clearBlockRangeHighlight = (container) => {
+  getDocflowBlocks(container).forEach((element) => {
+    if (!element.hasAttribute(HIGHLIGHT_ATTRIBUTE)) return;
+    element.style.setProperty(
+      "background-color",
+      element.getAttribute(PREVIOUS_BACKGROUND_ATTRIBUTE) ?? "",
+      element.getAttribute(PREVIOUS_BACKGROUND_PRIORITY_ATTRIBUTE) ?? ""
+    );
+    element.removeAttribute(HIGHLIGHT_ATTRIBUTE);
+    element.removeAttribute(PREVIOUS_BACKGROUND_ATTRIBUTE);
+    element.removeAttribute(PREVIOUS_BACKGROUND_PRIORITY_ATTRIBUTE);
+  });
+};
+var markBlockRangeElement = (element, color) => {
+  if (!element.hasAttribute(HIGHLIGHT_ATTRIBUTE)) {
+    element.setAttribute(PREVIOUS_BACKGROUND_ATTRIBUTE, element.style.backgroundColor);
+    element.setAttribute(PREVIOUS_BACKGROUND_PRIORITY_ATTRIBUTE, element.style.getPropertyPriority("background-color"));
+  }
+  element.setAttribute(HIGHLIGHT_ATTRIBUTE, "true");
+  element.style.setProperty("background-color", color, "important");
+};
+var applyBlockRangeHighlight = (container, range, color) => {
+  clearBlockRangeHighlight(container);
+  if (!range || !color) return;
+  const from = Math.min(range.from, range.to);
+  const to = Math.max(range.from, range.to);
+  if (!Number.isFinite(from) || !Number.isFinite(to) || from < 1) return;
+  getDocflowBlocks(container).slice(from - 1, to).forEach((element) => markBlockRangeElement(element, color));
+};
+var isSourceUrl = (source) => /^(?:https?:|data:|blob:|\/|\.\/|\.\.\/)/i.test(source);
+var readSourceBlob = async (source, fetchOptions) => {
+  if (typeof source === "string") {
+    if (isSourceUrl(source)) {
+      const response = await fetch(source, fetchOptions);
+      if (!response.ok) throw new Error(`Failed to load mdoc file: ${response.status} ${response.statusText}`);
+      return response.blob();
+    }
+    return new Blob([source], { type: "application/json" });
+  }
+  if (source instanceof Blob) return source;
+  const buffer = source instanceof Uint8Array ? source.slice().buffer : source;
+  return new Blob([buffer], { type: "application/octet-stream" });
+};
+var isJsonBuffer = (buffer) => {
+  const data = new Uint8Array(buffer);
+  for (let index = 0; index < data.length; index += 1) {
+    const byte = data[index];
+    if (byte === 239 && data[index + 1] === 187 && data[index + 2] === 191) {
+      index += 2;
+      continue;
+    }
+    if (byte === 32 || byte === 10 || byte === 13 || byte === 9) continue;
+    return byte === 123 || byte === 91;
+  }
+  return false;
+};
+var parseJsonContent = (content) => {
+  const trimmed = content.trimStart();
+  return trimmed.startsWith("{") || trimmed.startsWith("[") ? JSON.parse(content) : content;
+};
+var readMdocContent = async (source, core, fetchOptions) => {
+  if (typeof source === "string" && !isSourceUrl(source)) return parseJsonContent(source);
+  const blob = await readSourceBlob(source, fetchOptions);
+  const buffer = await blob.arrayBuffer();
+  if (isJsonBuffer(buffer)) return JSON.parse(new TextDecoder().decode(buffer));
+  return core.parseDocflowHistoryContent(buffer);
+};
+var useShallowStableValue = (value) => {
+  const ref = (0, import_react.useRef)(value);
+  const previous = ref.current;
+  const previousKeys = Object.keys(previous);
+  const nextKeys = Object.keys(value);
+  const isEqual = previousKeys.length === nextKeys.length && nextKeys.every((key) => previous[key] === value[key]);
+  if (!isEqual) ref.current = value;
+  return ref.current;
+};
+var toDocflowLocale = (locale) => locale?.startsWith("en") ? "en_US" : "zh_CN";
+var createEditor = async (engine, config) => {
+  ensureReactDomLegacyRender();
+  if (engine === "mobile") {
+    const mobile = await import("@docflow/mobile");
+    return new mobile.Editor(config);
+  }
+  const desktop = await import("@docflow/editor");
+  return new desktop.PreviewEditor(config);
+};
+var syncEditorContent = (editor, content) => {
+  if (typeof content === "string") {
+    editor.replaceContent?.(content);
+    return;
+  }
+  if (editor.replaceContentByJSON) {
+    editor.replaceContentByJSON(JSON.stringify(content));
+    return;
+  }
+  editor.replaceContent?.(content);
+};
+function MdocParser({ file, className, style, options, locale }) {
+  const containerRef = (0, import_react.useRef)(null);
+  const [error, setError] = (0, import_react.useState)();
+  const typedOptions = options ?? {};
+  const {
+    line,
+    lineRange,
+    lineRangeHighlightColor,
+    onEditorReady,
+    minHeight,
+    ...editorOptions
+  } = typedOptions;
+  const stableEditorOptions = useShallowStableValue(editorOptions);
+  const navigationRef = (0, import_react.useRef)({});
+  const scrolledLineRef = (0, import_react.useRef)(void 0);
+  const highlightedRangeRef = (0, import_react.useRef)(void 0);
+  const onEditorReadyRef = (0, import_react.useRef)(onEditorReady);
+  const engine = stableEditorOptions.engine ?? "desktop";
+  navigationRef.current = { line, lineRange, lineRangeHighlightColor };
+  onEditorReadyRef.current = onEditorReady;
+  const applyNavigation = (0, import_react.useCallback)((force = false) => {
+    const { line: line2, lineRange: lineRange2, lineRangeHighlightColor: lineRangeHighlightColor2 } = navigationRef.current;
+    const container = containerRef.current;
+    const rangeKey = lineRange2 ? `${lineRange2.from}:${lineRange2.to}:${lineRangeHighlightColor2 ?? ""}` : "";
+    if (line2 && scrolledLineRef.current !== line2 && container) {
+      getDocflowBlocks(container)[line2 - 1]?.scrollIntoView({ behavior: "smooth", block: "center" });
+      scrolledLineRef.current = line2;
+    }
+    if (!force && highlightedRangeRef.current === rangeKey) return;
+    highlightedRangeRef.current = rangeKey;
+    applyBlockRangeHighlight(container, lineRange2, lineRangeHighlightColor2);
+  }, []);
+  (0, import_react.useEffect)(() => {
+    let active = true;
+    let editor;
+    const container = containerRef.current;
+    if (!container) return;
+    setError(void 0);
+    container.innerHTML = "";
+    scrolledLineRef.current = void 0;
+    highlightedRangeRef.current = void 0;
+    import("@docflow/core").then(async (core) => {
+      const content = await readMdocContent(file.source, core, stableEditorOptions.fetchOptions);
+      if (!active) return;
+      const transformedContent = await stableEditorOptions.transformContent?.(content) ?? content;
+      if (!active) return;
+      const baseConfig = {
+        title: file.name ?? "",
+        readonly: true,
+        preview: true,
+        lang: toDocflowLocale(locale),
+        ...stableEditorOptions.config,
+        ...engine === "mobile" ? stableEditorOptions.mobileConfig : stableEditorOptions.desktopConfig,
+        content: transformedContent
+      };
+      editor = await createEditor(engine, baseConfig);
+      if (!active) {
+        editor.destroy();
+        return;
+      }
+      await editor.mount(container);
+      if (!active) return;
+      syncEditorContent(editor, transformedContent);
+      onEditorReadyRef.current?.(editor);
+      requestAnimationFrame(() => {
+        if (active) applyNavigation(true);
+      });
+    }).catch((error2) => {
+      if (active) setError(error2);
+    });
+    return () => {
+      active = false;
+      editor?.destroy();
+      container.innerHTML = "";
+    };
+  }, [file.source, file.name, stableEditorOptions, locale, engine, applyNavigation]);
+  (0, import_react.useEffect)(() => {
+    applyNavigation();
+  }, [line, lineRange?.from, lineRange?.to, lineRangeHighlightColor, applyNavigation]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className, style: { height: "100%", minHeight: minHeight ?? 480, ...style }, children: [
+    error ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: error instanceof Error ? error.message : "Failed to render mdoc file." }) : null,
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { ref: containerRef, style: { height: "100%", minHeight: minHeight ?? 480 } })
+  ] });
+}

package/dist/index.d.cts

@@ -0,0 +1,36 @@
+import * as react from 'react';
+import { CSSProperties } from 'react';
+import { EditorConfig } from '@docflow/editor';
+import { EditorConfig as EditorConfig$1 } from '@docflow/mobile';
+import { FilePilotRenderProps } from '@macrowing/filepilot-types';
+
+type ComponentLiteral = object;
+type DocflowEditorInstance = {
+    mount(host: HTMLElement): Promise<unknown>;
+    destroy(): void;
+    applyUpdate?(data: Uint8Array | ArrayBuffer): void;
+    replaceContent?(content: string | ComponentLiteral): void;
+    replaceContentByJSON?(json: string): void;
+};
+type DocflowContent = string | ComponentLiteral;
+type BaseDocflowConfig = Omit<EditorConfig, 'content' | 'title' | 'readonly' | 'preview' | 'lang'> & Omit<EditorConfig$1, 'content' | 'title' | 'readonly' | 'preview' | 'lang'>;
+type MdocBlockRange = {
+    from: number;
+    to: number;
+};
+type MdocParserOptions = {
+    line?: number;
+    lineRange?: MdocBlockRange;
+    lineRangeHighlightColor?: string;
+    config?: Partial<BaseDocflowConfig>;
+    mobileConfig?: Partial<EditorConfig$1>;
+    desktopConfig?: Partial<EditorConfig>;
+    engine?: 'desktop' | 'mobile';
+    fetchOptions?: RequestInit;
+    transformContent?: (content: DocflowContent) => DocflowContent | Promise<DocflowContent>;
+    onEditorReady?: (editor: DocflowEditorInstance) => void;
+    minHeight?: CSSProperties['minHeight'];
+};
+declare function MdocParser({ file, className, style, options, locale }: FilePilotRenderProps<MdocParserOptions>): react.JSX.Element;
+
+export { type MdocBlockRange, type MdocParserOptions, MdocParser as default };

package/dist/index.d.ts

@@ -0,0 +1,36 @@
+import * as react from 'react';
+import { CSSProperties } from 'react';
+import { EditorConfig } from '@docflow/editor';
+import { EditorConfig as EditorConfig$1 } from '@docflow/mobile';
+import { FilePilotRenderProps } from '@macrowing/filepilot-types';
+
+type ComponentLiteral = object;
+type DocflowEditorInstance = {
+    mount(host: HTMLElement): Promise<unknown>;
+    destroy(): void;
+    applyUpdate?(data: Uint8Array | ArrayBuffer): void;
+    replaceContent?(content: string | ComponentLiteral): void;
+    replaceContentByJSON?(json: string): void;
+};
+type DocflowContent = string | ComponentLiteral;
+type BaseDocflowConfig = Omit<EditorConfig, 'content' | 'title' | 'readonly' | 'preview' | 'lang'> & Omit<EditorConfig$1, 'content' | 'title' | 'readonly' | 'preview' | 'lang'>;
+type MdocBlockRange = {
+    from: number;
+    to: number;
+};
+type MdocParserOptions = {
+    line?: number;
+    lineRange?: MdocBlockRange;
+    lineRangeHighlightColor?: string;
+    config?: Partial<BaseDocflowConfig>;
+    mobileConfig?: Partial<EditorConfig$1>;
+    desktopConfig?: Partial<EditorConfig>;
+    engine?: 'desktop' | 'mobile';
+    fetchOptions?: RequestInit;
+    transformContent?: (content: DocflowContent) => DocflowContent | Promise<DocflowContent>;
+    onEditorReady?: (editor: DocflowEditorInstance) => void;
+    minHeight?: CSSProperties['minHeight'];
+};
+declare function MdocParser({ file, className, style, options, locale }: FilePilotRenderProps<MdocParserOptions>): react.JSX.Element;
+
+export { type MdocBlockRange, type MdocParserOptions, MdocParser as default };

package/dist/index.js

@@ -0,0 +1,216 @@
+// src/index.tsx
+import { useCallback, useEffect, useRef, useState } from "react";
+import ReactDOM from "react-dom";
+import { createRoot } from "react-dom/client";
+import "@docflow/editor/bundles/index.css";
+import "@docflow/mobile/bundles/index.css";
+import { jsx, jsxs } from "react/jsx-runtime";
+var reactRoots = /* @__PURE__ */ new WeakMap();
+var ensureReactDomLegacyRender = () => {
+  const legacyReactDOM = ReactDOM;
+  legacyReactDOM.render ?? (legacyReactDOM.render = (node, container) => {
+    const root = reactRoots.get(container) ?? createRoot(container);
+    reactRoots.set(container, root);
+    root.render(node);
+    return void 0;
+  });
+  legacyReactDOM.unmountComponentAtNode ?? (legacyReactDOM.unmountComponentAtNode = (container) => {
+    const root = reactRoots.get(container);
+    if (!root) return false;
+    root.unmount();
+    reactRoots.delete(container);
+    return true;
+  });
+};
+var HIGHLIGHT_ATTRIBUTE = "data-filepilot-block-range-highlight";
+var PREVIOUS_BACKGROUND_ATTRIBUTE = "data-filepilot-previous-background-color";
+var PREVIOUS_BACKGROUND_PRIORITY_ATTRIBUTE = "data-filepilot-previous-background-priority";
+var getDocflowBlocks = (container) => {
+  if (!container) return [];
+  const blocks = Array.from(container.querySelectorAll(".doc-block"));
+  return blocks.length ? blocks : Array.from(container.querySelectorAll("[component-name]"));
+};
+var clearBlockRangeHighlight = (container) => {
+  getDocflowBlocks(container).forEach((element) => {
+    if (!element.hasAttribute(HIGHLIGHT_ATTRIBUTE)) return;
+    element.style.setProperty(
+      "background-color",
+      element.getAttribute(PREVIOUS_BACKGROUND_ATTRIBUTE) ?? "",
+      element.getAttribute(PREVIOUS_BACKGROUND_PRIORITY_ATTRIBUTE) ?? ""
+    );
+    element.removeAttribute(HIGHLIGHT_ATTRIBUTE);
+    element.removeAttribute(PREVIOUS_BACKGROUND_ATTRIBUTE);
+    element.removeAttribute(PREVIOUS_BACKGROUND_PRIORITY_ATTRIBUTE);
+  });
+};
+var markBlockRangeElement = (element, color) => {
+  if (!element.hasAttribute(HIGHLIGHT_ATTRIBUTE)) {
+    element.setAttribute(PREVIOUS_BACKGROUND_ATTRIBUTE, element.style.backgroundColor);
+    element.setAttribute(PREVIOUS_BACKGROUND_PRIORITY_ATTRIBUTE, element.style.getPropertyPriority("background-color"));
+  }
+  element.setAttribute(HIGHLIGHT_ATTRIBUTE, "true");
+  element.style.setProperty("background-color", color, "important");
+};
+var applyBlockRangeHighlight = (container, range, color) => {
+  clearBlockRangeHighlight(container);
+  if (!range || !color) return;
+  const from = Math.min(range.from, range.to);
+  const to = Math.max(range.from, range.to);
+  if (!Number.isFinite(from) || !Number.isFinite(to) || from < 1) return;
+  getDocflowBlocks(container).slice(from - 1, to).forEach((element) => markBlockRangeElement(element, color));
+};
+var isSourceUrl = (source) => /^(?:https?:|data:|blob:|\/|\.\/|\.\.\/)/i.test(source);
+var readSourceBlob = async (source, fetchOptions) => {
+  if (typeof source === "string") {
+    if (isSourceUrl(source)) {
+      const response = await fetch(source, fetchOptions);
+      if (!response.ok) throw new Error(`Failed to load mdoc file: ${response.status} ${response.statusText}`);
+      return response.blob();
+    }
+    return new Blob([source], { type: "application/json" });
+  }
+  if (source instanceof Blob) return source;
+  const buffer = source instanceof Uint8Array ? source.slice().buffer : source;
+  return new Blob([buffer], { type: "application/octet-stream" });
+};
+var isJsonBuffer = (buffer) => {
+  const data = new Uint8Array(buffer);
+  for (let index = 0; index < data.length; index += 1) {
+    const byte = data[index];
+    if (byte === 239 && data[index + 1] === 187 && data[index + 2] === 191) {
+      index += 2;
+      continue;
+    }
+    if (byte === 32 || byte === 10 || byte === 13 || byte === 9) continue;
+    return byte === 123 || byte === 91;
+  }
+  return false;
+};
+var parseJsonContent = (content) => {
+  const trimmed = content.trimStart();
+  return trimmed.startsWith("{") || trimmed.startsWith("[") ? JSON.parse(content) : content;
+};
+var readMdocContent = async (source, core, fetchOptions) => {
+  if (typeof source === "string" && !isSourceUrl(source)) return parseJsonContent(source);
+  const blob = await readSourceBlob(source, fetchOptions);
+  const buffer = await blob.arrayBuffer();
+  if (isJsonBuffer(buffer)) return JSON.parse(new TextDecoder().decode(buffer));
+  return core.parseDocflowHistoryContent(buffer);
+};
+var useShallowStableValue = (value) => {
+  const ref = useRef(value);
+  const previous = ref.current;
+  const previousKeys = Object.keys(previous);
+  const nextKeys = Object.keys(value);
+  const isEqual = previousKeys.length === nextKeys.length && nextKeys.every((key) => previous[key] === value[key]);
+  if (!isEqual) ref.current = value;
+  return ref.current;
+};
+var toDocflowLocale = (locale) => locale?.startsWith("en") ? "en_US" : "zh_CN";
+var createEditor = async (engine, config) => {
+  ensureReactDomLegacyRender();
+  if (engine === "mobile") {
+    const mobile = await import("@docflow/mobile");
+    return new mobile.Editor(config);
+  }
+  const desktop = await import("@docflow/editor");
+  return new desktop.PreviewEditor(config);
+};
+var syncEditorContent = (editor, content) => {
+  if (typeof content === "string") {
+    editor.replaceContent?.(content);
+    return;
+  }
+  if (editor.replaceContentByJSON) {
+    editor.replaceContentByJSON(JSON.stringify(content));
+    return;
+  }
+  editor.replaceContent?.(content);
+};
+function MdocParser({ file, className, style, options, locale }) {
+  const containerRef = useRef(null);
+  const [error, setError] = useState();
+  const typedOptions = options ?? {};
+  const {
+    line,
+    lineRange,
+    lineRangeHighlightColor,
+    onEditorReady,
+    minHeight,
+    ...editorOptions
+  } = typedOptions;
+  const stableEditorOptions = useShallowStableValue(editorOptions);
+  const navigationRef = useRef({});
+  const scrolledLineRef = useRef(void 0);
+  const highlightedRangeRef = useRef(void 0);
+  const onEditorReadyRef = useRef(onEditorReady);
+  const engine = stableEditorOptions.engine ?? "desktop";
+  navigationRef.current = { line, lineRange, lineRangeHighlightColor };
+  onEditorReadyRef.current = onEditorReady;
+  const applyNavigation = useCallback((force = false) => {
+    const { line: line2, lineRange: lineRange2, lineRangeHighlightColor: lineRangeHighlightColor2 } = navigationRef.current;
+    const container = containerRef.current;
+    const rangeKey = lineRange2 ? `${lineRange2.from}:${lineRange2.to}:${lineRangeHighlightColor2 ?? ""}` : "";
+    if (line2 && scrolledLineRef.current !== line2 && container) {
+      getDocflowBlocks(container)[line2 - 1]?.scrollIntoView({ behavior: "smooth", block: "center" });
+      scrolledLineRef.current = line2;
+    }
+    if (!force && highlightedRangeRef.current === rangeKey) return;
+    highlightedRangeRef.current = rangeKey;
+    applyBlockRangeHighlight(container, lineRange2, lineRangeHighlightColor2);
+  }, []);
+  useEffect(() => {
+    let active = true;
+    let editor;
+    const container = containerRef.current;
+    if (!container) return;
+    setError(void 0);
+    container.innerHTML = "";
+    scrolledLineRef.current = void 0;
+    highlightedRangeRef.current = void 0;
+    import("@docflow/core").then(async (core) => {
+      const content = await readMdocContent(file.source, core, stableEditorOptions.fetchOptions);
+      if (!active) return;
+      const transformedContent = await stableEditorOptions.transformContent?.(content) ?? content;
+      if (!active) return;
+      const baseConfig = {
+        title: file.name ?? "",
+        readonly: true,
+        preview: true,
+        lang: toDocflowLocale(locale),
+        ...stableEditorOptions.config,
+        ...engine === "mobile" ? stableEditorOptions.mobileConfig : stableEditorOptions.desktopConfig,
+        content: transformedContent
+      };
+      editor = await createEditor(engine, baseConfig);
+      if (!active) {
+        editor.destroy();
+        return;
+      }
+      await editor.mount(container);
+      if (!active) return;
+      syncEditorContent(editor, transformedContent);
+      onEditorReadyRef.current?.(editor);
+      requestAnimationFrame(() => {
+        if (active) applyNavigation(true);
+      });
+    }).catch((error2) => {
+      if (active) setError(error2);
+    });
+    return () => {
+      active = false;
+      editor?.destroy();
+      container.innerHTML = "";
+    };
+  }, [file.source, file.name, stableEditorOptions, locale, engine, applyNavigation]);
+  useEffect(() => {
+    applyNavigation();
+  }, [line, lineRange?.from, lineRange?.to, lineRangeHighlightColor, applyNavigation]);
+  return /* @__PURE__ */ jsxs("div", { className, style: { height: "100%", minHeight: minHeight ?? 480, ...style }, children: [
+    error ? /* @__PURE__ */ jsx("div", { children: error instanceof Error ? error.message : "Failed to render mdoc file." }) : null,
+    /* @__PURE__ */ jsx("div", { ref: containerRef, style: { height: "100%", minHeight: minHeight ?? 480 } })
+  ] });
+}
+export {
+  MdocParser as default
+};

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@macrowing/filepilot-parser-mdoc",
+  "version": "0.1.0",
+  "description": "Docflow mdoc parser powered by @docflow/editor for FilePilot.",
+  "type": "module",
+  "sideEffects": [
+    "*.css"
+  ],
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "react": ">=18.2.0 || >=19.0.0",
+    "react-dom": ">=18.2.0 || >=19.0.0"
+  },
+  "dependencies": {
+    "@docflow/common": "2.17.0",
+    "@docflow/core": "2.17.0",
+    "@docflow/editor": "2.17.0",
+    "@docflow/mobile": "2.17.0",
+    "@docflow/mobile-core": "2.17.0",
+    "@docflow/ui": "2.17.0",
+    "@macrowing/filepilot-types": "0.1.0"
+  },
+  "devDependencies": {
+    "@types/react": "^19.0.12",
+    "rimraf": "^6.0.1",
+    "tsup": "^8.4.0"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsup src/index.tsx --format esm,cjs --dts --clean --external react --external react-dom --external react-dom/client --external @docflow/common --external @docflow/core --external @docflow/editor --external @docflow/mobile --external @docflow/mobile-core --external @docflow/ui",
+    "clean": "rimraf dist",
+    "typecheck": "tsc -p tsconfig.json --noEmit"
+  }
+}