@owomark/view 0.1.5 → 0.1.7

package/README.md

@@ -10,7 +10,7 @@ npm install @owomark/view
 
 ## Scope
 
-- `createOwoMarkView()` and `createOwoMarkVanillaEditor()` for interactive editing
+- `createOwoMarkView()` for interactive editing
 - `createOwoMarkPreviewEngine()` and renderer registry APIs for preview DOM rendering
 - `PreviewDomPatcher` and `SideAnnotationPositioner` for browser layout work
 - `getThemeClassName()`, `light.css`, `dark.css`, `owomark.css`, `preview.css`, `slash-menu.css`, `side-annotation.css`

package/dist/.build-manifest.json

@@ -0,0 +1,76 @@
+{
+  "schemaVersion": 1,
+  "packageName": "@owomark/view",
+  "packagePath": "owomark/packages/owomark-view",
+  "packageFingerprint": "f70b7037c41905c87554e2d2a912d682e65e87ef960675bb32ee9a3776c4efd6",
+  "workspaceFingerprint": "29c91b05781cfd51984ade38b2b582f8dab1013dfaaf87ed5b2b6e9723653157",
+  "builtAt": "2026-04-22T18:27:59.683Z",
+  "builderVersion": "2026-04-22-industrialization-v1",
+  "inputFiles": [
+    "owomark/package.json",
+    "owomark/packages/owomark-view/package.json",
+    "owomark/packages/owomark-view/src/dom/patcher.ts",
+    "owomark/packages/owomark-view/src/dom/side-annotation-positioner.ts",
+    "owomark/packages/owomark-view/src/dom/skeleton.ts",
+    "owomark/packages/owomark-view/src/dom/slash-menu.ts",
+    "owomark/packages/owomark-view/src/editor.ts",
+    "owomark/packages/owomark-view/src/engine.ts",
+    "owomark/packages/owomark-view/src/index.ts",
+    "owomark/packages/owomark-view/src/internal/testing/vanilla-editor.ts",
+    "owomark/packages/owomark-view/src/internal/virtual/block-layout-map.ts",
+    "owomark/packages/owomark-view/src/internal/virtual/height-cache.ts",
+    "owomark/packages/owomark-view/src/internal/virtual/height-estimator.ts",
+    "owomark/packages/owomark-view/src/internal/virtual/viewport-manager.ts",
+    "owomark/packages/owomark-view/src/renderer/default-renderer.ts",
+    "owomark/packages/owomark-view/src/renderer/highlight-cache.ts",
+    "owomark/packages/owomark-view/src/renderer/registry.ts",
+    "owomark/packages/owomark-view/src/renderer/side-annotation-renderer.ts",
+    "owomark/packages/owomark-view/src/strategies/incremental.ts",
+    "owomark/packages/owomark-view/src/strategies/shared.ts",
+    "owomark/packages/owomark-view/src/strategies/virtual.ts",
+    "owomark/packages/owomark-view/src/style.css",
+    "owomark/packages/owomark-view/src/theme.ts",
+    "owomark/packages/owomark-view/src/theme/dark.css",
+    "owomark/packages/owomark-view/src/theme/light.css",
+    "owomark/packages/owomark-view/src/theme/owomark.css",
+    "owomark/packages/owomark-view/src/theme/preview.css",
+    "owomark/packages/owomark-view/src/theme/side-annotation.css",
+    "owomark/packages/owomark-view/src/theme/slash-menu.css",
+    "owomark/packages/owomark-view/src/theme/toolbar.css",
+    "owomark/packages/owomark-view/src/types.ts",
+    "owomark/packages/owomark-view/src/view-engine.ts",
+    "owomark/packages/owomark-view/src/virtual/block-layout-map.ts",
+    "owomark/packages/owomark-view/src/virtual/height-cache.ts",
+    "owomark/packages/owomark-view/src/virtual/height-estimator.ts",
+    "owomark/packages/owomark-view/src/virtual/offscreen-measurer.ts",
+    "owomark/packages/owomark-view/src/virtual/viewport-manager.ts",
+    "owomark/packages/owomark-view/src/worker/preview-render.worker.ts",
+    "owomark/packages/owomark-view/src/worker/preview-task-scheduler.ts",
+    "owomark/packages/owomark-view/src/worker/renderer-registry.ts",
+    "owomark/packages/owomark-view/src/worker/types.ts",
+    "owomark/packages/owomark-view/tsconfig.json",
+    "owomark/packages/owomark-view/tsup.config.ts",
+    "package-lock.json"
+  ],
+  "artifactFiles": [
+    "dist/chunk-3CKPBCIP.js",
+    "dist/chunk-656BO747.js",
+    "dist/chunk-6LWPFJCB.js",
+    "dist/chunk-BPOZMVU7.js",
+    "dist/index.d.ts",
+    "dist/index.js",
+    "dist/internal/virtual/block-layout-map.d.ts",
+    "dist/internal/virtual/block-layout-map.js",
+    "dist/internal/virtual/height-cache.d.ts",
+    "dist/internal/virtual/height-cache.js",
+    "dist/internal/virtual/height-estimator.d.ts",
+    "dist/internal/virtual/height-estimator.js",
+    "dist/internal/virtual/viewport-manager.d.ts",
+    "dist/internal/virtual/viewport-manager.js",
+    "dist/preview-render.worker.js",
+    "dist/types-D4TVpyP7.d.ts"
+  ],
+  "localDependencyFingerprints": {
+    "@owomark/core": "32024bd874bc287d8de92d6142487720dd3e31af4477e6f91a54b8e8db3aec4e"
+  }
+}

