@sciflow/editor-start 0.0.1-beta

package/dist/lib/reference-list.js

@@ -0,0 +1,160 @@
+/**
+ * @module reference-list
+ *
+ * Developer overview:
+ * --------------------
+ * `SciFlowReferenceListElement` renders a draggable, highlighted list of
+ * references. It replaces the bespoke demo sidebar logic so integrators can
+ * reuse the same markup and drag payloads in their own UIs.
+ */
+import { __decorate } from "tslib";
+import { css, html, LitElement, nothing, unsafeCSS } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { classMap } from 'lit/directives/class-map.js';
+import referenceListCss from './reference-list.css?inline';
+import { applyThemeStylesToRoot, subscribeToSciFlowTheme } from './theme.js';
+let SciFlowReferenceListElement = class SciFlowReferenceListElement extends LitElement {
+    constructor() {
+        super(...arguments);
+        /** References to render. */
+        this.references = null;
+        /** Reference IDs to highlight. */
+        this.highlightedIds = [];
+        /** Text displayed when no references are available. */
+        this.emptyText = 'No references yet.';
+        this.themeStyleElements = [];
+    }
+    static { this.styles = css `${unsafeCSS(referenceListCss)}`; }
+    connectedCallback() {
+        super.connectedCallback();
+        this.themeUnsub = subscribeToSciFlowTheme((cssTexts) => {
+            this.themeStyleElements = applyThemeStylesToRoot(this.renderRoot, this.themeStyleElements, cssTexts);
+        });
+    }
+    disconnectedCallback() {
+        this.themeUnsub?.();
+        this.themeUnsub = undefined;
+        super.disconnectedCallback();
+    }
+    /**
+     * Highlight the supplied reference ids.
+     *
+     * @param referenceIds IDs to highlight.
+     */
+    highlight(referenceIds = []) {
+        this.highlightedIds = Array.from(referenceIds)
+            .map((id) => (typeof id === 'string' ? id.trim() : ''))
+            .filter((id) => Boolean(id));
+    }
+    render() {
+        const references = Array.isArray(this.references) ? this.references : [];
+        const highlightSet = new Set((this.highlightedIds ?? []).map((id) => (typeof id === 'string' ? id.trim() : '')).filter(Boolean));
+        if (references.length === 0) {
+            return html `
+        <ol class="reference-list">
+          <li class="reference-item reference-empty">${this.emptyText}</li>
+        </ol>
+      `;
+        }
+        return html `
+      <ol class="reference-list">
+        ${references.map((reference) => {
+            const { displayText, id } = this.formatReference(reference);
+            const isHighlighted = id ? highlightSet.has(id) : false;
+            return html `
+            <li
+              class=${classMap({
+                'reference-item': true,
+                'reference-highlight': isHighlighted,
+            })}
+              data-reference-id=${id ?? ''}
+              draggable="true"
+              @dragstart=${(event) => this.handleDragStart(event, reference, displayText)}
+            >
+              <span class="reference-text">${displayText || nothing}</span>
+              <span class="reference-meta">
+                ${id
+                ? html `<code class="reference-id" aria-label=${`CSL id ${id}`}>${id}</code>`
+                : nothing}
+                <span class="reference-drag" aria-hidden="true">drag</span>
+              </span>
+            </li>
+          `;
+        })}
+      </ol>
+    `;
+    }
+    formatReference(reference) {
+        const id = typeof reference.id === 'string' ? reference.id : null;
+        const rawCitation = typeof reference.rawCitation === 'string'
+            ? reference.rawCitation
+            : typeof reference.raw_citation === 'string'
+                ? reference.raw_citation
+                : null;
+        if (rawCitation && rawCitation.trim()) {
+            return { id, displayText: rawCitation.trim() };
+        }
+        const authors = Array.isArray(reference.author) && reference.author.length > 0
+            ? reference.author
+                .map((entry) => this.formatAuthor(entry))
+                .filter((name) => Boolean(name))
+            : [];
+        const issued = reference.issued?.['date-parts']?.[0]?.[0] ?? null;
+        const parts = [
+            authors.join('; '),
+            reference.title ?? '',
+            issued ? `(${issued})` : '',
+            reference.publisher ?? reference['container-title'] ?? '',
+            reference['publisher-place'] ?? '',
+        ]
+            .map((value) => value?.toString().trim())
+            .filter(Boolean);
+        return { id, displayText: parts.join('. ') };
+    }
+    formatAuthor(entry) {
+        if (!entry) {
+            return null;
+        }
+        const family = entry.family ?? '';
+        const given = entry.given ? `, ${entry.given}` : '';
+        const name = `${family}${given}`.trim();
+        return name || null;
+    }
+    handleDragStart(event, reference, displayText) {
+        const transfer = event.dataTransfer;
+        if (!transfer) {
+            return;
+        }
+        transfer.setData('application/x-sciflow-reference', 'sidebar');
+        transfer.effectAllowed = 'copy';
+        const payload = {
+            type: 'reference',
+            id: reference.id ?? null,
+            text: displayText,
+            reference,
+        };
+        try {
+            transfer.setData('application/json', JSON.stringify(payload));
+        }
+        catch {
+            // Ignore JSON serialization errors.
+        }
+        const dropText = reference.id ? `[${reference.id}]` : displayText || '';
+        if (dropText) {
+            transfer.setData('text/plain', dropText);
+        }
+    }
+};
+__decorate([
+    property({ attribute: false })
+], SciFlowReferenceListElement.prototype, "references", void 0);
+__decorate([
+    property({ attribute: false })
+], SciFlowReferenceListElement.prototype, "highlightedIds", void 0);
+__decorate([
+    property({ type: String, attribute: 'empty-text' })
+], SciFlowReferenceListElement.prototype, "emptyText", void 0);
+SciFlowReferenceListElement = __decorate([
+    customElement('sciflow-reference-list')
+], SciFlowReferenceListElement);
+export { SciFlowReferenceListElement };

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

