@sciflow/editor-start 0.0.1-beta → 0.0.1-beta2

package/dist/index.d.ts

@@ -13,5 +13,5 @@ export * from './lib/selection-editor.js';
 export * from './lib/theme.js';
 export { defaultCitationSourceAdapter, getCitationSourceAdapter, setCitationSourceAdapter, type CitationItem, type CitationSourceEditorAdapter, type CitationSourceEditorContext, } from './lib/citation-source-adapter.js';
 export { SourceField } from '@sciflow/editor-core';
-export { citationFeature, createFigureFeature, listFeature, blockquoteFeature, copyPasteFeature, installMockImageServer, configureImageUploadHandlers, requestImageFile, uploadImageFile, promptForFigureOptions, figureFeature, headingFeature, markFormattingFeature, tableFeature, } from '@sciflow/editor-core';
+export { citationFeature, crossReferenceFeature, createFigureFeature, listFeature, blockquoteFeature, copyPasteFeature, installMockImageServer, configureImageUploadHandlers, requestImageFile, uploadImageFile, promptForFigureOptions, figureFeature, footnoteFeature, headingFeature, markFormattingFeature, mathFeature, tableFeature, } from '@sciflow/editor-core';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,gBAAgB,CAAC;AAC/B,OAAO,EACL,4BAA4B,EAC5B,wBAAwB,EACxB,wBAAwB,EACxB,KAAK,YAAY,EACjB,KAAK,2BAA2B,EAChC,KAAK,2BAA2B,GACjC,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EACL,eAAe,EACf,mBAAmB,EACnB,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,sBAAsB,EACtB,4BAA4B,EAC5B,gBAAgB,EAChB,eAAe,EACf,sBAAsB,EACtB,aAAa,EACb,cAAc,EACd,qBAAqB,EACrB,YAAY,GACb,MAAM,sBAAsB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,cAAc,yBAAyB,CAAC;AACxC,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,gBAAgB,CAAC;AAC/B,OAAO,EACL,4BAA4B,EAC5B,wBAAwB,EACxB,wBAAwB,EACxB,KAAK,YAAY,EACjB,KAAK,2BAA2B,EAChC,KAAK,2BAA2B,GACjC,MAAM,kCAAkC,CAAC;AAG1C,OAAO,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACnD,OAAO,EACL,eAAe,EACf,qBAAqB,EACrB,mBAAmB,EACnB,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,sBAAsB,EACtB,4BAA4B,EAC5B,gBAAgB,EAChB,eAAe,EACf,sBAAsB,EACtB,aAAa,EACb,eAAe,EACf,cAAc,EACd,qBAAqB,EACrB,WAAW,EACX,YAAY,GACb,MAAM,sBAAsB,CAAC"}

package/dist/index.js

@@ -14,4 +14,4 @@ export * from './lib/theme.js';
 export { defaultCitationSourceAdapter, getCitationSourceAdapter, setCitationSourceAdapter, } from './lib/citation-source-adapter.js';
 // Convenience re-export: allow downstream bundles to pull SourceField from here.
 export { SourceField } from '@sciflow/editor-core';
-export { citationFeature, createFigureFeature, listFeature, blockquoteFeature, copyPasteFeature, installMockImageServer, configureImageUploadHandlers, requestImageFile, uploadImageFile, promptForFigureOptions, figureFeature, headingFeature, markFormattingFeature, tableFeature, } from '@sciflow/editor-core';
+export { citationFeature, crossReferenceFeature, createFigureFeature, listFeature, blockquoteFeature, copyPasteFeature, installMockImageServer, configureImageUploadHandlers, requestImageFile, uploadImageFile, promptForFigureOptions, figureFeature, footnoteFeature, headingFeature, markFormattingFeature, mathFeature, tableFeature, } from '@sciflow/editor-core';

package/dist/lib/citation-source-adapter.d.ts

@@ -7,12 +7,32 @@
  */
 import type { CitationItem } from '@sciflow/editor-core';
 export type { CitationItem };