package/dist/{chunk-F3LG7AML.js → chunk-656BO747.js}

@@ -1,25 +1,44 @@
-// src/virtual/viewport-manager.ts
-var BLOCK_ID_ATTR = "data-block-id";
-var SOURCE_START_ATTR = "data-source-line-start";
-var SOURCE_END_ATTR = "data-source-line-end";
-var HEIGHT_TRANSITION = "top 0.15s ease-out";
-var TOTAL_HEIGHT_TRANSITION = "height 0.15s ease-out";
+// src/dom/skeleton.ts
 var SKELETON_GAP = 8;
-function createSkeletonHtml(height) {
-  const innerHeight = Math.max(height - SKELETON_GAP, 8);
-  return `<div class="owo-skeleton" style="height:${innerHeight}px;margin-bottom:${SKELETON_GAP}px;border-radius:4px;background:linear-gradient(90deg,#e2e2e2 25%,#efefef 50%,#e2e2e2 75%);background-size:200% 100%;animation:zm-skeleton-pulse 1.5s ease-in-out infinite" aria-hidden="true"></div>`;
+var SKELETON_LINE_HEIGHT = 14;
+var SKELETON_PADDING = 24;
+function createSkeletonHtml(options = {}) {
+  const { height, lines } = options;
+  const lineCount = lines ?? (height != null ? Math.max(1, Math.min(5, Math.round(Math.max(height - SKELETON_PADDING, 8) / (SKELETON_LINE_HEIGHT + SKELETON_GAP)))) : 3);
+  const heightStyle = height != null ? ` style="height:${height}px;min-height:${height}px"` : "";
+  const lineEls = [];
+  for (let i = 0; i < lineCount; i++) {
+    const isLast = i === lineCount - 1;
+    lineEls.push(`<div class="owo-mdx-skeleton owo-mdx-skeleton-line"${isLast ? ' style="width:60%"' : ""}></div>`);
+  }
+  return `<div class="owo-mdx-skeleton-block"${heightStyle} aria-hidden="true">${lineEls.join("")}</div>`;
 }
+var SKELETON_CSS = `
+.owo-mdx-skeleton{background:linear-gradient(90deg,var(--owo-skeleton-base,#e5e7eb) 25%,var(--owo-skeleton-shine,#f3f4f6) 50%,var(--owo-skeleton-base,#e5e7eb) 75%);background-size:200% 100%;animation:owo-mdx-skeleton-shimmer 1.5s ease-in-out infinite;border-radius:4px}
+@keyframes owo-mdx-skeleton-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
+.owo-mdx-skeleton-block{display:flex;flex-direction:column;gap:8px;padding:12px 0}
+.owo-mdx-skeleton-line{height:14px}
+.owo-mdx-skeleton-line:last-child{width:60%}
+`.trim();
+var STYLE_ID = "owo-mdx-skeleton-styles";
 function ensureSkeletonStyles(doc) {
   try {
-    if (doc.getElementById?.("owo-skeleton-styles")) return;
+    if (doc.getElementById?.(STYLE_ID)) return;
     const style = doc.createElement("style");
-    style.id = "owo-skeleton-styles";
-    style.textContent = `@keyframes zm-skeleton-pulse{0%{background-position:200% 0}100%{background-position:-200% 0}}`;
+    style.id = STYLE_ID;
+    style.textContent = SKELETON_CSS;
     const target = doc.head ?? doc.body;
     target?.appendChild(style);
   } catch {
   }
 }
+
+// src/virtual/viewport-manager.ts
+var BLOCK_ID_ATTR = "data-block-id";
+var SOURCE_START_ATTR = "data-source-line-start";
+var SOURCE_END_ATTR = "data-source-line-end";
+var HEIGHT_TRANSITION = "top 0.15s ease-out";
+var TOTAL_HEIGHT_TRANSITION = "height 0.15s ease-out";
 var VirtualViewportManager = class {
   root = null;
   scrollContainer = null;
@@ -89,11 +108,12 @@ var VirtualViewportManager = class {
         wrapper.setAttribute(BLOCK_ID_ATTR, block.blockId);
         wrapper.setAttribute(SOURCE_START_ATTR, String(block.startLine));
         wrapper.setAttribute(SOURCE_END_ATTR, String(block.endLine));
+        wrapper.style.display = "flow-root";
         wrapper.style.position = "absolute";
         wrapper.style.left = "0";
         wrapper.style.width = "100%";
         wrapper.style.transition = HEIGHT_TRANSITION;
-        wrapper.innerHTML = createSkeletonHtml(layout.height);
+        wrapper.innerHTML = createSkeletonHtml({ height: layout.height });
         this.contentLayer.appendChild(wrapper);
         this.mounted.set(block.blockId, wrapper);
         newlyMounted.add(block.blockId);
@@ -188,5 +208,7 @@ var VirtualViewportManager = class {
 };
 
 export {
+  createSkeletonHtml,
+  ensureSkeletonStyles,
   VirtualViewportManager
 };

package/dist/{chunk-Y72HQJQI.js → chunk-BPOZMVU7.js}

@@ -11,10 +11,9 @@ var HEAVY_LARGE_THRESHOLD = 50;
 var HEAVY_SMALL_HEIGHT = 60;
 var HEAVY_MEDIUM_HEIGHT = 200;
 var HEAVY_LARGE_HEIGHT = 500;
-var HEAVY_KINDS = /* @__PURE__ */ new Set(["mermaid", "katex", "math-block", "chart", "embed"]);
-function estimateBlockHeight(block) {
+function estimateBlockHeight(block, registry) {
   const lineCount = block.endLine - block.startLine + 1;
-  if (HEAVY_KINDS.has(block.kind)) {
+  if (registry?.isHeavy(block)) {
     return estimateHeavyBlockHeight(lineCount);
   }
   if (block.kind === "code-fence") {

package/dist/index.d.ts

@@ -1,5 +1,7 @@
-import { OwoMarkCore, OwoMarkEditorInstance, OwoMarkSharedState, PreviewBlockKind, PreviewBlock } from '@owomark/core';
+import { OwoMarkCore, PreviewBlock, CardsFamilyAttributes, CARDS_FAMILY_CUSTOM_BLOCK_KEY } from '@owomark/core';
 export { DocumentChangeCallback } from '@owomark/core';
+import { O as OwoMarkPreviewEngineOptions, a as OwoMarkPreviewEngine, P as PreviewRendererRegistry, b as PreviewTaskScheduler } from './types-D4TVpyP7.js';
+export { c as PreviewBlockMetadata, d as PreviewBlockRenderer, e as PreviewCacheEntry, f as PreviewRenderContext, g as PreviewRenderPhase, h as PreviewRenderResult, i as PreviewRendererDefinition, j as PreviewRendererMode, k as PreviewRendererRegistryLookup, l as PreviewRendererTarget, m as PreviewStrategy, n as PreviewTaskPriority } from './types-D4TVpyP7.js';
 
 /**
  * Three-layer view engine for OwoMark.
@@ -25,9 +27,8 @@ declare function createViewEngine(options: ViewEngineOptions): OwoMarkViewEngine
 /**
  * View engine for OwoMark.
  *
- * Provides two APIs:
+ * Public API:
  * - createOwoMarkView(core, element): Three-layer sovereign view engine
- * - createOwoMarkVanillaEditor(): Legacy standalone editor (backward compat)
  */
 
 type OwoMarkView = OwoMarkViewEngine;
@@ -39,82 +40,6 @@ type OwoMarkView = OwoMarkViewEngine;
  *   const view = createOwoMarkView(core, element);
  */
 declare function createOwoMarkView(core: OwoMarkCore, element: HTMLElement): OwoMarkView;
-/**
- * Create a standalone editor (creates its own Core internally).
- * Preserved for backward compatibility with vanilla adapter consumers.
- */
-declare function createOwoMarkVanillaEditor(): OwoMarkEditorInstance;
-
-type PreviewRenderPhase = 'idle' | 'rendering' | 'highlighting' | 'ready' | 'error';
-type PreviewCacheEntry = {
-    blockId: string;
-    renderKey: string;
-    html: string;
-    highlighted: boolean;
-    themeKey: string;
-    updatedAt: number;
-};
-type PreviewRenderContext = {
-    version: number;
-    themeKey: string;
-    abortSignal?: AbortSignal;
-    /**
-     * Line offset to add to source-line attributes in the rendered HTML.
-     * When a block starts at line N in the document, the renderer processes
-     * its raw content starting from line 1; this offset (N - 1) must be
-     * added to `data-source-line-start/end` so scroll sync anchors map
-     * to the correct document lines.
-     */
-    sourceLineOffset: number;
-};
-type PreviewRenderResult = {
-    kind: 'html';
-    html: string;
-} | {
-    kind: 'dom';
-    mount: (container: HTMLElement) => void;
-    unmount?: () => void;
-};
-type PreviewRendererMode = 'html-worker-safe' | 'dom-main-thread';
-type PreviewTaskPriority = 'realtime' | 'deferred';
-type PreviewRendererDefinition = {
-    mode: PreviewRendererMode;
-    priority: PreviewTaskPriority;
-    render: PreviewBlockRenderer;
-    version: string;
-};
-type PreviewBlockRenderer = (block: PreviewBlock, context: PreviewRenderContext) => Promise<PreviewRenderResult> | PreviewRenderResult;
-type PreviewRendererRegistry = {
-    get(kind: PreviewBlockKind): PreviewRendererDefinition | null;
-    register(kind: PreviewBlockKind, renderer: PreviewRendererDefinition): void;
-    unregister(kind: PreviewBlockKind): void;
-};
-type PreviewStrategy = 'incremental' | 'virtual';
-type OwoMarkPreviewEngineOptions = {
-    strategy?: PreviewStrategy;
-    themeKey?: string;
-    registry?: PreviewRendererRegistry;
-    viewportFirst?: boolean;
-    /**
-     * External block renderer function. When provided, the engine uses this
-     * instead of the built-in default renderer. This allows the host to supply
-     * its own Markdown pipeline (unified, remark, rehype, Shiki, etc.) without
-     * the preview package bundling those heavy dependencies.
-     */
-    renderBlock?: (block: PreviewBlock, context: PreviewRenderContext) => Promise<string>;
-    /**
-     * Called after every DOM mutation — including idle-backfilled and deferred
-     * block renders — not just after the synchronous update() return.
-     * Use for scroll sync or other post-DOM-update side effects.
-     */
-    onContentUpdate?: () => void;
-};
-type OwoMarkPreviewEngine = {
-    mount(root: HTMLElement): void;
-    destroy(): void;
-    update(state: OwoMarkSharedState): void;
-    getRenderedVersion(): number;
-};
 
 /**
  * OwoMark Preview Engine factory.
@@ -145,6 +70,30 @@ declare function createRendererRegistry(): PreviewRendererRegistry;
  */
 declare function renderBlockDefault(block: PreviewBlock): string;
 
+type CardsFamilyPreviewBlock = PreviewBlock & {
+    kind: 'custom';
+    attributes: CardsFamilyAttributes & {
+        customBlockKey: typeof CARDS_FAMILY_CUSTOM_BLOCK_KEY;
+    };
+};
+declare function isCardsFamilyPreviewBlock(block: PreviewBlock): block is CardsFamilyPreviewBlock;
+declare function renderCardsFamilyPreviewBlock(block: PreviewBlock): string;
+
+declare function isSideAnnotationPreviewBlock(block: PreviewBlock): boolean;
+declare function renderSideAnnotationPreviewBlock(block: PreviewBlock): string;
+
+declare function createPreviewTaskScheduler(options?: {
+    poolSize?: number;
+    onCrash?: () => void;
+}): PreviewTaskScheduler;
+
+type SkeletonOptions = {
+    height?: number;
+    lines?: number;
+};
+declare function createSkeletonHtml(options?: SkeletonOptions): string;
+declare function ensureSkeletonStyles(doc: Document): void;
+
 /**
  * DOM patcher: blockId-driven incremental DOM updates.
  *
@@ -226,4 +175,4 @@ declare const THEME_DARK_CLASS = "owo-theme-dark";
 type OwoMarkThemeName = 'light' | 'dark' | string;
 declare function getThemeClassName(theme: OwoMarkThemeName): string;
 
-export { type OwoMarkPreviewEngine, type OwoMarkPreviewEngineOptions, type OwoMarkThemeName, type OwoMarkView, type OwoMarkViewEngine, type PreviewBlockRenderer, type PreviewCacheEntry, PreviewDomPatcher, type PreviewRenderContext, type PreviewRenderPhase, type PreviewRenderResult, type PreviewRendererDefinition, type PreviewRendererMode, type PreviewRendererRegistry, type PreviewStrategy, type PreviewTaskPriority, SideAnnotationPositioner, THEME_DARK_CLASS, THEME_LIGHT_CLASS, type ViewEngineOptions, createOwoMarkPreviewEngine, createOwoMarkVanillaEditor, createOwoMarkView, createRendererRegistry, createViewEngine, getThemeClassName, renderBlockDefault };
+export { OwoMarkPreviewEngine, OwoMarkPreviewEngineOptions, type OwoMarkThemeName, type OwoMarkView, type OwoMarkViewEngine, PreviewDomPatcher, PreviewRendererRegistry, PreviewTaskScheduler, SideAnnotationPositioner, type SkeletonOptions, THEME_DARK_CLASS, THEME_LIGHT_CLASS, type ViewEngineOptions, createOwoMarkPreviewEngine, createOwoMarkView, createPreviewTaskScheduler, createRendererRegistry, createSkeletonHtml, createViewEngine, ensureSkeletonStyles, getThemeClassName, isCardsFamilyPreviewBlock, isSideAnnotationPreviewBlock, renderBlockDefault, renderCardsFamilyPreviewBlock, renderSideAnnotationPreviewBlock };