markmap-view-plus 0.0.1

package/README.md

@@ -0,0 +1,20 @@
+# markmap-view-plus
+
+![NPM](https://img.shields.io/npm/v/markmap-view-plus.svg)
+![License](https://img.shields.io/npm/l/markmap-view-plus.svg)
+![Downloads](https://img.shields.io/npm/dt/markmap-view-plus.svg)
+
+View markmaps in browser.
+
+This is an editable version of markmap-view-plus with enhanced features for node editing, adding, and deleting.
+
+
+## Install
+
+```sh
+$ npm install markmap-view-plus
+```
+
+This package is separated from [markmap-lib](https://github.com/markmap/markmap/tree/master/packages/markmap-lib) to decrease the size of `node_modules` because you don't need this in `node_modules` most of the time.
+
+👉 [Read the documentation](https://markmap.js.org/docs) for more detail.

package/dist/action.d.ts

@@ -0,0 +1,110 @@
+import type * as d3 from 'd3';
+import { INode } from 'markmap-common';
+import { ID3SVGElement, IMarkmapOptions, IMarkmapState } from './types';
+/**
+ * The subset of Markmap that ActionManager needs to read or call back into.
+ * Keeping this as an interface avoids a circular import between action.ts ↔ view.ts.
+ */
+export interface IMarkmapActionContext {
+    svg: ID3SVGElement;
+    g: d3.Selection<SVGGElement, INode, HTMLElement, INode>;
+    state: IMarkmapState;
+    options: IMarkmapOptions;
+    renderData: (originData?: INode) => Promise<void>;
+    findElement: (node: INode) => {
+        data: INode;
+        g: SVGGElement;
+    } | undefined;
+}
+/**
+ * Manages all node add / edit / delete actions and their associated UI overlays.
+ *
+ * Responsibilities:
+ *  - Overlay lifecycle: + button, new-node input, edit input
+ *  - Tree mutations: insert child, insert sibling, delete node
+ *  - Selection state: editingNode, selectedNode
+ *
+ * view.ts creates one ActionManager per Markmap instance and delegates to it.
+ */
+export declare class ActionManager {
+    private ctx;
+    /** Node currently being edited (null when idle). */
+    editingNode: INode | null;
+    /** Currently selected node (null when nothing is selected). */
+    selectedNode: INode | null;
+    /** Active edit-overlay state (shared by existing-node edits and new-node edits). */
+    editOverlay?: {
+        wrap: HTMLDivElement;
+        input: HTMLInputElement;
+        contentEl: HTMLDivElement;
+        prevVisibility: string;
+    } | undefined;
+    /** Active + button UI state. */
+    addUI?: {
+        node: INode;
+        btn: HTMLButtonElement;
+        wrap: HTMLDivElement;
+        cleanupDoc: () => void;
+    } | undefined;
+    /**
+     * Kept for overlay-guard checks in view.ts.
+     * In the current flow this is only set briefly during legacy paths.
+     */
+    addInputUI?: {
+        node: INode;
+        input: HTMLInputElement;
+        wrap: HTMLDivElement;
+    } | undefined;
+    constructor(ctx: IMarkmapActionContext);
+    private _getNodeContentEl;
+    private _getOverlayRoot;
+    private _positionOverlayToEl;
+    private _safeRemoveEl;
+    private _clearSelectionCss;
+    private _findParent;
+    /** Create a blank child INode and append it to parent.children. */
+    private _insertNewChildNode;
+    /**
+     * Core overlay builder shared by _editNewNode and handleEdit.
+     *
+     * @param node        - The INode being edited (content will be mutated on save).
+     * @param contentNode - The inner <div> whose position / style drives the overlay.
+     * @param opts.initialValue  - Starting text in the input ('': new node, textContent: existing).
+     * @param opts.minWidth      - Minimum overlay width in px.
+     * @param opts.placeholder   - Input placeholder (only shown when initialValue is empty).
+     * @param opts.selectAll     - Whether to select all text on focus (true for existing nodes).
+     * @param opts.onSave        - Called after the overlay is torn down on a successful save.
+     * @param opts.onCancel      - Called after the overlay is torn down on cancel / empty input.
+     */
+    private _openEditOverlay;
+    /**
+     * Open an edit overlay for a freshly-inserted node.
+     * Empty input → confirm saves; blank input → cancels and removes the node from the tree.
+     */
+    private _editNewNode;
+    /** Reposition all active overlays after zoom / pan. */
+    repositionOverlays(): void;
+    /** Hide and destroy the + button and any associated input overlay. */
+    hideAddUI(): void;
+    /** Show the + button anchored to the bottom-right corner of `node`. */
+    showAddUI(node: INode): void;
+    /** Delete `node` from the tree and re-render. */
+    deleteNode(node: INode): void;
+    /**
+     * Insert a new sibling node after `sibling`, render it, then open an edit overlay.
+     * Called when the user presses Enter on a selected node.
+     */
+    showAddSiblingInput(sibling: INode): Promise<void>;
+    /**
+     * Insert a new child node under `node`, render it, then open an edit overlay.
+     * Called when the user clicks the + button or presses Tab.
+     */
+    showAddInput(node: INode): Promise<void>;
+    /**
+     * Open an edit overlay for an *existing* node.
+     * Called on double-click. On confirm the node content is updated in-place.
+     */
+    handleEdit(e: MouseEvent, d: INode): void;
+    /** Immediately discard any in-progress edit overlay without saving. */
+    saveEdit(): void;
+}