+/**
+ * Reference entry for the citation ID dropdown (id + optional display label).
+ */
+export interface CitationReferenceOption {
+    id: string;
+    rawCitation?: string;
+}
 /**
  * Context passed to the adapter when rendering or updating.
  */
 export interface CitationSourceEditorContext {
-    /** Apply updated source string to the node via command API. */
-    applySource: (encoded: string | null) => boolean;
+    /**
+     * Apply updated source string to the node via command API (immediate commit).
+     * Optional when using draft flow; then only onSourceChange is used until an explicit Update.
+     */
+    applySource?: (encoded: string | null) => boolean;
+    /**
+     * Draft callback: called when source fields change without applying to the document.
+     * When provided, the adapter uses this instead of applySource for field changes.
+     */
+    onSourceChange?: (encoded: string | null) => void;
+    /**
+     * Optional list of references available in the editor (for ID dropdown).
+     * When provided, the default adapter renders a dropdown for the ID field instead of a text input.
+     */
+    getReferences?: () => CitationReferenceOption[];
 }
 /**
  * Adapter interface for rendering and editing citation source (CSL citation items).

package/dist/lib/citation-source-adapter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"citation-source-adapter.d.ts","sourceRoot":"","sources":["../../src/lib/citation-source-adapter.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAGzD,YAAY,EAAE,YAAY,EAAE,CAAC;AAE7B;;GAEG;AACH,MAAM,WAAW,2BAA2B;IAC1C,+DAA+D;IAC/D,WAAW,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,OAAO,CAAC;CAClD;AAED;;;GAGG;AACH,MAAM,WAAW,2BAA2B;IAC1C;;;;;OAKG;IACH,MAAM,CACJ,SAAS,EAAE,WAAW,EACtB,KAAK,EAAE,YAAY,EAAE,EACrB,OAAO,EAAE,2BAA2B,GACnC,IAAI,CAAC;IAER;;;;;OAKG;IACH,MAAM,CAAC,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,2BAA2B,GAAG,IAAI,CAAC;IAEnG;;;OAGG;IACH,OAAO,CAAC,CAAC,SAAS,EAAE,WAAW,GAAG,IAAI,CAAC;CACxC;AAED;;;GAGG;AACH,eAAO,MAAM,4BAA4B,EAAE,2BA0G1C,CAAC;AAKF;;;GAGG;AACH,wBAAgB,wBAAwB,CAAC,OAAO,EAAE,2BAA2B,GAAG,IAAI,GAAG,IAAI,CAE1F;AAED;;GAEG;AACH,wBAAgB,wBAAwB,IAAI,2BAA2B,CAEtE"}
+{"version":3,"file":"citation-source-adapter.d.ts","sourceRoot":"","sources":["../../src/lib/citation-source-adapter.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAGzD,YAAY,EAAE,YAAY,EAAE,CAAC;AAE7B;;GAEG;AACH,MAAM,WAAW,uBAAuB;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;GAEG;AACH,MAAM,WAAW,2BAA2B;IAC1C;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,OAAO,CAAC;IAClD;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAClD;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,uBAAuB,EAAE,CAAC;CACjD;AAED;;;GAGG;AACH,MAAM,WAAW,2BAA2B;IAC1C;;;;;OAKG;IACH,MAAM,CACJ,SAAS,EAAE,WAAW,EACtB,KAAK,EAAE,YAAY,EAAE,EACrB,OAAO,EAAE,2BAA2B,GACnC,IAAI,CAAC;IAER;;;;;OAKG;IACH,MAAM,CAAC,CAAC,SAAS,EAAE,WAAW,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,OAAO,EAAE,2BAA2B,GAAG,IAAI,CAAC;IAEnG;;;OAGG;IACH,OAAO,CAAC,CAAC,SAAS,EAAE,WAAW,GAAG,IAAI,CAAC;CACxC;AAED;;;GAGG;AACH,eAAO,MAAM,4BAA4B,EAAE,2BAiL1C,CAAC;AAKF;;;GAGG;AACH,wBAAgB,wBAAwB,CAAC,OAAO,EAAE,2BAA2B,GAAG,IAAI,GAAG,IAAI,CAE1F;AAED;;GAEG;AACH,wBAAgB,wBAAwB,IAAI,2BAA2B,CAEtE"}

package/dist/lib/citation-source-adapter.js

@@ -24,61 +24,117 @@ export const defaultCitationSourceAdapter = {
             })
                 .filter((item) => item !== null);
             const encoded = SourceField.toString(normalized);
-            context.applySource(encoded);
+            if (context.onSourceChange) {
+                context.onSourceChange(encoded);
+            }
+            else if (context.applySource) {
+                context.applySource(encoded);
+            }
         };
-        items.forEach((item, index) => {
-            const section = document.createElement('div');
-            section.className = 'citation-source-item';
-            section.setAttribute('data-citation-index', String(index));
-            const fields = [
-                { key: 'id', label: 'ID', type: 'text', required: true },
-                { key: 'label', label: 'Label', type: 'text' },
-                { key: 'locator', label: 'Locator', type: 'text' },
-                { key: 'prefix', label: 'Prefix', type: 'text' },
-                { key: 'suffix', label: 'Suffix', type: 'text' },
-                { key: 'suppress-author', label: 'Suppress author', type: 'checkbox' },
-                { key: 'author-only', label: 'Author only', type: 'checkbox' },
-            ];
-            fields.forEach(({ key, label, type }) => {
-                const fieldDiv = document.createElement('div');
-                fieldDiv.className = 'citation-source-field';
-                fieldDiv.setAttribute('data-field', key);
-                const idAttr = `citation-${index}-${key}`;
-                const labelEl = document.createElement('label');
-                labelEl.htmlFor = idAttr;
-                labelEl.className = 'selection-editor-attr-label';
-                labelEl.textContent = `${label}:`;
-                fieldDiv.appendChild(labelEl);
-                if (type === 'checkbox') {
-                    const input = document.createElement('input');
-                    input.type = 'checkbox';
-                    input.id = idAttr;
-                    input.className = 'selection-editor-input';
-                    const val = item[key];
-                    input.checked = val === 1 || val === true;
-                    input.addEventListener('change', () => {
-                        items[index][key] = input.checked ? 1 : undefined;
-                        apply();
+        const appendTextInput = (fieldDiv, idAttr, item, key, index, itemsList, applyFn) => {
+            const input = document.createElement('input');
+            input.type = 'text';
+            input.id = idAttr;
+            input.className = 'selection-editor-input';
+            input.placeholder = 'No value';
+            const val = item[key];
+            input.value = typeof val === 'string' ? val : val != null ? String(val) : '';
+            input.addEventListener('change', () => {
+                const v = input.value.trim();
+                itemsList[index][key] = v || undefined;
+                applyFn();
+            });
+            fieldDiv.appendChild(input);
+        };
+        const idFieldOnly = [
+            { key: 'id', label: 'ID', type: 'text', required: true },
+        ];
+        const extraFields = [
+            { key: 'label', label: 'Label', type: 'text' },
+            { key: 'locator', label: 'Locator', type: 'text' },
+            { key: 'prefix', label: 'Prefix', type: 'text' },
+            { key: 'suffix', label: 'Suffix', type: 'text' },
+            { key: 'suppress-author', label: 'Suppress author', type: 'checkbox' },
+            { key: 'author-only', label: 'Author only', type: 'checkbox' },
+        ];
+        const renderField = (section, item, index, key, label, type) => {
+            const fieldDiv = document.createElement('div');
+            fieldDiv.className =
+                type === 'checkbox' ? 'citation-source-field citation-source-field--checkbox' : 'citation-source-field';
+            fieldDiv.setAttribute('data-field', key);
+            const idAttr = `citation-${index}-${key}`;
+            const labelEl = document.createElement('label');
+            labelEl.htmlFor = idAttr;
+            labelEl.className = 'selection-editor-attr-label';
+            labelEl.textContent = `${label}:`;
+            fieldDiv.appendChild(labelEl);
+            if (type === 'checkbox') {
+                const input = document.createElement('input');
+                input.type = 'checkbox';
+                input.id = idAttr;
+                input.className = 'selection-editor-input';
+                const val = item[key];
+                input.checked = val === 1 || val === true;
+                input.addEventListener('change', () => {
+                    items[index][key] = input.checked ? 1 : undefined;
+                    apply();
+                });
+                fieldDiv.appendChild(input);
+            }
+            else if (key === 'id' && context.getReferences) {
+                const refs = context.getReferences();
+                if (refs.length > 0) {
+                    const select = document.createElement('select');
+                    select.id = idAttr;
+                    select.className = 'selection-editor-input selection-editor-select';
+                    const currentId = typeof item.id === 'string' ? item.id : item.id != null ? String(item.id) : '';
+                    const emptyOpt = document.createElement('option');
+                    emptyOpt.value = '';
+                    emptyOpt.textContent = 'No value';
+                    select.appendChild(emptyOpt);
+                    refs.forEach((ref) => {
+                        const opt = document.createElement('option');
+                        opt.value = ref.id;
+                        opt.textContent = (ref.rawCitation ?? ref.id).trim() || ref.id;
+                        select.appendChild(opt);
                     });
-                    fieldDiv.appendChild(input);
-                }
-                else {
-                    const input = document.createElement('input');
-                    input.type = 'text';
-                    input.id = idAttr;
-                    input.className = 'selection-editor-input';
-                    input.placeholder = 'No value';
-                    const val = item[key];
-                    input.value = typeof val === 'string' ? val : val != null ? String(val) : '';
-                    input.addEventListener('change', () => {
-                        const v = input.value.trim();
+                    select.value = refs.some((r) => r.id === currentId) ? currentId : '';
+                    select.addEventListener('change', () => {
+                        const v = select.value.trim();
                         items[index][key] = v || undefined;
                         apply();
                     });
-                    fieldDiv.appendChild(input);
+                    fieldDiv.appendChild(select);
+                }
+                else {
+                    appendTextInput(fieldDiv, idAttr, item, key, index, items, apply);
                 }
-                section.appendChild(fieldDiv);
+            }
+            else {
+                appendTextInput(fieldDiv, idAttr, item, key, index, items, apply);
+            }
+            section.appendChild(fieldDiv);
+        };
+        items.forEach((item, index) => {
+            const section = document.createElement('div');
+            section.className = 'citation-source-item';
+            section.setAttribute('data-citation-index', String(index));
+            idFieldOnly.forEach(({ key, label, type }) => {
+                renderField(section, item, index, key, label, type);
+            });
+            const details = document.createElement('details');
+            details.className = 'citation-source-details';
+            const summary = document.createElement('summary');
+            summary.className = 'citation-source-details-summary';
+            summary.textContent = 'Label, locator, prefix…';
+            details.appendChild(summary);
+            const detailsBody = document.createElement('div');
+            detailsBody.className = 'citation-source-details-body';
+            extraFields.forEach(({ key, label, type }) => {
+                renderField(detailsBody, item, index, key, label, type);
             });
+            details.appendChild(detailsBody);
+            section.appendChild(details);
             if (items.length > 1) {
                 const removeBtn = document.createElement('button');
                 removeBtn.type = 'button';

package/dist/lib/drag-preview.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Configure a transparent, offset drag image for HTML5 drag operations.
+ * Makes it easier to see the drop cursor while dragging references or headings.
+ *
+ * @param event - The dragstart event
+ * @param options - Optional opacity (0–1), vertical offset (positive = above cursor), and scale (0–1)
+ */
+export declare function setTransparentDragImage(event: DragEvent, options?: {
+    opacity?: number;
+    offsetY?: number;
+    scale?: number;
+}): void;
+//# sourceMappingURL=drag-preview.d.ts.map

