@nocturnium/svelte-ide 1.0.0-rc.1

package/dist/components/editor/core/timeline.d.ts

@@ -0,0 +1,204 @@
+/**
+ * Timeline Manager
+ *
+ * Manages document history snapshots for Time Machine Scrubbing.
+ * Captures snapshots at regular intervals and on significant events,
+ * allowing users to scrub through document history.
+ */
+/**
+ * Snapshot metadata
+ */
+export interface SnapshotMetadata {
+    /** Author ID */
+    author: string;
+    /** Author display color */
+    authorColor: string;
+    /** Whether this was an AI change */
+    isAI: boolean;
+    /** Description of the change */
+    description?: string;
+    /** Git commit hash if applicable */
+    commitHash?: string;
+    /** Type of change */
+    changeType: 'edit' | 'ai-suggestion' | 'commit' | 'checkpoint' | 'save';
+}
+/**
+ * A snapshot of document state at a point in time
+ */
+export interface TimelineSnapshot {
+    /** Unique snapshot ID */
+    id: string;
+    /** Timestamp when captured */
+    timestamp: number;
+    /** Document content */
+    content: string;
+    /** Snapshot metadata */
+    metadata: SnapshotMetadata;
+    /** Line count at this snapshot */
+    lineCount: number;
+    /** Diff from previous snapshot */
+    diffFromPrevious?: {
+        addedLines: number;
+        removedLines: number;
+        changedRegions: Array<{
+            start: number;
+            end: number;
+        }>;
+    };
+}
+/**
+ * Timeline state
+ */
+export interface TimelineState {
+    /** All snapshots */
+    snapshots: TimelineSnapshot[];
+    /** Current playback position (0-1, where 1 is live) */
+    position: number;
+    /** Whether in playback mode */
+    isPlayback: boolean;
+    /** Playback speed multiplier */
+    playbackSpeed: number;
+    /** Whether auto-playing */
+    isPlaying: boolean;
+}
+/**
+ * Timeline event types
+ */
+export type TimelineEvent = {
+    type: 'snapshot-added';
+    snapshot: TimelineSnapshot;
+} | {
+    type: 'position-changed';
+    position: number;
+} | {
+    type: 'playback-started';
+} | {
+    type: 'playback-stopped';
+};
+/**
+ * Timeline configuration
+ */
+export interface TimelineConfig {
+    /** Interval between auto-snapshots in ms (default: 30000) */
+    snapshotInterval: number;
+    /** Maximum number of snapshots to keep (default: 500) */
+    maxSnapshots: number;
+    /** Minimum lines changed to trigger snapshot (default: 5) */
+    minLinesForSnapshot: number;
+    /** Default author info */
+    defaultAuthor: {
+        id: string;
+        name: string;
+        color: string;
+    };
+}
+/**
+ * Timeline Manager class
+ */
+export declare class TimelineManager {
+    private snapshots;
+    private listeners;
+    private config;
+    private snapshotTimer;
+    private lastContent;
+    private lastSnapshotTime;
+    constructor(config?: Partial<TimelineConfig>);
+    /**
+     * Start auto-snapshot timer
+     */
+    start(initialContent: string): void;
+    /**
+     * Stop auto-snapshot timer
+     */
+    stop(): void;
+    /**
+     * Record content change (for tracking changes between snapshots)
+     */
+    recordChange(content: string): void;
+    /**
+     * Capture a snapshot
+     */
+    captureSnapshot(content: string, metadata: SnapshotMetadata): TimelineSnapshot;
+    /**
+     * Capture snapshot on significant edit
+     */
+    captureOnEdit(content: string, author?: Partial<SnapshotMetadata>): void;
+    /**
+     * Capture snapshot for AI suggestion
+     */
+    captureAISuggestion(content: string, description: string): void;
+    /**
+     * Capture snapshot on save
+     */
+    captureOnSave(content: string): void;
+    /**
+     * Get all snapshots
+     */
+    getSnapshots(): readonly TimelineSnapshot[];
+    /**
+     * Get snapshot at normalized position (0-1)
+     */
+    getSnapshotAtPosition(position: number): TimelineSnapshot | null;
+    /**
+     * Get content at normalized position
+     */
+    getContentAtPosition(position: number): string | null;
+    /**
+     * Get snapshot by ID
+     */
+    getSnapshotById(id: string): TimelineSnapshot | undefined;
+    /**
+     * Get timeline duration in ms
+     */
+    getDuration(): number;
+    /**
+     * Get position for a timestamp
+     */
+    getPositionForTimestamp(timestamp: number): number;
+    /**
+     * Get markers for timeline UI
+     */
+    getMarkers(): Array<{
+        position: number;
+        color: string;
+        type: SnapshotMetadata['changeType'];
+        label: string;
+        timestamp: number;
+    }>;
+    /**
+     * Subscribe to timeline events
+     */
+    subscribe(listener: (event: TimelineEvent) => void): () => void;
+    /**
+     * Clear all snapshots
+     */
+    clear(): void;
+    /**
+     * Calculate diff between two content strings
+     */
+    private calculateDiff;
+    /**
+     * Prune old snapshots to stay within limit
+     */
+    private pruneSnapshots;
+    /**
+     * Emit event to listeners
+     */
+    private emit;
+}
+/**
+ * Create a timeline manager instance
+ */
+export declare function createTimelineManager(config?: Partial<TimelineConfig>): TimelineManager;
+/**
+ * Get the global timeline manager
+ */
+export declare function getTimelineManager(): TimelineManager;
+/**
+ * Format timestamp for display
+ */
+export declare function formatTimestamp(timestamp: number): string;
+/**
+ * Format duration for display
+ */
+export declare function formatDuration(ms: number): string;

