@excalidraw/excalidraw 0.18.0-817d8c5 → 0.18.0-a30e1b2

package/dist/types/excalidraw/types.d.ts

@@ -1,25 +1,23 @@
-import type { JSX } from "react";
-import type React from "react";
-import type { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, Arrowhead, ChartType, FontFamilyValues, FileId, ExcalidrawImageElement, Theme, StrokeRoundness, ExcalidrawEmbeddableElement, ExcalidrawMagicFrameElement, ExcalidrawFrameLikeElement, ExcalidrawElementType, ExcalidrawIframeLikeElement, OrderedExcalidrawElement, ExcalidrawNonSelectionElement } from "./element/types";
+import type { IMAGE_MIME_TYPES, UserIdleState, throttleRAF, MIME_TYPES } from "@excalidraw/common";
+import type { SuggestedBinding } from "@excalidraw/element/binding";
+import type { LinearElementEditor } from "@excalidraw/element/linearElementEditor";
+import type { MaybeTransformHandleType } from "@excalidraw/element/transformHandles";
+import type { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, Arrowhead, ChartType, FontFamilyValues, FileId, ExcalidrawImageElement, Theme, StrokeRoundness, ExcalidrawEmbeddableElement, ExcalidrawMagicFrameElement, ExcalidrawFrameLikeElement, ExcalidrawElementType, ExcalidrawIframeLikeElement, OrderedExcalidrawElement, ExcalidrawNonSelectionElement } from "@excalidraw/element/types";
+import type { Merge, MaybePromise, ValueOf, MakeBrand } from "@excalidraw/common/utility-types";
+import type { CaptureUpdateActionType, DurableIncrement, EphemeralIncrement } from "@excalidraw/element/store";
 import type { Action } from "./actions/types";
-import type { LinearElementEditor } from "./element/linearElementEditor";
-import type { SuggestedBinding } from "./element/binding";
-import type { ImportedDataState } from "./data/types";
-import type App from "./components/App";
-import type { throttleRAF } from "./utils";
 import type { Spreadsheet } from "./charts";
-import type { Language } from "./i18n";
 import type { ClipboardData } from "./clipboard";
-import type { isOverScrollBars } from "./scene/scrollbars";
-import type { MaybeTransformHandleType } from "./element/transformHandles";
+import type App from "./components/App";
 import type Library from "./data/library";
 import type { FileSystemHandle } from "./data/filesystem";
-import type { IMAGE_MIME_TYPES, MIME_TYPES } from "./constants";
 import type { ContextMenuItems } from "./components/ContextMenu";
 import type { SnapLine } from "./snapping";
-import type { Merge, MaybePromise, ValueOf, MakeBrand } from "./utility-types";
-import type { CaptureUpdateActionType } from "./store";
-import type { UserIdleState } from "./constants";
+import type { ImportedDataState } from "./data/types";
+import type { Language } from "./i18n";
+import type { isOverScrollBars } from "./scene/scrollbars";
+import type React from "react";
+import type { JSX } from "react";
 export type SocketId = string & {
     _brand: "SocketId";
 };
@@ -86,7 +84,7 @@ export type BinaryFileData = {
 };
 export type BinaryFileMetadata = Omit<BinaryFileData, "dataURL">;
 export type BinaryFiles = Record<ExcalidrawElement["id"], BinaryFileData>;