@@ -0,0 +1,94 @@
+/**
+ * @module selection-editor
+ *
+ * Developer overview:
+ * --------------------
+ * `SciFlowSelectionEditorElement` is a companion component for `sciflow-editor`
+ * that displays and allows editing of the currently selected element's attributes.
+ *
+ * It demonstrates how to:
+ * - Listen to editor selection changes
+ * - Extract node information from the document
+ * - Use the command API to update node attributes
+ * - Build reactive UI that stays in sync with editor state
+ */
+import { LitElement } from 'lit';
+import type { SciFlowEditorElement } from './editor-element.js';
+import { type CitationSourceEditorAdapter } from './citation-source-adapter.js';
+/**
+ * Custom element that displays and edits the selected element's attributes.
+ *
+ * Responsibilities:
+ * - Resolve the nearest `sciflow-editor` instance (or accept one via property)
+ * - Listen to selection changes and extract node information
+ * - Display node type, ID, and attributes
+ * - Allow editing of attributes through the command API
+ */
+export declare class SciFlowSelectionEditorElement extends LitElement {
+    /** Reference to the editor element. May be passed directly via property binding. */
+    editor: SciFlowEditorElement | null;
+    /** ID reference to resolve an editor instance declaratively. */
+    for?: string;
+    /** Custom adapter for editing citation source. When unset, uses the global adapter. */
+    citationSourceAdapter: CitationSourceEditorAdapter | null;
+    private elementInfo;
+    private resolvedEditor;
+    private selectionListener?;
+    private readyListener?;
+    private themeUnsub?;
+    private themeStyleElements;
+    private citationSourceContainer;
+    static styles: import("lit").CSSResult;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    updated(changedProperties: Map<string | number | symbol, unknown>): void;
+    protected render(): import("lit-html").TemplateResult<1>;
+    /**
+     * Find the target editor element and attach listeners for selection changes.
+     */
+    private resolveEditorReference;
+    private resolveEditor;
+    /** Clean up listeners attached to the last editor instance. */
+    private detachEditorListeners;
+    /**
+     * Extract element information from the current selection.
+     */
+    private updateElementInfo;
+    /** Convenience getter mirroring `editor.getCommands()`. */
+    private getCommandRunner;
+    /**
+     * Render a single attribute field, decoding known encoded values for readability.
+     */
+    private renderAttributeField;
+    /**
+     * Decode known encoded attributes for more readable display/editing.
+     */
+    private decodeSpecialAttribute;
+    /**
+     * Mount the citation source adapter UI when a citation node is selected.
+     */
+    private mountCitationSourceAdapter;
+    /**
+     * Unmount the citation source adapter and clean up.
+     */
+    private unmountCitationSourceAdapter;
+    /**
+     * Handle attribute field changes.
+     */
+    private handleAttrChange;
+    /**
+     * Update node attributes using the command API.
+     * Preserves the 'data' attribute if it exists, even though it's not displayed.
+     */
+    private updateNodeAttribute;
+    /**
+     * Encode a source string/JSON into the URI-encoded source field format.
+     */
+    private encodeSourceField;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'sciflow-selection-editor': SciFlowSelectionEditorElement;
+    }
+}
+//# sourceMappingURL=selection-editor.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"selection-editor.d.ts","sourceRoot":"","sources":["../../src/lib/selection-editor.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH,OAAO,EAAa,UAAU,EAAa,MAAM,KAAK,CAAC;AAMvD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAChE,OAAO,EAEL,KAAK,2BAA2B,EAEjC,MAAM,8BAA8B,CAAC;AAWtC;;;;;;;;GAQG;AACH,qBACa,6BAA8B,SAAQ,UAAU;IAC3D,oFAAoF;IAEpF,MAAM,EAAE,oBAAoB,GAAG,IAAI,CAAQ;IAE3C,gEAAgE;IAEhE,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb,uFAAuF;IAEvF,qBAAqB,EAAE,2BAA2B,GAAG,IAAI,CAAQ;IAGjE,OAAO,CAAC,WAAW,CAAqB;IAExC,OAAO,CAAC,cAAc,CAAqC;IAC3D,OAAO,CAAC,iBAAiB,CAAC,CAAgB;IAC1C,OAAO,CAAC,aAAa,CAAC,CAAgB;IACtC,OAAO,CAAC,UAAU,CAAC,CAAa;IAChC,OAAO,CAAC,kBAAkB,CAA0B;IACpD,OAAO,CAAC,uBAAuB,CAA4B;IAE3D,OAAgB,MAAM,0BAAyC;IAEtD,iBAAiB,IAAI,IAAI;IAYzB,oBAAoB,IAAI,IAAI;IAO5B,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;cA+B9D,MAAM;IAyEzB;;OAEG;IACH,OAAO,CAAC,sBAAsB;IA2C9B,OAAO,CAAC,aAAa;IAmBrB,+DAA+D;IAC/D,OAAO,CAAC,qBAAqB;IAc7B;;OAEG;IACH,OAAO,CAAC,iBAAiB;IA0DzB,2DAA2D;IAC3D,OAAO,CAAC,gBAAgB;IAIxB;;OAEG;IACH,OAAO,CAAC,oBAAoB;IAwB5B;;OAEG;IACH,OAAO,CAAC,sBAAsB;IAiB9B;;OAEG;IACH,OAAO,CAAC,0BAA0B;IAuBlC;;OAEG;IACH,OAAO,CAAC,4BAA4B;IASpC;;OAEG;IACH,OAAO,CAAC,gBAAgB;IAuBxB;;;OAGG;IACH,OAAO,CAAC,mBAAmB;IA2C3B;;OAEG;IACH,OAAO,CAAC,iBAAiB;CAmB1B;AAGD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,0BAA0B,EAAE,6BAA6B,CAAC;KAC3D;CACF"}