package/dist/components/editor/core/timeline.js

@@ -0,0 +1,349 @@
+/**
+ * Timeline Manager
+ *
+ * Manages document history snapshots for Time Machine Scrubbing.
+ * Captures snapshots at regular intervals and on significant events,
+ * allowing users to scrub through document history.
+ */
+const DEFAULT_CONFIG = {
+    snapshotInterval: 30000,
+    maxSnapshots: 500,
+    minLinesForSnapshot: 5,
+    defaultAuthor: {
+        id: 'local',
+        name: 'You',
+        color: '#4a9eff'
+    }
+};
+/**
+ * Timeline Manager class
+ */
+export class TimelineManager {
+    snapshots = [];
+    listeners = new Set();
+    config;
+    snapshotTimer = null;
+    lastContent = '';
+    lastSnapshotTime = 0;
+    constructor(config = {}) {
+        this.config = { ...DEFAULT_CONFIG, ...config };
+    }
+    /**
+     * Start auto-snapshot timer
+     */
+    start(initialContent) {
+        this.lastContent = initialContent;
+        this.lastSnapshotTime = Date.now();
+        // Capture initial snapshot
+        this.captureSnapshot(initialContent, {
+            author: this.config.defaultAuthor.id,
+            authorColor: this.config.defaultAuthor.color,
+            isAI: false,
+            description: 'Initial state',
+            changeType: 'checkpoint'
+        });
+        // Start auto-snapshot timer
+        this.snapshotTimer = setInterval(() => {
+            if (this.lastContent) {
+                this.captureSnapshot(this.lastContent, {
+                    author: this.config.defaultAuthor.id,
+                    authorColor: this.config.defaultAuthor.color,
+                    isAI: false,
+                    description: 'Auto-checkpoint',
+                    changeType: 'checkpoint'
+                });
+            }
+        }, this.config.snapshotInterval);
+    }
+    /**
+     * Stop auto-snapshot timer
+     */
+    stop() {
+        if (this.snapshotTimer) {
+            clearInterval(this.snapshotTimer);
+            this.snapshotTimer = null;
+        }
+    }
+    /**
+     * Record content change (for tracking changes between snapshots)
+     */
+    recordChange(content) {
+        this.lastContent = content;
+    }
+    /**
+     * Capture a snapshot
+     */
+    captureSnapshot(content, metadata) {
+        const now = Date.now();
+        const lineCount = content.split('\n').length;
+        // Calculate diff from previous
+        let diffFromPrevious;
+        if (this.snapshots.length > 0) {
+            const prevSnapshot = this.snapshots[this.snapshots.length - 1];
+            diffFromPrevious = this.calculateDiff(prevSnapshot.content, content);
+        }
+        const snapshot = {
+            id: `snapshot-${now}-${Math.random().toString(36).substr(2, 9)}`,
+            timestamp: now,
+            content,
+            metadata,
+            lineCount,
+            diffFromPrevious
+        };
+        this.snapshots.push(snapshot);
+        this.lastSnapshotTime = now;
+        this.lastContent = content;
+        // Prune old snapshots if needed
+        this.pruneSnapshots();
+        // Notify listeners
+        this.emit({ type: 'snapshot-added', snapshot });
+        return snapshot;
+    }
+    /**
+     * Capture snapshot on significant edit
+     */
+    captureOnEdit(content, author) {
+        const lineCount = content.split('\n').length;
+        const lastLineCount = this.snapshots.length > 0
+            ? this.snapshots[this.snapshots.length - 1].lineCount
+            : 0;
+        const linesDiff = Math.abs(lineCount - lastLineCount);
+        const timeSinceLastSnapshot = Date.now() - this.lastSnapshotTime;
+        // Capture if significant change or enough time passed
+        if (linesDiff >= this.config.minLinesForSnapshot || timeSinceLastSnapshot > 10000) {
+            this.captureSnapshot(content, {
+                author: author?.author ?? this.config.defaultAuthor.id,
+                authorColor: author?.authorColor ?? this.config.defaultAuthor.color,
+                isAI: author?.isAI ?? false,
+                description: author?.description ?? 'Edit',
+                changeType: author?.changeType ?? 'edit'
+            });
+        }
+    }
+    /**
+     * Capture snapshot for AI suggestion
+     */
+    captureAISuggestion(content, description) {
+        this.captureSnapshot(content, {
+            author: 'ai-assistant',
+            authorColor: '#a855f7',
+            isAI: true,
+            description,
+            changeType: 'ai-suggestion'
+        });
+    }
+    /**
+     * Capture snapshot on save
+     */
+    captureOnSave(content) {
+        this.captureSnapshot(content, {
+            author: this.config.defaultAuthor.id,
+            authorColor: this.config.defaultAuthor.color,
+            isAI: false,
+            description: 'Saved',
+            changeType: 'save'
+        });
+    }
+    /**
+     * Get all snapshots
+     */
+    getSnapshots() {
+        return this.snapshots;
+    }
+    /**
+     * Get snapshot at normalized position (0-1)
+     */
+    getSnapshotAtPosition(position) {
+        if (this.snapshots.length === 0)
+            return null;
+        if (position >= 1)
+            return this.snapshots[this.snapshots.length - 1];
+        if (position <= 0)
+            return this.snapshots[0];
+        const index = Math.floor(position * (this.snapshots.length - 1));
+        return this.snapshots[index];
+    }
+    /**
+     * Get content at normalized position
+     */
+    getContentAtPosition(position) {
+        const snapshot = this.getSnapshotAtPosition(position);
+        return snapshot?.content ?? null;
+    }
+    /**
+     * Get snapshot by ID
+     */
+    getSnapshotById(id) {
+        return this.snapshots.find((s) => s.id === id);
+    }
+    /**
+     * Get timeline duration in ms
+     */
+    getDuration() {
+        if (this.snapshots.length < 2)
+            return 0;
+        return this.snapshots[this.snapshots.length - 1].timestamp - this.snapshots[0].timestamp;
+    }
+    /**
+     * Get position for a timestamp
+     */
+    getPositionForTimestamp(timestamp) {
+        if (this.snapshots.length < 2)
+            return 1;
+        const start = this.snapshots[0].timestamp;
+        const end = this.snapshots[this.snapshots.length - 1].timestamp;
+        const duration = end - start;
+        if (duration === 0)
+            return 1;
+        return Math.max(0, Math.min(1, (timestamp - start) / duration));
+    }
+    /**
+     * Get markers for timeline UI
+     */
+    getMarkers() {
+        if (this.snapshots.length === 0)
+            return [];
+        const start = this.snapshots[0].timestamp;
+        const duration = this.getDuration() || 1;
+        return this.snapshots.map((snapshot) => ({
+            position: (snapshot.timestamp - start) / duration,
+            color: snapshot.metadata.authorColor,
+            type: snapshot.metadata.changeType,
+            label: snapshot.metadata.description || snapshot.metadata.changeType,
+            timestamp: snapshot.timestamp
+        }));
+    }
+    /**
+     * Subscribe to timeline events
+     */
+    subscribe(listener) {
+        this.listeners.add(listener);
+        return () => this.listeners.delete(listener);
+    }
+    /**
+     * Clear all snapshots
+     */
+    clear() {
+        this.snapshots = [];
+        this.lastContent = '';
+        this.lastSnapshotTime = 0;
+    }
+    /**
+     * Calculate diff between two content strings
+     */
+    calculateDiff(oldContent, newContent) {
+        const oldLines = oldContent.split('\n');
+        const newLines = newContent.split('\n');
+        let addedLines = 0;
+        let removedLines = 0;
+        const changedRegions = [];
+        // Simple line-by-line comparison
+        const maxLen = Math.max(oldLines.length, newLines.length);
+        let regionStart = -1;
+        for (let i = 0; i < maxLen; i++) {
+            const oldLine = oldLines[i] ?? '';
+            const newLine = newLines[i] ?? '';
+            if (oldLine !== newLine) {
+                if (regionStart === -1)
+                    regionStart = i;
+                if (i >= oldLines.length)
+                    addedLines++;
+                else if (i >= newLines.length)
+                    removedLines++;
+                else {
+                    // Changed line counts as both add and remove
+                    addedLines++;
+                    removedLines++;
+                }
+            }
+            else if (regionStart !== -1) {
+                changedRegions.push({ start: regionStart, end: i - 1 });
+                regionStart = -1;
+            }
+        }
+        if (regionStart !== -1) {
+            changedRegions.push({ start: regionStart, end: maxLen - 1 });
+        }
+        return { addedLines, removedLines, changedRegions };
+    }
+    /**
+     * Prune old snapshots to stay within limit
+     */
+    pruneSnapshots() {
+        if (this.snapshots.length <= this.config.maxSnapshots)
+            return;
+        // Keep first, last, and evenly distributed middle snapshots
+        const toRemove = this.snapshots.length - this.config.maxSnapshots;
+        // Remove oldest non-significant snapshots (keep checkpoints, saves, commits)
+        const significantTypes = ['commit', 'save', 'checkpoint'];
+        for (let i = 1; i < this.snapshots.length - 1 && toRemove > 0; i++) {
+            if (!significantTypes.includes(this.snapshots[i].metadata.changeType)) {
+                this.snapshots.splice(i, 1);
+                i--;
+            }
+        }
+    }
+    /**
+     * Emit event to listeners
+     */
+    emit(event) {
+        for (const listener of this.listeners) {
+            try {
+                listener(event);
+            }
+            catch (e) {
+                console.error('[TimelineManager] Listener error:', e);
+            }
+        }
+    }
+}
+/**
+ * Create a timeline manager instance
+ */
+export function createTimelineManager(config) {
+    return new TimelineManager(config);
+}
+// Singleton instance
+let globalTimelineManager = null;
+/**
+ * Get the global timeline manager
+ */
+export function getTimelineManager() {
+    if (!globalTimelineManager) {
+        globalTimelineManager = createTimelineManager();
+    }
+    return globalTimelineManager;
+}
+/**
+ * Format timestamp for display
+ */
+export function formatTimestamp(timestamp) {
+    const date = new Date(timestamp);
+    const now = new Date();
+    // Same day - show time only
+    if (date.toDateString() === now.toDateString()) {
+        return date.toLocaleTimeString(undefined, { hour: '2-digit', minute: '2-digit' });
+    }
+    // Different day - show date and time
+    return date.toLocaleString(undefined, {
+        month: 'short',
+        day: 'numeric',
+        hour: '2-digit',
+        minute: '2-digit'
+    });
+}
+/**
+ * Format duration for display
+ */
+export function formatDuration(ms) {
+    const seconds = Math.floor(ms / 1000);
+    const minutes = Math.floor(seconds / 60);
+    const hours = Math.floor(minutes / 60);
+    if (hours > 0) {
+        return `${hours}h ${minutes % 60}m`;
+    }
+    if (minutes > 0) {
+        return `${minutes}m ${seconds % 60}s`;
+    }
+    return `${seconds}s`;
+}