-export type ToolType = "selection" | "rectangle" | "diamond" | "ellipse" | "arrow" | "line" | "freedraw" | "text" | "image" | "eraser" | "hand" | "frame" | "magicframe" | "embeddable" | "laser";
+export type ToolType = "selection" | "lasso" | "rectangle" | "diamond" | "ellipse" | "arrow" | "line" | "freedraw" | "text" | "image" | "eraser" | "hand" | "frame" | "magicframe" | "embeddable" | "laser";
 export type ElementOrToolType = ExcalidrawElementType | ToolType | "custom";
 export type ActiveTool = {
     type: ToolType;
@@ -219,6 +217,7 @@ export interface AppState {
          */
         lastActiveTool: ActiveTool | null;
         locked: boolean;
+        fromSelection: boolean;
     } & ActiveTool;
     penMode: boolean;
     penDetected: boolean;
@@ -342,9 +341,13 @@ export interface AppState {
     /** image cropping */
     isCropping: boolean;
     croppingElementId: ExcalidrawElement["id"] | null;
-    searchMatches: readonly SearchMatch[];
+    /** null if no search matches found / search closed */
+    searchMatches: Readonly<{
+        focusedId: ExcalidrawElement["id"] | null;
+        matches: readonly SearchMatch[];
+    }> | null;
 }
-type SearchMatch = {
+export type SearchMatch = {
     id: string;
     focus: boolean;
     matchedLines: {
@@ -352,6 +355,7 @@ type SearchMatch = {
         offsetY: number;
         width: number;
         height: number;
+        showOnCanvas: boolean;
     }[];
 };
 export type UIAppState = Omit<AppState, "suggestedBindings" | "startBoundElement" | "cursorButton" | "scrollX" | "scrollY">;
@@ -404,6 +408,7 @@ export type OnUserFollowedPayload = {
 };
 export interface ExcalidrawProps {
     onChange?: (elements: readonly OrderedExcalidrawElement[], appState: AppState, files: BinaryFiles) => void;
+    onIncrement?: (event: DurableIncrement | EphemeralIncrement) => void;
     initialData?: (() => MaybePromise<ExcalidrawInitialDataState | null>) | MaybePromise<ExcalidrawInitialDataState | null>;
     excalidrawAPI?: (api: ExcalidrawImperativeAPI) => void;
     isCollaborating?: boolean;
@@ -460,6 +465,7 @@ export interface ExcalidrawProps {
     renderEmbeddable?: (element: NonDeleted<ExcalidrawEmbeddableElement>, appState: AppState) => JSX.Element | null;
     aiEnabled?: boolean;
     showDeprecatedFonts?: boolean;
+    renderScrollbars?: boolean;
 }
 export type SceneData = {
     elements?: ImportedDataState["elements"];
@@ -545,6 +551,7 @@ export type AppClassProperties = {
     visibleElements: App["visibleElements"];
     excalidrawContainerValue: App["excalidrawContainerValue"];
     onPointerUpEmitter: App["onPointerUpEmitter"];
+    updateEditorAtom: App["updateEditorAtom"];
 };
 export type PointerDownState = Readonly<{
     origin: Readonly<{
@@ -588,6 +595,10 @@ export type PointerDownState = Readonly<{
             x: number;
             y: number;
         } | null;
+        origin: {
+            x: number;
+            y: number;
+        };
     };
     eventListeners: {
         onMove: null | ReturnType<typeof throttleRAF>;
@@ -602,6 +613,7 @@ export type PointerDownState = Readonly<{
 export type UnsubscribeCallback = () => void;
 export interface ExcalidrawImperativeAPI {
     updateScene: InstanceType<typeof App>["updateScene"];
+    mutateElement: InstanceType<typeof App>["mutateElement"];
     updateLibrary: InstanceType<typeof Library>["updateLibrary"];
     resetScene: InstanceType<typeof App>["resetScene"];
     getSceneElementsIncludingDeleted: InstanceType<typeof App>["getSceneElementsIncludingDeleted"];
@@ -629,6 +641,7 @@ export interface ExcalidrawImperativeAPI {
      */
     updateFrameRendering: InstanceType<typeof App>["updateFrameRendering"];
     onChange: (callback: (elements: readonly ExcalidrawElement[], appState: AppState, files: BinaryFiles) => void) => UnsubscribeCallback;
+    onIncrement: (callback: (event: DurableIncrement | EphemeralIncrement) => void) => UnsubscribeCallback;
     onPointerDown: (callback: (activeTool: AppState["activeTool"], pointerDownState: PointerDownState, event: React.PointerEvent<HTMLElement>) => void) => UnsubscribeCallback;
     onPointerUp: (callback: (activeTool: AppState["activeTool"], pointerDownState: PointerDownState, event: PointerEvent) => void) => UnsubscribeCallback;
     onScrollChange: (callback: (scrollX: number, scrollY: number, zoom: Zoom) => void) => UnsubscribeCallback;

package/dist/types/excalidraw/visualdebug.d.ts

@@ -1,7 +1,7 @@
-import type { Curve } from "@excalidraw/math";
 import { type GlobalPoint, type LocalPoint } from "@excalidraw/math";
+import type { Curve } from "@excalidraw/math";
 import type { LineSegment } from "@excalidraw/utils";
-import type { Bounds } from "./element/bounds";
+import type { Bounds } from "@excalidraw/element/bounds";
 declare global {
     interface Window {
         visualDebug?: {

package/dist/types/excalidraw/{element → wysiwyg}/textWysiwyg.d.ts

@@ -1,5 +1,6 @@
-import type { ExcalidrawElement, ExcalidrawTextElement } from "./types";
+import type { ExcalidrawElement, ExcalidrawTextElement } from "@excalidraw/element/types";
 import type App from "../components/App";
+type SubmitHandler = () => void;
 export declare const textWysiwyg: ({ id, onChange, onSubmit, getViewportCoords, element, canvas, excalidrawContainer, app, autoSelect, }: {
     id: ExcalidrawElement["id"];
     /**
@@ -19,4 +20,5 @@ export declare const textWysiwyg: ({ id, onChange, onSubmit, getViewportCoords,
     excalidrawContainer: HTMLDivElement | null;
     app: App;
     autoSelect?: boolean | undefined;
-}) => void;
+}) => SubmitHandler;
+export {};

package/dist/types/math/{curve.d.ts → src/curve.d.ts}

@@ -8,6 +8,7 @@ import type { Curve, GlobalPoint, LineSegment, LocalPoint } from "./types";
  * @returns
  */
 export declare function curve<Point extends GlobalPoint | LocalPoint>(a: Point, b: Point, c: Point, d: Point): Curve<Point>;
+export declare const bezierEquation: <Point extends GlobalPoint | LocalPoint>(c: Curve<Point>, t: number) => Point;
 /**
  * Computes the intersection between a cubic spline and a line segment.
  */
@@ -38,3 +39,4 @@ export declare function curvePointDistance<Point extends GlobalPoint | LocalPoin
  * Determines if the parameter is a Curve
  */
 export declare function isCurve<P extends GlobalPoint | LocalPoint>(v: unknown): v is Curve<P>;
+export declare function curveTangent<Point extends GlobalPoint | LocalPoint>([p0, p1, p2, p3]: Curve<Point>, t: number): import("./types").Vector;

package/dist/types/math/{point.d.ts → src/point.d.ts}

@@ -45,7 +45,7 @@ export declare function isPoint(p: unknown): p is LocalPoint | GlobalPoint;
  */
 export declare function pointsEqual<Point extends GlobalPoint | LocalPoint>(a: Point, b: Point): boolean;
 /**
- * Roate a point by [angle] radians.
+ * Rotate a point by [angle] radians.
  *
  * @param point The point to rotate
  * @param center The point to rotate around, the center point
@@ -54,7 +54,7 @@ export declare function pointsEqual<Point extends GlobalPoint | LocalPoint>(a: P
  */
 export declare function pointRotateRads<Point extends GlobalPoint | LocalPoint>([x, y]: Point, [cx, cy]: Point, angle: Radians): Point;
 /**
- * Roate a point by [angle] degree.
+ * Rotate a point by [angle] degree.
  *
  * @param point The point to rotate
  * @param center The point to rotate around, the center point

package/dist/types/math/{polygon.d.ts → src/polygon.d.ts}

@@ -2,4 +2,5 @@ import type { GlobalPoint, LocalPoint, Polygon } from "./types";
 export declare function polygon<Point extends GlobalPoint | LocalPoint>(...points: Point[]): Polygon<Point>;
 export declare function polygonFromPoints<Point extends GlobalPoint | LocalPoint>(points: Point[]): Polygon<Point>;
 export declare const polygonIncludesPoint: <Point extends GlobalPoint | LocalPoint>(point: Point, polygon: Polygon<Point>) => boolean;
+export declare const polygonIncludesPointNonZero: <Point extends [number, number]>(point: Point, polygon: Point[]) => boolean;
 export declare const pointOnPolygon: <Point extends GlobalPoint | LocalPoint>(p: Point, poly: Polygon<Point>, threshold?: number) => boolean;

package/dist/types/math/{segment.d.ts → src/segment.d.ts}

@@ -36,4 +36,4 @@ export declare const distanceToLineSegment: <Point extends GlobalPoint | LocalPo
  * @param s
  * @returns
  */
-export declare function lineSegmentIntersectionPoints<Point extends GlobalPoint | LocalPoint>(l: LineSegment<Point>, s: LineSegment<Point>): Point | null;
+export declare function lineSegmentIntersectionPoints<Point extends GlobalPoint | LocalPoint>(l: LineSegment<Point>, s: LineSegment<Point>, threshold?: number): Point | null;

package/dist/types/math/{types.d.ts → src/types.d.ts}

@@ -103,3 +103,4 @@ export type Ellipse<Point extends GlobalPoint | LocalPoint> = {
 } & {
     _brand: "excalimath_ellipse";
 };
+export type ElementsSegmentsMap = Map<string, LineSegment<GlobalPoint>[]>;

package/dist/types/math/{vector.d.ts → src/vector.d.ts}

@@ -86,3 +86,7 @@ export declare function vectorMagnitude(v: Vector): number;
  * @returns The new normalized vector
  */
 export declare const vectorNormalize: (v: Vector) => Vector;
+/**
+ * Calculate the right-hand normal of the vector.
+ */
+export declare const vectorNormal: (v: Vector) => Vector;

package/dist/types/utils/{bbox.d.ts → src/bbox.d.ts}

@@ -1,5 +1,5 @@
 import { type GlobalPoint, type LocalPoint } from "@excalidraw/math";
-import type { Bounds } from "@excalidraw/excalidraw/element/bounds";
+import type { Bounds } from "@excalidraw/element/bounds";
 export type LineSegment<P extends LocalPoint | GlobalPoint> = [P, P];
 export declare function getBBox<P extends LocalPoint | GlobalPoint>(line: LineSegment<P>): Bounds;
 export declare function doBBoxesIntersect(a: Bounds, b: Bounds): boolean;

package/dist/types/utils/{collision.d.ts → src/collision.d.ts}

@@ -1,7 +1,6 @@
-import type { Polyline } from "./geometry/shape";
-import { type GeometricShape } from "./geometry/shape";
-import type { Curve } from "@excalidraw/math";
 import { type GlobalPoint, type LocalPoint, type Polygon } from "@excalidraw/math";
+import type { Curve } from "@excalidraw/math";
+import type { Polyline, GeometricShape } from "./shape";
 export declare const isPointOnShape: <Point extends GlobalPoint | LocalPoint>(point: Point, shape: GeometricShape<Point>, tolerance?: number) => boolean;
 export declare const isPointInShape: <Point extends GlobalPoint | LocalPoint>(point: Point, shape: GeometricShape<Point>) => boolean;
 export declare const isPointInBounds: <Point extends GlobalPoint | LocalPoint>(point: Point, bounds: Polygon<Point>) => boolean;

package/dist/types/utils/{export.d.ts → src/export.d.ts}

@@ -1,6 +1,6 @@
+import { MIME_TYPES } from "@excalidraw/common";
+import type { ExcalidrawElement, ExcalidrawFrameLikeElement, NonDeleted } from "@excalidraw/element/types";
 import type { AppState, BinaryFiles } from "@excalidraw/excalidraw/types";
-import type { ExcalidrawElement, ExcalidrawFrameLikeElement, NonDeleted } from "@excalidraw/excalidraw/element/types";
-import { MIME_TYPES } from "@excalidraw/excalidraw/constants";
 export { MIME_TYPES };
 type ExportOpts = {
     elements: readonly NonDeleted<ExcalidrawElement>[];

package/dist/types/utils/{index.d.ts → src/index.d.ts}

@@ -1,4 +1,4 @@
 export * from "./export";
 export * from "./withinBounds";
 export * from "./bbox";
-export { getCommonBounds } from "@excalidraw/excalidraw/element/bounds";
+export { getCommonBounds } from "@excalidraw/element/bounds";

package/dist/types/utils/{geometry → src}/shape.d.ts

@@ -1,19 +1,6 @@
-/**
- * this file defines pure geometric shapes
- *
- * for instance, a cubic bezier curve is specified by its four control points and
- * an ellipse is defined by its center, angle, semi major axis and semi minor axis
- * (but in semi-width and semi-height so it's more relevant to Excalidraw)
- *
- * the idea with pure shapes is so that we can provide collision and other geoemtric methods not depending on
- * the specifics of roughjs or elements in Excalidraw; instead, we can focus on the pure shapes themselves
- *
- * also included in this file are methods for converting an Excalidraw element or a Drawable from roughjs
- * to pure shapes
- */
-import type { Curve, LineSegment, Polygon, Radians } from "@excalidraw/math";
 import { type GlobalPoint, type LocalPoint } from "@excalidraw/math";
-import type { ElementsMap, ExcalidrawBindableElement, ExcalidrawDiamondElement, ExcalidrawElement, ExcalidrawEllipseElement, ExcalidrawEmbeddableElement, ExcalidrawFrameLikeElement, ExcalidrawFreeDrawElement, ExcalidrawIframeElement, ExcalidrawImageElement, ExcalidrawLinearElement, ExcalidrawRectangleElement, ExcalidrawSelectionElement, ExcalidrawTextElement } from "@excalidraw/excalidraw/element/types";
+import type { ElementsMap, ExcalidrawBindableElement, ExcalidrawDiamondElement, ExcalidrawElement, ExcalidrawEllipseElement, ExcalidrawEmbeddableElement, ExcalidrawFrameLikeElement, ExcalidrawFreeDrawElement, ExcalidrawIframeElement, ExcalidrawImageElement, ExcalidrawLinearElement, ExcalidrawRectangleElement, ExcalidrawSelectionElement, ExcalidrawTextElement } from "@excalidraw/element/types";
+import type { Curve, LineSegment, Polygon, Radians } from "@excalidraw/math";
 import type { Drawable, Op } from "roughjs/bin/core";
 export type Polyline<Point extends GlobalPoint | LocalPoint> = LineSegment<Point>[];
 export type Polycurve<Point extends GlobalPoint | LocalPoint> = Curve<Point>[];

package/dist/types/utils/{withinBounds.d.ts → src/withinBounds.d.ts}

@@ -1,5 +1,5 @@
-import type { ExcalidrawElement, NonDeletedExcalidrawElement } from "@excalidraw/excalidraw/element/types";
-import type { Bounds } from "@excalidraw/excalidraw/element/bounds";
+import type { Bounds } from "@excalidraw/element/bounds";
+import type { ExcalidrawElement, NonDeletedExcalidrawElement } from "@excalidraw/element/types";
 type Element = NonDeletedExcalidrawElement;
 type Elements = readonly NonDeletedExcalidrawElement[];
 export declare const isElementInsideBBox: (element: Element, bbox: Bounds, eitherDirection?: boolean) => boolean;

package/history.ts

@@ -1,10 +1,17 @@
-import type { AppStateChange, ElementsChange } from "./change";
-import type { SceneElementsMap } from "./element/types";
-import { Emitter } from "./emitter";
-import type { Snapshot } from "./store";
+import { Emitter } from "@excalidraw/common";
+
+import {
+  CaptureUpdateAction,
+  StoreChange,
+  StoreDelta,
+  type Store,
+} from "@excalidraw/element/store";
+
+import type { SceneElementsMap } from "@excalidraw/element/types";
+
 import type { AppState } from "./types";
 
-type HistoryStack = HistoryEntry[];
+class HistoryEntry extends StoreDelta {}
 
 export class HistoryChangedEvent {
   constructor(
@@ -18,8 +25,8 @@ export class History {
     [HistoryChangedEvent]
   >();
 
-  private readonly undoStack: HistoryStack = [];
-  private readonly redoStack: HistoryStack = [];
+  public readonly undoStack: HistoryEntry[] = [];
+  public readonly redoStack: HistoryEntry[] = [];
 
   public get isUndoStackEmpty() {
     return this.undoStack.length === 0;
@@ -29,60 +36,52 @@ export class History {
     return this.redoStack.length === 0;
   }
 
+  constructor(private readonly store: Store) {}
+
   public clear() {
     this.undoStack.length = 0;
     this.redoStack.length = 0;
   }
 
   /**
-   * Record a local change which will go into the history
+   * Record a non-empty local durable increment, which will go into the undo stack..
+   * Do not re-record history entries, which were already pushed to undo / redo stack, as part of history action.
    */
-  public record(
-    elementsChange: ElementsChange,
-    appStateChange: AppStateChange,
-  ) {
-    const entry = HistoryEntry.create(appStateChange, elementsChange);
+  public record(delta: StoreDelta) {
+    if (delta.isEmpty() || delta instanceof HistoryEntry) {
+      return;
+    }
 
-    if (!entry.isEmpty()) {
-      // we have the latest changes, no need to `applyLatest`, which is done within `History.push`
-      this.undoStack.push(entry.inverse());
+    // construct history entry, so once it's emitted, it's not recorded again
+    const entry = HistoryEntry.inverse(delta);
 
-      if (!entry.elementsChange.isEmpty()) {
-        // don't reset redo stack on local appState changes,
-        // as a simple click (unselect) could lead to losing all the redo entries
-        // only reset on non empty elements changes!
-        this.redoStack.length = 0;
-      }
+    this.undoStack.push(entry);
 
-      this.onHistoryChangedEmitter.trigger(
-        new HistoryChangedEvent(this.isUndoStackEmpty, this.isRedoStackEmpty),
-      );
+    if (!entry.elements.isEmpty()) {
+      // don't reset redo stack on local appState changes,
+      // as a simple click (unselect) could lead to losing all the redo entries
+      // only reset on non empty elements changes!
+      this.redoStack.length = 0;
     }
+
+    this.onHistoryChangedEmitter.trigger(
+      new HistoryChangedEvent(this.isUndoStackEmpty, this.isRedoStackEmpty),
+    );
   }
 
-  public undo(
-    elements: SceneElementsMap,
-    appState: AppState,
-    snapshot: Readonly<Snapshot>,
-  ) {
+  public undo(elements: SceneElementsMap, appState: AppState) {
     return this.perform(
       elements,
       appState,
-      snapshot,
       () => History.pop(this.undoStack),
       (entry: HistoryEntry) => History.push(this.redoStack, entry, elements),
     );
   }
 
-  public redo(
-    elements: SceneElementsMap,
-    appState: AppState,
-    snapshot: Readonly<Snapshot>,
-  ) {
+  public redo(elements: SceneElementsMap, appState: AppState) {
     return this.perform(
       elements,
       appState,
-      snapshot,
       () => History.pop(this.redoStack),
       (entry: HistoryEntry) => History.push(this.undoStack, entry, elements),
     );
@@ -91,7 +90,6 @@ export class History {
   private perform(
     elements: SceneElementsMap,
     appState: AppState,
-    snapshot: Readonly<Snapshot>,
     pop: () => HistoryEntry | null,
     push: (entry: HistoryEntry) => void,
   ): [SceneElementsMap, AppState] | void {
@@ -102,6 +100,10 @@ export class History {
         return;
       }
 
+      const action = CaptureUpdateAction.IMMEDIATELY;
+
+      let prevSnapshot = this.store.snapshot;
+
       let nextElements = elements;
       let nextAppState = appState;
       let containsVisibleChange = false;
@@ -110,9 +112,29 @@ export class History {
       while (historyEntry) {
         try {
           [nextElements, nextAppState, containsVisibleChange] =
-            historyEntry.applyTo(nextElements, nextAppState, snapshot);
+            StoreDelta.applyTo(
+              historyEntry,
+              nextElements,
+              nextAppState,
+              prevSnapshot,
+            );
+
+          const nextSnapshot = prevSnapshot.maybeClone(
+            action,
+            nextElements,
+            nextAppState,
+          );
+
+          // schedule immediate capture, so that it's emitted for the sync purposes
+          this.store.scheduleMicroAction({
+            action,
+            change: StoreChange.create(prevSnapshot, nextSnapshot),
+            delta: historyEntry,
+          });
+
+          prevSnapshot = nextSnapshot;
         } finally {
-          // make sure to always push / pop, even if the increment is corrupted
+          // make sure to always push, even if the delta is corrupted
           push(historyEntry);
         }
 
@@ -133,7 +155,7 @@ export class History {
     }
   }
 
-  private static pop(stack: HistoryStack): HistoryEntry | null {
+  private static pop(stack: HistoryEntry[]): HistoryEntry | null {
     if (!stack.length) {
       return null;
     }
@@ -148,63 +170,17 @@ export class History {
   }
 
   private static push(
-    stack: HistoryStack,
+    stack: HistoryEntry[],
     entry: HistoryEntry,
     prevElements: SceneElementsMap,
   ) {
-    const updatedEntry = entry.inverse().applyLatestChanges(prevElements);
-    return stack.push(updatedEntry);
-  }
-}
-
-export class HistoryEntry {
-  private constructor(
-    public readonly appStateChange: AppStateChange,
-    public readonly elementsChange: ElementsChange,
-  ) {}
-
-  public static create(
-    appStateChange: AppStateChange,
-    elementsChange: ElementsChange,
-  ) {
-    return new HistoryEntry(appStateChange, elementsChange);
-  }
-
-  public inverse(): HistoryEntry {
-    return new HistoryEntry(
-      this.appStateChange.inverse(),
-      this.elementsChange.inverse(),
+    const inversedEntry = HistoryEntry.inverse(entry);
+    const updatedEntry = HistoryEntry.applyLatestChanges(
+      inversedEntry,
+      prevElements,
+      "inserted",
     );
-  }
-
-  public applyTo(
-    elements: SceneElementsMap,
-    appState: AppState,
-    snapshot: Readonly<Snapshot>,
-  ): [SceneElementsMap, AppState, boolean] {
-    const [nextElements, elementsContainVisibleChange] =
-      this.elementsChange.applyTo(elements, snapshot.elements);
 
-    const [nextAppState, appStateContainsVisibleChange] =
-      this.appStateChange.applyTo(appState, nextElements);
-
-    const appliedVisibleChanges =
-      elementsContainVisibleChange || appStateContainsVisibleChange;
-
-    return [nextElements, nextAppState, appliedVisibleChanges];
-  }
-
-  /**
-   * Apply latest (remote) changes to the history entry, creates new instance of `HistoryEntry`.
-   */
-  public applyLatestChanges(elements: SceneElementsMap): HistoryEntry {
-    const updatedElementsChange =
-      this.elementsChange.applyLatestChanges(elements);
-
-    return HistoryEntry.create(this.appStateChange, updatedElementsChange);
-  }
-
-  public isEmpty(): boolean {
-    return this.appStateChange.isEmpty() && this.elementsChange.isEmpty();
+    return stack.push(updatedEntry);
   }
 }

package/package.json

@@ -1,11 +1,23 @@
 {
   "name": "@excalidraw/excalidraw",
-  "version": "0.18.0-817d8c5",
+  "version": "0.18.0-a30e1b2",
   "type": "module",
   "types": "./dist/types/excalidraw/index.d.ts",
   "main": "./dist/prod/index.js",
   "module": "./dist/prod/index.js",
   "exports": {
+    "./common/*": {
+      "types": "./dist/types/common/src/*.d.ts"
+    },
+    "./element/*": {
+      "types": "./dist/types/element/src/*.d.ts"
+    },
+    "./math/*": {
+      "types": "./dist/types/math/src/*.d.ts"
+    },
+    "./utils/*": {
+      "types": "./dist/types/utils/src/*.d.ts"
+    },
     "./*": {
       "types": "./dist/types/excalidraw/*.d.ts"
     },
@@ -64,7 +76,7 @@
     "@excalidraw/mermaid-to-excalidraw": "1.1.2",
     "@excalidraw/random-username": "1.1.0",
     "@radix-ui/react-popover": "1.1.6",
-    "@radix-ui/react-tabs": "1.0.2",
+    "@radix-ui/react-tabs": "1.1.3",
     "browser-fs-access": "0.29.1",
     "canvas-roundrect-polyfill": "0.0.1",
     "clsx": "1.1.1",
@@ -117,7 +129,7 @@
   "bugs": "https://github.com/excalidraw/excalidraw/issues",
   "homepage": "https://github.com/excalidraw/excalidraw/tree/master/packages/excalidraw",
   "scripts": {
-    "gen:types": "rm -rf types && tsc",
-    "build:esm": "rm -rf dist && node ../../scripts/buildPackage.js && yarn gen:types"
+    "gen:types": "rimraf types && tsc",
+    "build:esm": "rimraf dist && node ../../scripts/buildPackage.js && yarn gen:types"
   }
 }