@pyreon/code 0.6.0 → 0.7.0

package/lib/types/index.d.ts

@@ -1,852 +1,347 @@
-import { bracketMatching, defaultHighlightStyle, foldGutter, foldKeymap, indentOnInput, indentUnit, syntaxHighlighting } from "@codemirror/language";
-import { MergeView } from "@codemirror/merge";
-import { Compartment, EditorState } from "@codemirror/state";
-import { Decoration, EditorView, GutterMarker, ViewPlugin, crosshairCursor, drawSelection, dropCursor, gutter, highlightActiveLine, highlightActiveLineGutter, keymap, lineNumbers, placeholder, rectangularSelection } from "@codemirror/view";
-import { autocompletion, closeBrackets, closeBracketsKeymap, completionKeymap } from "@codemirror/autocomplete";
-import { defaultKeymap, history, historyKeymap, indentWithTab, redo, undo } from "@codemirror/commands";
-import { lintKeymap, setDiagnostics } from "@codemirror/lint";
-import { highlightSelectionMatches, searchKeymap } from "@codemirror/search";
-import { computed, effect, signal } from "@pyreon/reactivity";
+import { VNodeChild } from "@pyreon/core";
+import { Extension } from "@codemirror/state";
+import { EditorView } from "@codemirror/view";
+import { Computed, Signal } from "@pyreon/reactivity";
 