package/dist/components/editor/editor-find.d.ts

@@ -0,0 +1,56 @@
+/**
+ * Editor find/replace logic extracted from CustomEditor.svelte
+ *
+ * Factory function that creates all find/replace state and operations,
+ * accepting callbacks for things it cannot own (editor state access, DOM operations).
+ */
+import { type SearchMatch, type Position, type Selection } from './core';
+export interface EditorFindDeps {
+    getLines: () => readonly {
+        text: string;
+    }[];
+    getLineCount: () => number;
+    getSelection: () => Selection;
+    setSelection: (anchor: Position, head: Position) => void;
+    setCursor: (pos: Position) => void;
+    setContent: (content: string) => void;
+    scrollCursorIntoView: () => void;
+    focusEditor: () => void;
+    isReadonly: () => boolean;
+}
+export interface MatchRect {
+    top: number;
+    left: number;
+    width: number;
+    height: number;
+    isCurrent: boolean;
+}
+export interface ViewportInfo {
+    scrollTop: number;
+    viewportHeight: number;
+}
+export interface MeasurementInfo {
+    lineHeight: number;
+    charWidth: number;
+    gutterWidth: number;
+    contentPadding: number;
+}
+export declare function createEditorFind(deps: EditorFindDeps): {
+    readonly query: string;
+    readonly replaceText: string;
+    readonly caseSensitive: boolean;
+    readonly useRegex: boolean;
+    readonly matches: SearchMatch[];
+    readonly currentIndex: number;
+    setQuery: (q: string) => void;
+    setReplaceText: (text: string) => void;
+    setCaseSensitive: (value: boolean) => void;
+    setUseRegex: (value: boolean) => void;
+    updateMatches: () => void;
+    findNext: () => void;
+    findPrev: () => void;
+    replace: () => void;
+    replaceAll: () => void;
+    computeMatchRects: (viewport: ViewportInfo, measurements: MeasurementInfo) => MatchRect[];
+};
+export type EditorFind = ReturnType<typeof createEditorFind>;