package/dist/lib/drag-preview.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drag-preview.d.ts","sourceRoot":"","sources":["../../src/lib/drag-preview.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,SAAS,EAChB,OAAO,GAAE;IAAE,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,OAAO,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAO,GACnE,IAAI,CA+BN"}

package/dist/lib/drag-preview.js

@@ -0,0 +1,36 @@
+/**
+ * Configure a transparent, offset drag image for HTML5 drag operations.
+ * Makes it easier to see the drop cursor while dragging references or headings.
+ *
+ * @param event - The dragstart event
+ * @param options - Optional opacity (0–1), vertical offset (positive = above cursor), and scale (0–1)
+ */
+export function setTransparentDragImage(event, options = {}) {
+    const transfer = event.dataTransfer;
+    const target = event.target;
+    if (!transfer || !(target instanceof HTMLElement))
+        return;
+    const { opacity = 0.5, offsetY = 20, scale = 1 } = options;
+    const clone = target.cloneNode(true);
+    clone.style.opacity = String(opacity);
+    clone.style.transform = `scale(${scale})`;
+    clone.style.transformOrigin = 'bottom center';
+    clone.style.position = 'absolute';
+    clone.style.top = '-9999px';
+    clone.style.left = '-9999px';
+    clone.style.pointerEvents = 'none';
+    clone.style.maxWidth = '18rem';
+    clone.style.fontSize = '0.65rem';
+    const root = target.getRootNode();
+    const container = root instanceof ShadowRoot ? root : document.body;
+    container.appendChild(clone);
+    const rect = clone.getBoundingClientRect();
+    const x = Math.floor(rect.width / 2);
+    const y = Math.floor(rect.height) + offsetY;
+    try {
+        transfer.setDragImage(clone, x, y);
+    }
+    finally {
+        requestAnimationFrame(() => clone.remove());
+    }
+}