-//#region \0rolldown/runtime.js
-
-function h(type, props, ...children) {
-  return {
-    type,
-    props: props ?? EMPTY_PROPS,
-    children: normalizeChildren(children),
-    key: props?.key ?? null
-  };
+//#region src/types.d.ts
+type EditorLanguage = 'javascript' | 'typescript' | 'jsx' | 'tsx' | 'html' | 'css' | 'json' | 'markdown' | 'python' | 'rust' | 'sql' | 'xml' | 'yaml' | 'cpp' | 'java' | 'go' | 'php' | 'ruby' | 'shell' | 'plain';
+type EditorTheme = 'light' | 'dark' | Extension;
+interface EditorConfig {
+  /** Initial value */
+  value?: string;
+  /** Language for syntax highlighting — lazy-loaded */
+  language?: EditorLanguage;
+  /** Theme — 'light', 'dark', or a custom CodeMirror theme extension */
+  theme?: EditorTheme;
+  /** Show line numbers — default: true */
+  lineNumbers?: boolean;
+  /** Read-only mode — default: false */
+  readOnly?: boolean;
+  /** Enable code folding — default: true */
+  foldGutter?: boolean;
+  /** Enable bracket matching — default: true */
+  bracketMatching?: boolean;
+  /** Enable autocomplete — default: true */
+  autocomplete?: boolean;
+  /** Enable search (Cmd+F) — default: true */
+  search?: boolean;
+  /** Enable lint/diagnostics — default: false */
+  lint?: boolean;
+  /** Enable indent guides — default: true */
+  highlightIndentGuides?: boolean;
+  /** Vim keybinding mode — default: false */
+  vim?: boolean;
+  /** Emacs keybinding mode — default: false */
+  emacs?: boolean;
+  /** Tab size — default: 2 */
+  tabSize?: number;
+  /** Enable indent guides — default: true */
+  indentGuides?: boolean;
+  /** Enable line wrapping — default: false */
+  lineWrapping?: boolean;
+  /** Placeholder text when empty */
+  placeholder?: string;
+  /** Enable minimap — default: false */
+  minimap?: boolean;
+  /** Additional CodeMirror extensions */
+  extensions?: Extension[];
+  /** Called when value changes */
+  onChange?: (value: string) => void;
 }
-function normalizeChildren(children) {
-  for (let i = 0; i < children.length; i++) if (Array.isArray(children[i])) return flattenChildren(children);
-  return children;
+interface EditorInstance {
+  /** Current editor value — reactive signal */
+  value: Signal<string>;
+  /** Current language — reactive signal */
+  language: Signal<EditorLanguage>;
+  /** Current theme — reactive signal */
+  theme: Signal<EditorTheme>;
+  /** Read-only state — reactive signal */
+  readOnly: Signal<boolean>;
+  /** Cursor position — reactive */
+  cursor: Computed<{
+    line: number;
+    col: number;
+  }>;
+  /** Current selection — reactive */
+  selection: Computed<{
+    from: number;
+    to: number;
+    text: string;
+  }>;
+  /** Line count — reactive */
+  lineCount: Computed<number>;
+  /** Whether the editor has focus — reactive */
+  focused: Signal<boolean>;
+  /** The underlying CodeMirror EditorView — null until mounted */
+  view: Signal<EditorView | null>;
+  /** Focus the editor */
+  focus: () => void;
+  /** Insert text at cursor */
+  insert: (text: string) => void;
+  /** Replace selection */
+  replaceSelection: (text: string) => void;
+  /** Select a range */
+  select: (from: number, to: number) => void;
+  /** Select all */
+  selectAll: () => void;
+  /** Go to a specific line */
+  goToLine: (line: number) => void;
+  /** Undo */
+  undo: () => void;
+  /** Redo */
+  redo: () => void;
+  /** Fold all */
+  foldAll: () => void;
+  /** Unfold all */
+  unfoldAll: () => void;
+  /** Set diagnostics (lint errors/warnings) */
+  setDiagnostics: (diagnostics: Diagnostic[]) => void;
+  /** Clear all diagnostics */
+  clearDiagnostics: () => void;
+  /** Highlight a specific line (e.g., error line, current execution) */
+  highlightLine: (line: number, className: string) => void;
+  /** Clear all line highlights */
+  clearLineHighlights: () => void;
+  /** Set gutter markers (breakpoints, error icons) */
+  setGutterMarker: (line: number, marker: GutterMarker) => void;
+  /** Clear all gutter markers */
+  clearGutterMarkers: () => void;
+  /** Add a custom keybinding */
+  addKeybinding: (key: string, handler: () => boolean | undefined) => void;
+  /** Get the text of a specific line */
+  getLine: (line: number) => string;
+  /** Get word at cursor position */
+  getWordAtCursor: () => string;
+  /** Scroll to a specific position */
+  scrollTo: (pos: number) => void;
+  /** The editor configuration */
+  config: EditorConfig;
+  /** Dispose — clean up view and listeners */
+  dispose: () => void;
 }
-function flattenChildren(children) {
-  const result = [];
-  for (const child of children) if (Array.isArray(child)) result.push(...flattenChildren(child));else result.push(child);
-  return result;
+interface Diagnostic {
+  /** Start position (character offset) */
+  from: number;
+  /** End position (character offset) */
+  to: number;
+  /** Severity */
+  severity: 'error' | 'warning' | 'info' | 'hint';
+  /** Message */
+  message: string;
+  /** Optional source (e.g., "typescript", "eslint") */
+  source?: string;
 }
-/**
-* JSX automatic runtime.
-*
-* When tsconfig has `"jsxImportSource": "@pyreon/core"`, the TS/bundler compiler
-* rewrites JSX to imports from this file automatically:
-*   <div class="x" />  →  jsx("div", { class: "x" })
-*/
-function jsx(type, props, key) {
-  const {
-    children,
-    ...rest
-  } = props;
-  const propsWithKey = key != null ? {
-    ...rest,
-    key
-  } : rest;
-  if (typeof type === "function") return h(type, children !== void 0 ? {
-    ...propsWithKey,
-    children
-  } : propsWithKey);
-  return h(type, propsWithKey, ...(children === void 0 ? [] : Array.isArray(children) ? children : [children]));
+interface GutterMarker {
+  /** CSS class for the marker element */
+  class?: string;
+  /** Text content (e.g., emoji or icon) */
+  text?: string;
+  /** Tooltip on hover */
+  title?: string;
 }
-//#endregion
-//#region src/components/code-editor.tsx
-/**
-* Code editor component — mounts a CodeMirror 6 instance.
-*
-* @example
-* ```tsx
-* const editor = createEditor({
-*   value: 'const x = 1',
-*   language: 'typescript',
-*   theme: 'dark',
-* })
-*
-* <CodeEditor instance={editor} style="height: 400px" />
-* ```
-*/
-function CodeEditor(props) {
-  const {
-    instance
-  } = props;
-  const containerRef = el => {
-    if (!el) return;
-    const mountable = instance;
-    if (mountable._mount) mountable._mount(el);
-  };
-  const baseStyle = `width: 100%; height: 100%; overflow: hidden; ${props.style ?? ""}`;
-  return /* @__PURE__ */jsx("div", {
-    ref: containerRef,
-    class: `pyreon-code-editor ${props.class ?? ""}`,
-    style: baseStyle
-  });
+interface CodeEditorProps {
+  instance: EditorInstance;
+  style?: string;
+  class?: string;
 }
-
-//#endregion
-//#region src/languages.ts
-/**
-* Language extension loaders — lazy-loaded on demand.
-* Only the requested language is imported, keeping the initial bundle small.
-*/
-
-/**
-* Load a language extension. Returns cached if already loaded.
-* Language grammars are lazy-imported — zero cost until used.
-*
-* @example
-* ```ts
-* const ext = await loadLanguage('typescript')
-* ```
-*/
-async function loadLanguage(language) {
-  const cached = loaded.get(language);
-  if (cached) return cached;
-  const loader = languageLoaders[language];
-  if (!loader) return [];
-  try {
-    const ext = await loader();
-    loaded.set(language, ext);
-    return ext;
-  } catch {
-    return [];
-  }
+interface DiffEditorProps {
+  /** Original (left) content */
+  original: string | Signal<string>;
+  /** Modified (right) content */
+  modified: string | Signal<string>;
+  /** Language for both panels */
+  language?: EditorLanguage;
+  /** Theme */
+  theme?: EditorTheme;
+  /** Show inline diff instead of side-by-side — default: false */
+  inline?: boolean;
+  /** Read-only — default: true */
+  readOnly?: boolean;
+  style?: string;
+  class?: string;
 }
-/**
-* Get available languages.
-*/
-function getAvailableLanguages() {
-  return Object.keys(languageLoaders);
+interface Tab {
+  /** Unique tab identifier — defaults to name */
+  id?: string;
+  /** File name displayed in the tab */
+  name: string;
+  /** Language for syntax highlighting */
+  language?: EditorLanguage;
+  /** File content */
+  value: string;
+  /** Whether the tab has unsaved changes */
+  modified?: boolean;
+  /** Whether the tab can be closed — default: true */
+  closable?: boolean;
+}
+interface TabbedEditorConfig {
+  /** Initial tabs */
+  tabs?: Tab[];
+  /** Theme — 'light', 'dark', or custom */
+  theme?: EditorTheme;
+  /** Editor config applied to all tabs */
+  editorConfig?: Omit<EditorConfig, 'value' | 'language' | 'theme'>;
+}
+interface TabbedEditorInstance {
+  /** The underlying editor instance */
+  editor: EditorInstance;
+  /** All open tabs — reactive */
+  tabs: Signal<Tab[]>;
+  /** Active tab — reactive */
+  activeTab: Computed<Tab | null>;
+  /** Active tab ID — reactive */
+  activeTabId: Signal<string>;
+  /** Open a new tab (or switch to it if already open) */
+  openTab: (tab: Tab) => void;
+  /** Close a tab by ID */
+  closeTab: (id: string) => void;
+  /** Switch to a tab by ID */
+  switchTab: (id: string) => void;
+  /** Rename a tab */
+  renameTab: (id: string, name: string) => void;
+  /** Mark a tab as modified/saved */
+  setModified: (id: string, modified: boolean) => void;
+  /** Reorder tabs */
+  moveTab: (fromIndex: number, toIndex: number) => void;
+  /** Get tab by ID */
+  getTab: (id: string) => Tab | undefined;
+  /** Close all tabs */
+  closeAll: () => void;
+  /** Close all tabs except the given one */
+  closeOthers: (id: string) => void;
+  /** Dispose */
+  dispose: () => void;
+}
+interface TabbedEditorProps {
+  instance: TabbedEditorInstance;
+  style?: string;
+  class?: string;
 }
-
 //#endregion
-//#region src/themes.ts
+//#region src/components/code-editor.d.ts
 /**
-* Light theme — clean, minimal.
-*/
-
+ * Code editor component — mounts a CodeMirror 6 instance.
+ *
+ * @example
+ * ```tsx
+ * const editor = createEditor({
+ *   value: 'const x = 1',
+ *   language: 'typescript',
+ *   theme: 'dark',
+ * })
+ *
+ * <CodeEditor instance={editor} style="height: 400px" />
+ * ```
+ */
+declare function CodeEditor(props: CodeEditorProps): VNodeChild;
+//#endregion
+//#region src/components/diff-editor.d.ts
 /**
-* Resolve a theme value to a CodeMirror extension.
-*/
-function resolveTheme(theme) {
-  if (theme === "light") return lightTheme;
-  if (theme === "dark") return darkTheme;
-  return theme;
-}
-
+ * Side-by-side or inline diff editor using @codemirror/merge.
+ *
+ * @example
+ * ```tsx
+ * <DiffEditor
+ *   original="const x = 1"
+ *   modified="const x = 2"
+ *   language="typescript"
+ *   theme="dark"
+ *   style="height: 400px"
+ * />
+ * ```
+ */
+declare function DiffEditor(props: DiffEditorProps): VNodeChild;
 //#endregion
-//#region src/components/diff-editor.tsx
+//#region src/components/tabbed-editor.d.ts
 /**
-* Side-by-side or inline diff editor using @codemirror/merge.
-*
-* @example
-* ```tsx
-* <DiffEditor
-*   original="const x = 1"
-*   modified="const x = 2"
-*   language="typescript"
-*   theme="dark"
-*   style="height: 400px"
-* />
-* ```
-*/
-function DiffEditor(props) {
-  const {
-    original,
-    modified,
-    language = "plain",
-    theme = "light",
-    readOnly = true,
-    inline = false
-  } = props;
-  const containerRef = async el => {
-    if (!el) return;
-    const langExt = await loadLanguage(language);
-    const themeExt = resolveTheme(theme);
-    const extensions = [syntaxHighlighting(defaultHighlightStyle, {
-      fallback: true
-    }), langExt, themeExt, EditorView.editable.of(!readOnly), EditorState.readOnly.of(readOnly)];
-    const originalText = typeof original === "string" ? original : original();
-    const modifiedText = typeof modified === "string" ? modified : modified();
-    el.innerHTML = "";
-    if (inline) new MergeView({
-      a: {
-        doc: originalText,
-        extensions
-      },
-      b: {
-        doc: modifiedText,
-        extensions
-      },
-      parent: el,
-      collapseUnchanged: {
-        margin: 3,
-        minSize: 4
-      }
-    });else new MergeView({
-      a: {
-        doc: originalText,
-        extensions
-      },
-      b: {
-        doc: modifiedText,
-        extensions
-      },
-      parent: el,
-      collapseUnchanged: {
-        margin: 3,
-        minSize: 4
-      }
-    });
-  };
-  const baseStyle = `width: 100%; height: 100%; overflow: hidden; ${props.style ?? ""}`;
-  return /* @__PURE__ */jsx("div", {
-    ref: containerRef,
-    class: `pyreon-diff-editor ${props.class ?? ""}`,
-    style: baseStyle
-  });
-}
-
+ * Tabbed code editor component — renders tab bar + editor.
+ * Headless styling — the tab bar is a plain div with button tabs.
+ * Consumers can style via CSS classes.
+ *
+ * @example
+ * ```tsx
+ * const editor = createTabbedEditor({
+ *   tabs: [
+ *     { name: 'index.ts', language: 'typescript', value: 'const x = 1' },
+ *     { name: 'style.css', language: 'css', value: '.app { }' },
+ *   ],
+ *   theme: 'dark',
+ * })
+ *
+ * <TabbedEditor instance={editor} style="height: 500px" />
+ * ```
+ */
+declare function TabbedEditor(props: TabbedEditorProps): VNodeChild;
 //#endregion
-//#region src/components/tabbed-editor.tsx
+//#region src/editor.d.ts
 /**
-* Tabbed code editor component — renders tab bar + editor.
-* Headless styling — the tab bar is a plain div with button tabs.
-* Consumers can style via CSS classes.
-*
-* @example
-* ```tsx
-* const editor = createTabbedEditor({
-*   tabs: [
-*     { name: 'index.ts', language: 'typescript', value: 'const x = 1' },
-*     { name: 'style.css', language: 'css', value: '.app { }' },
-*   ],
-*   theme: 'dark',
-* })
-*
-* <TabbedEditor instance={editor} style="height: 500px" />
-* ```
-*/
-function TabbedEditor(props) {
-  const {
-    instance
-  } = props;
-  const containerStyle = `display: flex; flex-direction: column; width: 100%; height: 100%; ${props.style ?? ""}`;
-  const tabBarStyle = "display: flex; overflow-x: auto; background: #f1f5f9; border-bottom: 1px solid #e2e8f0; min-height: 34px; flex-shrink: 0;";
-  return /* @__PURE__ */jsxs("div", {
-    class: `pyreon-tabbed-editor ${props.class ?? ""}`,
-    style: containerStyle,
-    children: [() => {
-      const tabs = instance.tabs();
-      const activeId = instance.activeTabId();
-      return /* @__PURE__ */jsx("div", {
-        class: "pyreon-tabbed-editor-tabs",
-        style: tabBarStyle,
-        children: tabs.map(tab => {
-          const id = tab.id ?? tab.name;
-          const isActive = id === activeId;
-          const tabStyle = `display: flex; align-items: center; gap: 6px; padding: 6px 12px; border: none; background: ${isActive ? "white" : "transparent"}; border-bottom: ${isActive ? "2px solid #3b82f6" : "2px solid transparent"}; cursor: pointer; font-size: 13px; color: ${isActive ? "#1e293b" : "#64748b"}; white-space: nowrap; position: relative; font-family: inherit;`;
-          return /* @__PURE__ */jsxs("button", {
-            type: "button",
-            class: `pyreon-tab ${isActive ? "active" : ""} ${tab.modified ? "modified" : ""}`,
-            style: tabStyle,
-            onClick: () => instance.switchTab(id),
-            children: [/* @__PURE__ */jsx("span", {
-              children: tab.name
-            }), tab.modified && /* @__PURE__ */jsx("span", {
-              style: "width: 6px; height: 6px; border-radius: 50%; background: #f59e0b; flex-shrink: 0;",
-              title: "Modified"
-            }), tab.closable !== false && /* @__PURE__ */jsx("span", {
-              style: "font-size: 14px; line-height: 1; opacity: 0.5; cursor: pointer; padding: 0 2px; margin-left: 2px;",
-              title: "Close",
-              onClick: e => {
-                e.stopPropagation();
-                instance.closeTab(id);
-              },
-              children: "×"
-            })]
-          }, id);
-        })
-      });
-    }, /* @__PURE__ */jsx("div", {
-      style: "flex: 1; min-height: 0;",
-      children: /* @__PURE__ */jsx(CodeEditor, {
-        instance: instance.editor
-      })
-    })]
-  });
-}
-
+ * Create a reactive code editor instance.
+ *
+ * The editor state (value, language, theme, cursor, selection) is backed
+ * by signals. The CodeMirror EditorView is created when mounted via
+ * the `<CodeEditor>` component.
+ *
+ * @param config - Editor configuration
+ * @returns A reactive EditorInstance
+ *
+ * @example
+ * ```tsx
+ * const editor = createEditor({
+ *   value: 'const x = 1',
+ *   language: 'typescript',
+ *   theme: 'dark',
+ * })
+ *
+ * editor.value()           // reactive
+ * editor.value.set('new')  // updates editor
+ *
+ * <CodeEditor instance={editor} />
+ * ```
+ */
+declare function createEditor(config?: EditorConfig): EditorInstance;
 //#endregion
-//#region src/minimap.ts
+//#region src/languages.d.ts
 /**
-* Canvas-based minimap extension for CodeMirror 6.
-* Renders a scaled-down overview of the document on the right side.
-*/
-
-function createMinimapCanvas() {
-  const canvas = document.createElement("canvas");
-  canvas.style.cssText = `position: absolute; right: 0; top: 0; width: ${MINIMAP_WIDTH}px; height: 100%; cursor: pointer; z-index: 5;`;
-  canvas.width = MINIMAP_WIDTH * 2;
-  return canvas;
-}
-function renderMinimap(canvas, view) {
-  const ctx = canvas.getContext("2d");
-  if (!ctx) return;
-  const doc = view.state.doc;
-  const totalLines = doc.lines;
-  const height = canvas.clientHeight;
-  canvas.height = height * 2;
-  const isDark = view.dom.classList.contains("cm-dark");
-  const bg = isDark ? MINIMAP_BG : MINIMAP_BG_LIGHT;
-  const textColor = isDark ? TEXT_COLOR : TEXT_COLOR_LIGHT;
-  const scale = 2;
-  ctx.setTransform(scale, 0, 0, scale, 0, 0);
-  ctx.fillStyle = bg;
-  ctx.fillRect(0, 0, MINIMAP_WIDTH, height);
-  const contentHeight = totalLines * LINE_HEIGHT;
-  const scrollFraction = contentHeight > height ? view.scrollDOM.scrollTop / (view.scrollDOM.scrollHeight - view.scrollDOM.clientHeight || 1) : 0;
-  const offset = contentHeight > height ? scrollFraction * (contentHeight - height) : 0;
-  ctx.fillStyle = textColor;
-  const startLine = Math.max(1, Math.floor(offset / LINE_HEIGHT));
-  const endLine = Math.min(totalLines, startLine + Math.ceil(height / LINE_HEIGHT) + 1);
-  for (let i = startLine; i <= endLine; i++) {
-    const line = doc.line(i);
-    const y = (i - 1) * LINE_HEIGHT - offset;
-    if (y < -LINE_HEIGHT || y > height) continue;
-    const text = line.text;
-    let x = 4;
-    for (let j = 0; j < Math.min(text.length, 60); j++) {
-      if (text[j] !== " " && text[j] !== "	") ctx.fillRect(x, y, CHAR_WIDTH, 1.5);
-      x += CHAR_WIDTH;
-    }
-  }
-  const viewportTop = view.scrollDOM.scrollTop;
-  const viewportHeight = view.scrollDOM.clientHeight;
-  const docHeight = view.scrollDOM.scrollHeight || 1;
-  const vpY = viewportTop / docHeight * Math.min(contentHeight, height);
-  const vpH = viewportHeight / docHeight * Math.min(contentHeight, height);
-  ctx.fillStyle = VIEWPORT_COLOR;
-  ctx.fillRect(0, vpY, MINIMAP_WIDTH, vpH);
-  ctx.strokeStyle = VIEWPORT_BORDER;
-  ctx.lineWidth = 1;
-  ctx.strokeRect(.5, vpY + .5, MINIMAP_WIDTH - 1, vpH - 1);
-}
+ * Load a language extension. Returns cached if already loaded.
+ * Language grammars are lazy-imported — zero cost until used.
+ *
+ * @example
+ * ```ts
+ * const ext = await loadLanguage('typescript')
+ * ```
+ */
+declare function loadLanguage(language: EditorLanguage): Promise<Extension>;
 /**
-* CodeMirror 6 minimap extension.
-* Renders a canvas-based code overview on the right side of the editor.
-*
-* @example
-* ```ts
-* import { minimapExtension } from '@pyreon/code'
-* // Add to editor extensions
-* ```
-*/
-function minimapExtension() {
-  return [ViewPlugin.fromClass(class {
-    canvas;
-    view;
-    animFrame = null;
-    constructor(view) {
-      this.view = view;
-      this.canvas = createMinimapCanvas();
-      view.dom.style.position = "relative";
-      view.dom.appendChild(this.canvas);
-      this.canvas.addEventListener("click", e => {
-        const rect = this.canvas.getBoundingClientRect();
-        const scrollTarget = (e.clientY - rect.top) / rect.height * (view.scrollDOM.scrollHeight - view.scrollDOM.clientHeight);
-        view.scrollDOM.scrollTo({
-          top: scrollTarget,
-          behavior: "smooth"
-        });
-      });
-      this.render();
-    }
-    render() {
-      renderMinimap(this.canvas, this.view);
-    }
-    update(update) {
-      if (update.docChanged || update.viewportChanged || update.geometryChanged) {
-        if (this.animFrame) cancelAnimationFrame(this.animFrame);
-        this.animFrame = requestAnimationFrame(() => this.render());
-      }
-    }
-    destroy() {
-      if (this.animFrame) cancelAnimationFrame(this.animFrame);
-      this.canvas.remove();
-    }
-  }), EditorView.theme({
-    ".cm-scroller": {
-      paddingRight: `${MINIMAP_WIDTH + 8}px`
-    }
-  })];
-}
-
+ * Get available languages.
+ */
+declare function getAvailableLanguages(): EditorLanguage[];
 //#endregion
-//#region src/editor.ts
+//#region src/minimap.d.ts
 /**
-* Create a reactive code editor instance.
-*
-* The editor state (value, language, theme, cursor, selection) is backed
-* by signals. The CodeMirror EditorView is created when mounted via
-* the `<CodeEditor>` component.
-*
-* @param config - Editor configuration
-* @returns A reactive EditorInstance
-*
-* @example
-* ```tsx
-* const editor = createEditor({
-*   value: 'const x = 1',
-*   language: 'typescript',
-*   theme: 'dark',
-* })
-*
-* editor.value()           // reactive
-* editor.value.set('new')  // updates editor
-*
-* <CodeEditor instance={editor} />
-* ```
-*/
-function createEditor(config = {}) {
-  const {
-    value: initialValue = "",
-    language: initialLanguage = "plain",
-    theme: initialTheme = "light",
-    lineNumbers: showLineNumbers = true,
-    readOnly: initialReadOnly = false,
-    foldGutter: showFoldGutter = true,
-    bracketMatching: enableBracketMatching = true,
-    autocomplete: enableAutocomplete = true,
-    search: _enableSearch = true,
-    highlightIndentGuides: enableIndentGuides = true,
-    vim: enableVim = false,
-    emacs: enableEmacs = false,
-    tabSize: configTabSize = 2,
-    lineWrapping: enableLineWrapping = false,
-    placeholder: placeholderText,
-    minimap: enableMinimap = false,
-    extensions: userExtensions = [],
-    onChange
-  } = config;
-  const value = signal(initialValue);
-  const language = signal(initialLanguage);
-  const theme = signal(initialTheme);
-  const readOnly = signal(initialReadOnly);
-  const focused = signal(false);
-  const view = signal(null);
-  const docVersion = signal(0);
-  const languageCompartment = new Compartment();
-  const themeCompartment = new Compartment();
-  const readOnlyCompartment = new Compartment();
-  const extraKeymapCompartment = new Compartment();
-  const keyModeCompartment = new Compartment();
-  const cursor = computed(() => {
-    docVersion();
-    const v = view.peek();
-    if (!v) return {
-      line: 1,
-      col: 1
-    };
-    const pos = v.state.selection.main.head;
-    const line = v.state.doc.lineAt(pos);
-    return {
-      line: line.number,
-      col: pos - line.from + 1
-    };
-  });
-  const selection = computed(() => {
-    docVersion();
-    const v = view.peek();
-    if (!v) return {
-      from: 0,
-      to: 0,
-      text: ""
-    };
-    const sel = v.state.selection.main;
-    return {
-      from: sel.from,
-      to: sel.to,
-      text: v.state.sliceDoc(sel.from, sel.to)
-    };
-  });
-  const lineCount = computed(() => {
-    docVersion();
-    const v = view.peek();
-    return v ? v.state.doc.lines : initialValue.split("\n").length;
-  });
-  const lineHighlights = /* @__PURE__ */new Map();
-  const lineHighlightField = ViewPlugin.fromClass(class {
-    decorations;
-    constructor(editorView) {
-      this.decorations = this.buildDecos(editorView);
-    }
-    buildDecos(editorView) {
-      const ranges = [];
-      for (const [lineNum, cls] of lineHighlights) if (lineNum >= 1 && lineNum <= editorView.state.doc.lines) {
-        const lineInfo = editorView.state.doc.line(lineNum);
-        ranges.push({
-          from: lineInfo.from,
-          deco: Decoration.line({
-            class: cls
-          })
-        });
-      }
-      return Decoration.set(ranges.sort((a, b) => a.from - b.from).map(d => d.deco.range(d.from)));
-    }
-    update(upd) {
-      if (upd.docChanged || upd.viewportChanged) this.decorations = this.buildDecos(upd.view);
-    }
-  }, {
-    decorations: plugin => plugin.decorations
-  });
-  const gutterMarkers = /* @__PURE__ */new Map();
-  class CustomGutterMarker extends GutterMarker {
-    markerText;
-    markerTitle;
-    markerClass;
-    constructor(opts) {
-      super();
-      this.markerText = opts.text ?? "";
-      this.markerTitle = opts.title ?? "";
-      this.markerClass = opts.class ?? "";
-    }
-    toDOM() {
-      const el = document.createElement("span");
-      el.textContent = this.markerText;
-      el.title = this.markerTitle;
-      if (this.markerClass) el.className = this.markerClass;
-      el.style.cssText = "cursor: pointer; display: inline-block; width: 100%; text-align: center;";
-      return el;
-    }
-  }
-  const gutterMarkerExtension = gutter({
-    class: "pyreon-code-gutter-markers",
-    lineMarker: (gutterView, line) => {
-      const lineNo = gutterView.state.doc.lineAt(line.from).number;
-      const marker = gutterMarkers.get(lineNo);
-      if (!marker) return null;
-      return new CustomGutterMarker(marker);
-    },
-    initialSpacer: () => new CustomGutterMarker({
-      text: " "
-    })
-  });
-  function buildExtensions(langExt) {
-    const exts = [history(), drawSelection(), dropCursor(), rectangularSelection(), crosshairCursor(), highlightActiveLine(), highlightActiveLineGutter(), highlightSelectionMatches(), indentOnInput(), syntaxHighlighting(defaultHighlightStyle, {
-      fallback: true
-    }), indentUnit.of(" ".repeat(configTabSize)), keymap.of([...closeBracketsKeymap, ...defaultKeymap, ...searchKeymap, ...historyKeymap, ...foldKeymap, ...completionKeymap, ...lintKeymap, indentWithTab]), languageCompartment.of(langExt), themeCompartment.of(resolveTheme(initialTheme)), readOnlyCompartment.of(EditorState.readOnly.of(initialReadOnly)), extraKeymapCompartment.of([]), keyModeCompartment.of([]), EditorView.updateListener.of(update => {
-      if (update.docChanged) {
-        const newValue = update.state.doc.toString();
-        if (newValue !== value.peek()) {
-          value.set(newValue);
-          onChange?.(newValue);
-        }
-        docVersion.update(v => v + 1);
-      }
-      if (update.selectionSet) docVersion.update(v => v + 1);
-      if (update.focusChanged) focused.set(update.view.hasFocus);
-    })];
-    if (showLineNumbers) exts.push(lineNumbers());
-    if (showFoldGutter) exts.push(foldGutter());
-    if (enableBracketMatching) exts.push(bracketMatching(), closeBrackets());
-    if (enableAutocomplete) exts.push(autocompletion());
-    if (enableLineWrapping) exts.push(EditorView.lineWrapping);
-    if (enableIndentGuides) exts.push(EditorView.theme({
-      ".cm-line": {
-        backgroundImage: "linear-gradient(to right, #e5e7eb 1px, transparent 1px)",
-        backgroundSize: `${configTabSize}ch 100%`,
-        backgroundPosition: "0 0"
-      }
-    }));
-    if (placeholderText) exts.push(placeholder(placeholderText));
-    if (enableMinimap) exts.push(minimapExtension());
-    exts.push(lineHighlightField);
-    exts.push(gutterMarkerExtension);
-    exts.push(...userExtensions);
-    return exts;
-  }
-  let mounted = false;
-  async function mount(parent) {
-    if (mounted) return;
-    const extensions = buildExtensions(await loadLanguage(language.peek()));
-    const editorView = new EditorView({
-      state: EditorState.create({
-        doc: value.peek(),
-        extensions
-      }),
-      parent
-    });
-    view.set(editorView);
-    mounted = true;
-    effect(() => {
-      const val = value();
-      const v = view.peek();
-      if (!v) return;
-      const current = v.state.doc.toString();
-      if (val !== current) v.dispatch({
-        changes: {
-          from: 0,
-          to: current.length,
-          insert: val
-        }
-      });
-    });
-    effect(() => {
-      const lang = language();
-      const v = view.peek();
-      if (!v) return;
-      loadLanguage(lang).then(ext => {
-        v.dispatch({
-          effects: languageCompartment.reconfigure(ext)
-        });
-      });
-    });
-    effect(() => {
-      const t = theme();
-      const v = view.peek();
-      if (!v) return;
-      v.dispatch({
-        effects: themeCompartment.reconfigure(resolveTheme(t))
-      });
-    });
-    effect(() => {
-      const ro = readOnly();
-      const v = view.peek();
-      if (!v) return;
-      v.dispatch({
-        effects: readOnlyCompartment.reconfigure(EditorState.readOnly.of(ro))
-      });
-    });
-  }
-  function focus() {
-    view.peek()?.focus();
-  }
-  function insert(text) {
-    const v = view.peek();
-    if (!v) return;
-    const pos = v.state.selection.main.head;
-    v.dispatch({
-      changes: {
-        from: pos,
-        insert: text
-      }
-    });
-  }
-  function replaceSelection(text) {
-    const v = view.peek();
-    if (!v) return;
-    v.dispatch(v.state.replaceSelection(text));
-  }
-  function select(from, to) {
-    const v = view.peek();
-    if (!v) return;
-    v.dispatch({
-      selection: {
-        anchor: from,
-        head: to
-      }
-    });
-  }
-  function selectAll() {
-    const v = view.peek();
-    if (!v) return;
-    v.dispatch({
-      selection: {
-        anchor: 0,
-        head: v.state.doc.length
-      }
-    });
-  }
-  function goToLine(line) {
-    const v = view.peek();
-    if (!v) return;
-    const lineInfo = v.state.doc.line(Math.min(Math.max(1, line), v.state.doc.lines));
-    v.dispatch({
-      selection: {
-        anchor: lineInfo.from
-      },
-      scrollIntoView: true
-    });
-    v.focus();
-  }
-  function undo$1() {
-    const v = view.peek();
-    if (v) undo(v);
-  }
-  function redo$1() {
-    const v = view.peek();
-    if (v) redo(v);
-  }
-  function foldAll() {
-    const v = view.peek();
-    if (!v) return;
-    const {
-      foldAll: foldAllCmd
-    } = __require("@codemirror/language");
-    foldAllCmd(v);
-  }
-  function unfoldAll() {
-    const v = view.peek();
-    if (!v) return;
-    const {
-      unfoldAll: unfoldAllCmd
-    } = __require("@codemirror/language");
-    unfoldAllCmd(v);
-  }
-  function setDiagnostics$1(diagnostics) {
-    const v = view.peek();
-    if (!v) return;
-    v.dispatch(setDiagnostics(v.state, diagnostics.map(d => ({
-      from: d.from,
-      to: d.to,
-      severity: d.severity === "hint" ? "info" : d.severity,
-      message: d.message,
-      source: d.source
-    }))));
-  }
-  function clearDiagnostics() {
-    const v = view.peek();
-    if (!v) return;
-    v.dispatch(setDiagnostics(v.state, []));
-  }
-  function highlightLine(line, className) {
-    lineHighlights.set(line, className);
-    const v = view.peek();
-    if (v) v.dispatch({
-      effects: []
-    });
-  }
-  function clearLineHighlights() {
-    lineHighlights.clear();
-    const v = view.peek();
-    if (v) v.dispatch({
-      effects: []
-    });
-  }
-  function setGutterMarker(line, marker) {
-    gutterMarkers.set(line, marker);
-    const v = view.peek();
-    if (v) v.dispatch({
-      effects: []
-    });
-  }
-  function clearGutterMarkers() {
-    gutterMarkers.clear();
-    const v = view.peek();
-    if (v) v.dispatch({
-      effects: []
-    });
-  }
-  const customKeybindings = [];
-  function addKeybinding(key, handler) {
-    customKeybindings.push({
-      key,
-      run: () => {
-        handler();
-        return true;
-      }
-    });
-    const v = view.peek();
-    if (!v) return;
-    v.dispatch({
-      effects: extraKeymapCompartment.reconfigure(keymap.of(customKeybindings))
-    });
-  }
-  function getLine(line) {
-    const v = view.peek();
-    if (!v) return "";
-    const clamped = Math.min(Math.max(1, line), v.state.doc.lines);
-    return v.state.doc.line(clamped).text;
-  }
-  function getWordAtCursor() {
-    const v = view.peek();
-    if (!v) return "";
-    const pos = v.state.selection.main.head;
-    const line = v.state.doc.lineAt(pos);
-    const col = pos - line.from;
-    const text = line.text;
-    let start = col;
-    let end = col;
-    while (start > 0 && /\w/.test(text[start - 1])) start--;
-    while (end < text.length && /\w/.test(text[end])) end++;
-    return text.slice(start, end);
-  }
-  function scrollTo(pos) {
-    const v = view.peek();
-    if (!v) return;
-    v.dispatch({
-      effects: EditorView.scrollIntoView(pos, {
-        y: "center"
-      })
-    });
-  }
-  async function loadKeyMode() {
-    const v = view.peek();
-    if (!v) return;
-    const vimPkg = "@replit/codemirror-vim";
-    const emacsPkg = "@replit/codemirror-emacs";
-    if (enableVim) try {
-      const mod = await import(/* @vite-ignore */
-      vimPkg);
-      v.dispatch({
-        effects: keyModeCompartment.reconfigure(mod.vim())
-      });
-    } catch {}
-    if (enableEmacs) try {
-      const mod = await import(/* @vite-ignore */
-      emacsPkg);
-      v.dispatch({
-        effects: keyModeCompartment.reconfigure(mod.emacs())
-      });
-    } catch {}
-  }
-  function dispose() {
-    const v = view.peek();
-    if (v) {
-      v.destroy();
-      view.set(null);
-      mounted = false;
-    }
-  }
-  return {
-    value,
-    language,
-    theme,
-    readOnly,
-    cursor,
-    selection,
-    lineCount,
-    focused,
-    view,
-    focus,
-    insert,
-    replaceSelection,
-    select,
-    selectAll,
-    goToLine,
-    undo: undo$1,
-    redo: redo$1,
-    foldAll,
-    unfoldAll,
-    setDiagnostics: setDiagnostics$1,
-    clearDiagnostics,
-    highlightLine,
-    clearLineHighlights,
-    setGutterMarker,
-    clearGutterMarkers,
-    addKeybinding,
-    getLine,
-    getWordAtCursor,
-    scrollTo,
-    config,
-    dispose,
-    _mount: async parent => {
-      await mount(parent);
-      await loadKeyMode();
-    }
-  };
-}
-
+ * CodeMirror 6 minimap extension.
+ * Renders a canvas-based code overview on the right side of the editor.
+ *
+ * @example
+ * ```ts
+ * import { minimapExtension } from '@pyreon/code'
+ * // Add to editor extensions
+ * ```
+ */
+declare function minimapExtension(): Extension;
+//#endregion
+//#region src/themes.d.ts
+/**
+ * Light theme — clean, minimal.
+ */
+declare const lightTheme: Extension;
+/**
+ * Dark theme — VS Code inspired.
+ */
+declare const darkTheme: Extension;
+/**
+ * Resolve a theme value to a CodeMirror extension.
+ */
+declare function resolveTheme(theme: EditorTheme): Extension;
 //#endregion
-export { CodeEditor, DiffEditor, TabbedEditor, createEditor, darkTheme, getAvailableLanguages, lightTheme, loadLanguage, minimapExtension, resolveTheme, __exportAll as t };
-//# sourceMappingURL=index.d.ts.map
+export { CodeEditor, type CodeEditorProps, DiffEditor, type DiffEditorProps, type EditorConfig, type EditorInstance, type EditorLanguage, type EditorTheme, type GutterMarker, type Tab, TabbedEditor, type TabbedEditorConfig, type TabbedEditorInstance, type TabbedEditorProps, createEditor, darkTheme, getAvailableLanguages, lightTheme, loadLanguage, minimapExtension, resolveTheme };
+//# sourceMappingURL=index2.d.ts.map