package/dist/lib/editor-element.d.ts

@@ -108,6 +108,14 @@ export declare class SciFlowEditorElement extends LitElement {
     headingText: string;
     /** Paragraph text used when no initial content is provided. */
     placeholder: string;
+    /**
+     * Max-width of the ProseMirror content area.
+     * Approximates page-like text columns at 11pt:
+     * - 'narrow': narrow column (~52 characters per line)
+     * - 'wide': normal column (~82 characters per line)
+     * Styles are applied to the shadow DOM.
+     */
+    editorWidth: 'narrow' | 'wide';
     private view;
     private editor?;
     private docUnsub?;
@@ -121,12 +129,17 @@ export declare class SciFlowEditorElement extends LitElement {
     private shadowStyleElements;
     private themeUnsub?;
     private themeStyleElements;
+    private _hostDragoverBound;
     /** Access the underlying ProseMirror view instance. */
     get editorView(): ReturnType<Editor['getView']> | null;
     /** Access SciFlow command helpers bound to the current editor view. */
     get commands(): CommandRunner | null;
     /** Get read-only access to the document structure for traversal. */
     get document(): ProsemirrorNode | null;
+    /** Get the current references (bibliography) stored with the document. */
+    get references(): SnapshotReference[];
+    /** Get the merged selection UI schema (Draft-07 + _ui_*), when available. */
+    getSelectionUiSchema(): import("@sciflow/editor-core").SelectionUiSchema | undefined;
     /** Get position utilities for coordinate mapping. */
     get positions(): {
         coordsAtPos: (pos: number) => {
@@ -185,6 +198,8 @@ export declare class SciFlowEditorElement extends LitElement {
     private isExternalDocUpdate;
     private extractDocFromInput;
     private buildSyncUpdate;
+    private isNoopSyncUpdate;
+    private deepEqualsJSON;
     /**
      * Determine which document should be loaded on startup.
      * Preference order: externally supplied JSON, provided PM node, fallback.
@@ -243,9 +258,9 @@ export declare class SciFlowEditorElement extends LitElement {
     private destroyEditor;
     private capturePendingOps;
     private applyShadowStyles;
+    private getEditorWidthStyles;
     private normalizeShadowStyles;
     private extractCssFromSheet;
-    private debugTestLog;
 }
 declare global {
     interface HTMLElementTagNameMap {

package/dist/lib/editor-element.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"editor-element.d.ts","sourceRoot":"","sources":["../../src/lib/editor-element.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"editor-element.d.ts","sourceRoot":"","sources":["../../src/lib/editor-element.ts"],"names":[],"mappings":"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"}

package/dist/lib/editor-element.js

@@ -26,7 +26,7 @@
 import { __decorate } from "tslib";
 import { css, html, unsafeCSS, LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import { Editor, SourceField, citationFeature, figureFeature, headingFeature, markFormattingFeature, tableFeature, } from '@sciflow/editor-core';
+import { Editor, SourceField, citationFeature, crossReferenceFeature, figureFeature, footnoteFeature, headingFeature, markFormattingFeature, mathFeature, tableFeature, } from '@sciflow/editor-core';
 import { manuscript as manuscriptSchema } from '@sciflow/schema-prosemirror';
 import editorStyles from './editor-element.css?inline';
 import { applyThemeStylesToRoot, subscribeToSciFlowTheme } from './theme.js';
@@ -73,6 +73,14 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
         this.headingText = 'Moby-Dick: A Study in Obsession';
         /** Paragraph text used when no initial content is provided. */
         this.placeholder = 'Introduce Ishmael and the enigmatic Captain Ahab…';
+        /**
+         * Max-width of the ProseMirror content area.
+         * Approximates page-like text columns at 11pt:
+         * - 'narrow': narrow column (~52 characters per line)
+         * - 'wide': normal column (~82 characters per line)
+         * Styles are applied to the shadow DOM.
+         */
+        this.editorWidth = 'wide';
         this.view = null;
         this.pendingOps = [];
         this.pendingOpsFromTransform = false;
@@ -80,6 +88,7 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
         this.deferInitializationForDoc = false;
         this.shadowStyleElements = [];
         this.themeStyleElements = [];
+        this._hostDragoverBound = null;
     }
     get shadowStyles() {
         return this._shadowStyles;
@@ -102,6 +111,14 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
     get document() {
         return this.editor?.getDocument() ?? null;
     }
+    /** Get the current references (bibliography) stored with the document. */
+    get references() {
+        return this.editor?.getReferences() ?? [];
+    }
+    /** Get the merged selection UI schema (Draft-07 + _ui_*), when available. */
+    getSelectionUiSchema() {
+        return this.editor?.getSelectionUiSchema?.();
+    }
     /** Get position utilities for coordinate mapping. */
     get positions() {
         return {
@@ -138,23 +155,22 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
     }
     connectedCallback() {
         super.connectedCallback();
+        this._hostDragoverBound = (e) => {
+            if (!e.dataTransfer?.types || !this.contains(e.target))
+                return;
+            const types = Array.from(e.dataTransfer.types);
+            const allow = types.includes('application/x-sciflow-reference') ||
+                types.includes('application/x-sciflow-cross-reference');
+            if (!allow)
+                return;
+            e.preventDefault();
+            e.dataTransfer.dropEffect = 'copy';
+        };
+        this.addEventListener('dragover', this._hostDragoverBound, { capture: true });
         this.themeUnsub = subscribeToSciFlowTheme((cssTexts) => {
             this.themeStyleElements = applyThemeStylesToRoot(this.renderRoot, this.themeStyleElements, cssTexts);
             this.applyShadowStyles();
         });
-        queueMicrotask(() => {
-            this.debugTestLog('connected microtask', { hasEditor: !!this.editor });
-            if (this.editor) {
-                return;
-            }
-            try {
-                const initialDoc = this.resolveInitialDoc();
-                this.dispatchEditorChange(initialDoc.toJSON(), [], []);
-            }
-            catch {
-                // Ignore errors during eager ready dispatch; initialization will retry in firstUpdated.
-            }
-        });
     }
     /**
      * React to property changes coming from the host application.
@@ -173,6 +189,9 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
         if (changedProperties.has('shadowStyles') && !this._shadowStylesAppliedExternally) {
             this.applyShadowStyles();
         }
+        if (changedProperties.has('editorWidth')) {
+            this.applyShadowStyles();
+        }
         // Reset flag for next update
         if (changedProperties.has('shadowStyles')) {
             this._shadowStylesAppliedExternally = false;
@@ -186,6 +205,10 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
      * Other frameworks should execute the same logic in their unmount hook.
      */
     disconnectedCallback() {
+        if (this._hostDragoverBound) {
+            this.removeEventListener('dragover', this._hostDragoverBound, { capture: true });
+            this._hostDragoverBound = null;
+        }
         super.disconnectedCallback();
         this.themeUnsub?.();
         this.themeUnsub = undefined;
@@ -215,7 +238,16 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
      * Resolves a mount point, creates the editor instance, and wires listeners.
      */
     getDefaultFeatures() {
-        return [citationFeature, markFormattingFeature, headingFeature, figureFeature, tableFeature];
+        return [
+            citationFeature,
+            crossReferenceFeature,
+            footnoteFeature,
+            markFormattingFeature,
+            headingFeature,
+            figureFeature,
+            tableFeature,
+            mathFeature,
+        ];
     }
     getActiveFeatures() {
         return this.features ?? this.getDefaultFeatures();
@@ -224,13 +256,11 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
         return this.doc === null && this.initialContent === null;
     }
     async initializeView() {
-        this.debugTestLog('initializeView invoked');
         if (this.view) {
             return;
         }
         const mountPoint = this.renderRoot.querySelector('.editor');
         if (!mountPoint) {
-            this.debugTestLog('initializeView: mount point missing');
             return;
         }
         const initialDoc = this.resolveInitialDoc();
@@ -263,11 +293,7 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
             this.editor = editor;
             editor.mount(mountPoint);
             this.view = editor.getView();
-            this.debugTestLog('editor mounted', { hasView: !!this.view });
-            const runner = editor.getCommands();
-            this.debugTestLog('command keys', runner ? Object.keys(runner.commands) : null);
             this.docUnsub = editor.onDoc((doc) => {
-                this.debugTestLog('dispatching editor-change', { ops: this.pendingOps.length });
                 const files = editor.getFiles();
                 this.dispatchEditorChange(doc, this.pendingOps, files);
                 this.pendingOps = [];
@@ -277,6 +303,7 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
                 this.dispatchSelectionChange(selection);
             });
             this.validationUnsub = editor.onValidation(() => undefined);
+            this.dispatchEditorChange(initialDoc.toJSON(), [], editor.getFiles());
             this.dispatchEditorReady();
             this.initialSelection = undefined;
         }
@@ -294,6 +321,9 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
         if (!update) {
             return;
         }
+        if (this.isNoopSyncUpdate(update)) {
+            return;
+        }
         this.pendingOps = [];
         this.pendingOpsFromTransform = false;
         this.editor.updateFromSync(update);
@@ -366,6 +396,46 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
         }
         return { doc: input };
     }
+    isNoopSyncUpdate(update) {
+        const editor = this.editor;
+        if (!editor) {
+            return false;
+        }
+        if (update.doc !== undefined && !this.deepEqualsJSON(update.doc, editor.getDoc())) {
+            return false;
+        }
+        if (update.selection !== undefined) {
+            const current = editor.getSelection();
+            if (!current) {
+                return false;
+            }
+            if (update.selection.anchor !== current.anchor || update.selection.head !== current.head) {
+                return false;
+            }
+        }
+        if (update.version !== undefined && update.version !== editor.getVersion()) {
+            return false;
+        }
+        if (update.files !== undefined && !this.deepEqualsJSON(update.files, editor.getFiles())) {
+            return false;
+        }
+        if (update.references !== undefined &&
+            !this.deepEqualsJSON(update.references, editor.getReferences())) {
+            return false;
+        }
+        return true;
+    }
+    deepEqualsJSON(left, right) {
+        if (left === right) {
+            return true;
+        }
+        try {
+            return JSON.stringify(left) === JSON.stringify(right);
+        }
+        catch {
+            return false;
+        }
+    }
     /**
      * Determine which document should be loaded on startup.
      * Preference order: externally supplied JSON, provided PM node, fallback.
@@ -482,7 +552,6 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
      * Applications can listen and update their stores or routing state.
      */
     dispatchEditorChange(doc, operations, files) {
-        this.debugTestLog('editor-change event', { doc, operations });
         this.dispatchEvent(new CustomEvent('editor-change', {
             detail: { doc, operations, files, references: this.editor?.getReferences() ?? [] },
             bubbles: true,
@@ -601,6 +670,10 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
         }
         this.shadowStyleElements = [];
         const cssTexts = this.normalizeShadowStyles(this.shadowStyles);
+        const widthCss = this.getEditorWidthStyles();
+        if (widthCss) {
+            cssTexts.push(widthCss);
+        }
         if (cssTexts.length === 0) {
             return;
         }
@@ -611,6 +684,15 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
             this.shadowStyleElements.push(styleEl);
         }
     }
+    getEditorWidthStyles() {
+        const isNarrow = this.editorWidth === 'narrow';
+        return `.ProseMirror {
+  font-size: 11pt;
+  max-width: ${isNarrow ? '52ch' : '82ch'};
+  margin-left: auto;
+  margin-right: auto;
+}`;
+    }
     normalizeShadowStyles(styles) {
         if (!styles) {
             return [];
@@ -648,14 +730,6 @@ let SciFlowEditorElement = class SciFlowEditorElement extends LitElement {
             return null;
         }
     }
-    debugTestLog(message, payload) {
-        const isDebug = (typeof process !== 'undefined' && process.env?.DEBUG_TESTS === 'true') ||
-            (typeof import.meta !== 'undefined' && import.meta.env?.DEBUG_TESTS === 'true');
-        if (!isDebug) {
-            return;
-        }
-        console.log('[sciflow-editor]', message, payload ?? '');
-    }
 };
 __decorate([
     property({ attribute: false })
@@ -675,6 +749,9 @@ __decorate([
 __decorate([
     property({ type: String })
 ], SciFlowEditorElement.prototype, "placeholder", void 0);
+__decorate([
+    property({ type: String })
+], SciFlowEditorElement.prototype, "editorWidth", void 0);
 SciFlowEditorElement = __decorate([
     customElement('sciflow-editor')
 ], SciFlowEditorElement);