@excalidraw/excalidraw 0.17.1-550a388 → 0.17.1-62228e0

package/dist/excalidraw/fonts/index.d.ts

@@ -0,0 +1,45 @@
+import type Scene from "../scene/Scene";
+import type { ExcalidrawTextElement, FontFamilyValues } from "../element/types";
+import { type FontMetadata } from "./metadata";
+import { type Font } from "./ExcalidrawFont";
+export declare class Fonts {
+    static readonly loadedFontsCache: Set<string>;
+    private static _registered;
+    static get registered(): Map<number, {
+        metadata: FontMetadata;
+        fontFaces: Font[];
+    }>;
+    get registered(): Map<number, {
+        metadata: FontMetadata;
+        fontFaces: Font[];
+    }>;
+    private readonly scene;
+    get sceneFamilies(): number[];
+    constructor({ scene }: {
+        scene: Scene;
+    });
+    /**
+     * if we load a (new) font, it's likely that text elements using it have
+     * already been rendered using a fallback font. Thus, we want invalidate
+     * their shapes and rerender. See #637.
+     *
+     * Invalidates text elements and rerenders scene, provided that at least one
+     * of the supplied fontFaces has not already been processed.
+     */
+    onLoaded: (fontFaces: readonly FontFace[]) => false | undefined;
+    load: () => Promise<void>;
+    /**
+     * WARN: should be called just once on init, even across multiple instances.
+     */
+    private static init;
+}
+/**
+ * Calculates vertical offset for a text with alphabetic baseline.
+ */
+export declare const getVerticalOffset: (fontFamily: ExcalidrawTextElement["fontFamily"], fontSize: ExcalidrawTextElement["fontSize"], lineHeightPx: number) => number;
+/**
+ * Gets line height forr a selected family.
+ */
+export declare const getLineHeight: (fontFamily: FontFamilyValues) => number & {
+    _brand: "unitlessLineHeight";
+};

package/dist/excalidraw/fonts/index.js

@@ -0,0 +1,202 @@
+import { ShapeCache } from "../scene/ShapeCache";
+import { isTextElement } from "../element";
+import { getFontString } from "../utils";
+import { FONT_FAMILY } from "../constants";
+import { LOCAL_FONT_PROTOCOL, FONT_METADATA, RANGES, } from "./metadata";
+import { ExcalidrawFont } from "./ExcalidrawFont";
+import { getContainerElement } from "../element/textElement";
+import Virgil from "./assets/Virgil-Regular.woff2";
+import Excalifont from "./assets/Excalifont-Regular.woff2";
+import Cascadia from "./assets/CascadiaMono-Regular.woff2";
+import ComicShanns from "./assets/ComicShanns-Regular.woff2";
+import LiberationSans from "./assets/LiberationSans-Regular.woff2";
+import LilitaLatin from "https://fonts.gstatic.com/s/lilitaone/v15/i7dPIFZ9Zz-WBtRtedDbYEF8RXi4EwQ.woff2";
+import LilitaLatinExt from "https://fonts.gstatic.com/s/lilitaone/v15/i7dPIFZ9Zz-WBtRtedDbYE98RXi4EwSsbg.woff2";
+import NunitoLatin from "https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTQ3j6zbXWjgeg.woff2";
+import NunitoLatinExt from "https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTo3j6zbXWjgevT5.woff2";
+import NunitoCyrilic from "https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTA3j6zbXWjgevT5.woff2";
+import NunitoCyrilicExt from "https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTk3j6zbXWjgevT5.woff2";
+import NunitoVietnamese from "https://fonts.gstatic.com/s/nunito/v26/XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTs3j6zbXWjgevT5.woff2";
+export class Fonts {
+    // it's ok to track fonts across multiple instances only once, so let's use
+    // a static member to reduce memory footprint
+    static loadedFontsCache = new Set();
+    static _registered;
+    static get registered() {
+        if (!Fonts._registered) {
+            // lazy load the fonts
+            Fonts._registered = Fonts.init();
+        }
+        return Fonts._registered;
+    }
+    get registered() {
+        return Fonts.registered;
+    }
+    scene;
+    get sceneFamilies() {
+        return Array.from(this.scene.getNonDeletedElements().reduce((families, element) => {
+            if (isTextElement(element)) {
+                families.add(element.fontFamily);
+            }
+            return families;
+        }, new Set()));
+    }
+    constructor({ scene }) {
+        this.scene = scene;
+    }
+    /**
+     * if we load a (new) font, it's likely that text elements using it have
+     * already been rendered using a fallback font. Thus, we want invalidate
+     * their shapes and rerender. See #637.
+     *
+     * Invalidates text elements and rerenders scene, provided that at least one
+     * of the supplied fontFaces has not already been processed.
+     */
+    onLoaded = (fontFaces) => {
+        if (
+        // bail if all fonts with have been processed. We're checking just a
+        // subset of the font properties (though it should be enough), so it
+        // can technically bail on a false positive.
+        fontFaces.every((fontFace) => {
+            const sig = `${fontFace.family}-${fontFace.style}-${fontFace.weight}-${fontFace.unicodeRange}`;
+            if (Fonts.loadedFontsCache.has(sig)) {
+                return true;
+            }
+            Fonts.loadedFontsCache.add(sig);
+            return false;
+        })) {
+            return false;
+        }
+        let didUpdate = false;
+        const elementsMap = this.scene.getNonDeletedElementsMap();
+        for (const element of this.scene.getNonDeletedElements()) {
+            if (isTextElement(element)) {
+                didUpdate = true;
+                ShapeCache.delete(element);
+                const container = getContainerElement(element, elementsMap);
+                if (container) {
+                    ShapeCache.delete(container);
+                }
+            }
+        }
+        if (didUpdate) {
+            this.scene.triggerUpdate();
+        }
+    };
+    load = async () => {
+        // Add all registered font faces into the `document.fonts` (if not added already)
+        for (const { fontFaces } of Fonts.registered.values()) {
+            for (const { fontFace, url } of fontFaces) {
+                if (url.protocol !== LOCAL_FONT_PROTOCOL &&
+                    !window.document.fonts.has(fontFace)) {
+                    window.document.fonts.add(fontFace);
+                }
+            }
+        }
+        const loaded = await Promise.all(this.sceneFamilies.map(async (fontFamily) => {
+            const fontString = getFontString({
+                fontFamily,
+                fontSize: 16,
+            });
+            // WARN: without "text" param it does not have to mean that all font faces are loaded, instead it could be just one!
+            if (!window.document.fonts.check(fontString)) {
+                try {
+                    // WARN: browser prioritizes loading only font faces with unicode ranges for characters which are present in the document (html & canvas), other font faces could stay unloaded
+                    // we might want to retry here, i.e.  in case CDN is down, but so far I didn't experience any issues - maybe it handles retry-like logic under the hood
+                    return await window.document.fonts.load(fontString);
+                }
+                catch (e) {
+                    // don't let it all fail if just one font fails to load
+                    console.error(`Failed to load font: "${fontString}" with error "${e}", given the following registered font:`, JSON.stringify(Fonts.registered.get(fontFamily), undefined, 2));
+                }
+            }
+            return Promise.resolve();
+        }));
+        this.onLoaded(loaded.flat().filter(Boolean));
+    };
+    /**
+     * WARN: should be called just once on init, even across multiple instances.
+     */
+    static init() {
+        const fonts = {
+            registered: new Map(),
+        };
+        const _register = register.bind(fonts);
+        _register("Virgil", FONT_METADATA[FONT_FAMILY.Virgil], {
+            uri: Virgil,
+        });
+        _register("Excalifont", FONT_METADATA[FONT_FAMILY.Excalifont], {
+            uri: Excalifont,
+        });
+        // keeping for backwards compatibility reasons, uses system font (Helvetica on MacOS, Arial on Win)
+        _register("Helvetica", FONT_METADATA[FONT_FAMILY.Helvetica], {
+            uri: LOCAL_FONT_PROTOCOL,
+        });
+        // used for server-side pdf & png export instead of helvetica (technically does not need metrics, but kept in for consistency)
+        _register("Liberation Sans", FONT_METADATA[FONT_FAMILY["Liberation Sans"]], {
+            uri: LiberationSans,
+        });
+        _register("Cascadia", FONT_METADATA[FONT_FAMILY.Cascadia], {
+            uri: Cascadia,
+        });
+        _register("Comic Shanns", FONT_METADATA[FONT_FAMILY["Comic Shanns"]], {
+            uri: ComicShanns,
+        });
+        _register("Lilita One", FONT_METADATA[FONT_FAMILY["Lilita One"]], { uri: LilitaLatinExt, descriptors: { unicodeRange: RANGES.LATIN_EXT } }, { uri: LilitaLatin, descriptors: { unicodeRange: RANGES.LATIN } });
+        _register("Nunito", FONT_METADATA[FONT_FAMILY.Nunito], {
+            uri: NunitoCyrilicExt,
+            descriptors: { unicodeRange: RANGES.CYRILIC_EXT, weight: "500" },
+        }, {
+            uri: NunitoCyrilic,
+            descriptors: { unicodeRange: RANGES.CYRILIC, weight: "500" },
+        }, {
+            uri: NunitoVietnamese,
+            descriptors: { unicodeRange: RANGES.VIETNAMESE, weight: "500" },
+        }, {
+            uri: NunitoLatinExt,
+            descriptors: { unicodeRange: RANGES.LATIN_EXT, weight: "500" },
+        }, {
+            uri: NunitoLatin,
+            descriptors: { unicodeRange: RANGES.LATIN, weight: "500" },
+        });
+        return fonts.registered;
+    }
+}
+/**
+ * Register a new font.
+ *
+ * @param family font family
+ * @param metadata font metadata
+ * @param params array of the rest of the FontFace parameters [uri: string, descriptors: FontFaceDescriptors?] ,
+ */
+function register(family, metadata, ...params) {
+    // TODO: likely we will need to abandon number "id" in order to support custom fonts
+    const familyId = FONT_FAMILY[family];
+    const registeredFamily = this.registered.get(familyId);
+    if (!registeredFamily) {
+        this.registered.set(familyId, {
+            metadata,
+            fontFaces: params.map(({ uri, descriptors }) => new ExcalidrawFont(family, uri, descriptors)),
+        });
+    }
+    return this.registered;
+}
+/**
+ * Calculates vertical offset for a text with alphabetic baseline.
+ */
+export const getVerticalOffset = (fontFamily, fontSize, lineHeightPx) => {
+    const { unitsPerEm, ascender, descender } = Fonts.registered.get(fontFamily)?.metadata.metrics ||
+        FONT_METADATA[FONT_FAMILY.Virgil].metrics;
+    const fontSizeEm = fontSize / unitsPerEm;
+    const lineGap = (lineHeightPx - fontSizeEm * ascender + fontSizeEm * descender) / 2;
+    const verticalOffset = fontSizeEm * ascender + lineGap;
+    return verticalOffset;
+};
+/**
+ * Gets line height forr a selected family.
+ */
+export const getLineHeight = (fontFamily) => {
+    const { lineHeight } = Fonts.registered.get(fontFamily)?.metadata.metrics ||
+        FONT_METADATA[FONT_FAMILY.Excalifont].metrics;
+    return lineHeight;
+};

package/dist/excalidraw/fonts/metadata.d.ts

@@ -0,0 +1,34 @@
+/// <reference types="react" />
+/**
+ * Encapsulates font metrics with additional font metadata.
+ * */
+export interface FontMetadata {
+    /** for head & hhea metrics read the woff2 with https://fontdrop.info/ */
+    metrics: {
+        /** head.unitsPerEm metric */
+        unitsPerEm: 1000 | 1024 | 2048;
+        /** hhea.ascender metric */
+        ascender: number;
+        /** hhea.descender metric */
+        descender: number;
+        /** harcoded unitless line-height, https://github.com/excalidraw/excalidraw/pull/6360#issuecomment-1477635971 */
+        lineHeight: number;
+    };
+    /** element to be displayed as an icon  */
+    icon: JSX.Element;
+    /** flag to indicate a deprecated font */
+    deprecated?: true;
+    /** flag to indicate a server-side only font */
+    serverSide?: true;
+}
+export declare const FONT_METADATA: Record<number, FontMetadata>;
+/** Unicode ranges */
+export declare const RANGES: {
+    LATIN: string;
+    LATIN_EXT: string;
+    CYRILIC_EXT: string;
+    CYRILIC: string;
+    VIETNAMESE: string;
+};
+/** local protocol to skip the local font from registering or inlining */
+export declare const LOCAL_FONT_PROTOCOL = "local:";

package/dist/excalidraw/fonts/metadata.js

@@ -0,0 +1,90 @@
+import { FontFamilyCodeIcon, FontFamilyHeadingIcon, FontFamilyNormalIcon, FreedrawIcon, } from "../components/icons";
+import { FONT_FAMILY } from "../constants";
+export const FONT_METADATA = {
+    [FONT_FAMILY.Excalifont]: {
+        metrics: {
+            unitsPerEm: 1000,
+            ascender: 886,
+            descender: -374,
+            lineHeight: 1.25,
+        },
+        icon: FreedrawIcon,
+    },
+    [FONT_FAMILY.Nunito]: {
+        metrics: {
+            unitsPerEm: 1000,
+            ascender: 1011,
+            descender: -353,
+            lineHeight: 1.35,
+        },
+        icon: FontFamilyNormalIcon,
+    },
+    [FONT_FAMILY["Lilita One"]]: {
+        metrics: {
+            unitsPerEm: 1000,
+            ascender: 923,
+            descender: -220,
+            lineHeight: 1.15,
+        },
+        icon: FontFamilyHeadingIcon,
+    },
+    [FONT_FAMILY["Comic Shanns"]]: {
+        metrics: {
+            unitsPerEm: 1000,
+            ascender: 750,
+            descender: -250,
+            lineHeight: 1.25,
+        },
+        icon: FontFamilyCodeIcon,
+    },
+    [FONT_FAMILY.Virgil]: {
+        metrics: {
+            unitsPerEm: 1000,
+            ascender: 886,
+            descender: -374,
+            lineHeight: 1.25,
+        },
+        icon: FreedrawIcon,
+        deprecated: true,
+    },
+    [FONT_FAMILY.Helvetica]: {
+        metrics: {
+            unitsPerEm: 2048,
+            ascender: 1577,
+            descender: -471,
+            lineHeight: 1.15,
+        },
+        icon: FontFamilyNormalIcon,
+        deprecated: true,
+    },
+    [FONT_FAMILY.Cascadia]: {
+        metrics: {
+            unitsPerEm: 2048,
+            ascender: 1900,
+            descender: -480,
+            lineHeight: 1.2,
+        },
+        icon: FontFamilyCodeIcon,
+        deprecated: true,
+    },
+    [FONT_FAMILY["Liberation Sans"]]: {
+        metrics: {
+            unitsPerEm: 2048,
+            ascender: 1854,
+            descender: -434,
+            lineHeight: 1.15,
+        },
+        icon: FontFamilyNormalIcon,
+        serverSide: true,
+    },
+};
+/** Unicode ranges */
+export const RANGES = {
+    LATIN: "U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD",
+    LATIN_EXT: "U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF",
+    CYRILIC_EXT: "U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F",
+    CYRILIC: "U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116",
+    VIETNAMESE: "U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB",
+};
+/** local protocol to skip the local font from registering or inlining */
+export const LOCAL_FONT_PROTOCOL = "local:";

package/dist/excalidraw/fractionalIndex.d.ts

@@ -0,0 +1,40 @@
+import type { ExcalidrawElement, OrderedExcalidrawElement } from "./element/types";
+/**
+ * Envisioned relation between array order and fractional indices:
+ *
+ * 1) Array (or array-like ordered data structure) should be used as a cache of elements order, hiding the internal fractional indices implementation.
+ * - it's undesirable to perform reorder for each related operation, therefore it's necessary to cache the order defined by fractional indices into an ordered data structure
+ * - it's easy enough to define the order of the elements from the outside (boundaries), without worrying about the underlying structure of fractional indices (especially for the host apps)
+ * - it's necessary to always keep the array support for backwards compatibility (restore) - old scenes, old libraries, supporting multiple excalidraw versions etc.
+ * - it's necessary to always keep the fractional indices in sync with the array order
+ * - elements with invalid indices should be detected and synced, without altering the already valid indices
+ *
+ * 2) Fractional indices should be used to reorder the elements, whenever the cached order is expected to be invalidated.
+ * - as the fractional indices are encoded as part of the elements, it opens up possibilities for incremental-like APIs
+ * - re-order based on fractional indices should be part of (multiplayer) operations such as reconciliation & undo/redo
+ * - technically all the z-index actions could perform also re-order based on fractional indices,but in current state it would not bring much benefits,
+ *   as it's faster & more efficient to perform re-order based on array manipulation and later synchronisation of moved indices with the array order
+ */
+/**
+ * Ensure that all elements have valid fractional indices.
+ *
+ * @throws `InvalidFractionalIndexError` if invalid index is detected.
+ */
+export declare const validateFractionalIndices: (indices: (ExcalidrawElement["index"] | undefined)[]) => void;
+/**
+ * Order the elements based on the fractional indices.
+ * - when fractional indices are identical, break the tie based on the element id
+ * - when there is no fractional index in one of the elements, respect the order of the array
+ */
+export declare const orderByFractionalIndex: (elements: OrderedExcalidrawElement[]) => OrderedExcalidrawElement[];
+/**
+ * Synchronizes invalid fractional indices of moved elements with the array order by mutating passed elements.
+ * If the synchronization fails or the result is invalid, it fallbacks to `syncInvalidIndices`.
+ */
+export declare const syncMovedIndices: (elements: readonly ExcalidrawElement[], movedElements: Map<string, ExcalidrawElement>) => OrderedExcalidrawElement[];
+/**
+ * Synchronizes all invalid fractional indices with the array order by mutating passed elements.
+ *
+ * WARN: in edge cases it could modify the elements which were not moved, as it's impossible to guess the actually moved elements from the elements array itself.
+ */
+export declare const syncInvalidIndices: (elements: readonly ExcalidrawElement[]) => OrderedExcalidrawElement[];

package/dist/excalidraw/fractionalIndex.js

@@ -0,0 +1,239 @@
+import { generateNKeysBetween } from "fractional-indexing";
+import { mutateElement } from "./element/mutateElement";
+import { InvalidFractionalIndexError } from "./errors";
+/**
+ * Envisioned relation between array order and fractional indices:
+ *
+ * 1) Array (or array-like ordered data structure) should be used as a cache of elements order, hiding the internal fractional indices implementation.
+ * - it's undesirable to perform reorder for each related operation, therefore it's necessary to cache the order defined by fractional indices into an ordered data structure
+ * - it's easy enough to define the order of the elements from the outside (boundaries), without worrying about the underlying structure of fractional indices (especially for the host apps)
+ * - it's necessary to always keep the array support for backwards compatibility (restore) - old scenes, old libraries, supporting multiple excalidraw versions etc.
+ * - it's necessary to always keep the fractional indices in sync with the array order
+ * - elements with invalid indices should be detected and synced, without altering the already valid indices
+ *
+ * 2) Fractional indices should be used to reorder the elements, whenever the cached order is expected to be invalidated.
+ * - as the fractional indices are encoded as part of the elements, it opens up possibilities for incremental-like APIs
+ * - re-order based on fractional indices should be part of (multiplayer) operations such as reconciliation & undo/redo
+ * - technically all the z-index actions could perform also re-order based on fractional indices,but in current state it would not bring much benefits,
+ *   as it's faster & more efficient to perform re-order based on array manipulation and later synchronisation of moved indices with the array order
+ */
+/**
+ * Ensure that all elements have valid fractional indices.
+ *
+ * @throws `InvalidFractionalIndexError` if invalid index is detected.
+ */
+export const validateFractionalIndices = (indices) => {
+    for (const [i, index] of indices.entries()) {
+        const predecessorIndex = indices[i - 1];
+        const successorIndex = indices[i + 1];
+        if (!isValidFractionalIndex(index, predecessorIndex, successorIndex)) {
+            throw new InvalidFractionalIndexError(`Fractional indices invariant for element has been compromised - ["${predecessorIndex}", "${index}", "${successorIndex}"] [predecessor, current, successor]`);
+        }
+    }
+};
+/**
+ * Order the elements based on the fractional indices.
+ * - when fractional indices are identical, break the tie based on the element id
+ * - when there is no fractional index in one of the elements, respect the order of the array
+ */
+export const orderByFractionalIndex = (elements) => {
+    return elements.sort((a, b) => {
+        // in case the indices are not the defined at runtime
+        if (isOrderedElement(a) && isOrderedElement(b)) {
+            if (a.index < b.index) {
+                return -1;
+            }
+            else if (a.index > b.index) {
+                return 1;
+            }
+            // break ties based on the element id
+            return a.id < b.id ? -1 : 1;
+        }
+        // defensively keep the array order
+        return 1;
+    });
+};
+/**
+ * Synchronizes invalid fractional indices of moved elements with the array order by mutating passed elements.
+ * If the synchronization fails or the result is invalid, it fallbacks to `syncInvalidIndices`.
+ */
+export const syncMovedIndices = (elements, movedElements) => {
+    try {
+        const indicesGroups = getMovedIndicesGroups(elements, movedElements);
+        // try generatating indices, throws on invalid movedElements
+        const elementsUpdates = generateIndices(elements, indicesGroups);
+        // ensure next indices are valid before mutation, throws on invalid ones
+        validateFractionalIndices(elements.map((x) => elementsUpdates.get(x)?.index || x.index));
+        // split mutation so we don't end up in an incosistent state
+        for (const [element, update] of elementsUpdates) {
+            mutateElement(element, update, false);
+        }
+    }
+    catch (e) {
+        // fallback to default sync
+        syncInvalidIndices(elements);
+    }
+    return elements;
+};
+/**
+ * Synchronizes all invalid fractional indices with the array order by mutating passed elements.
+ *
+ * WARN: in edge cases it could modify the elements which were not moved, as it's impossible to guess the actually moved elements from the elements array itself.
+ */
+export const syncInvalidIndices = (elements) => {
+    const indicesGroups = getInvalidIndicesGroups(elements);
+    const elementsUpdates = generateIndices(elements, indicesGroups);
+    for (const [element, update] of elementsUpdates) {
+        mutateElement(element, update, false);
+    }
+    return elements;
+};
+/**
+ * Get contiguous groups of indices of passed moved elements.
+ *
+ * NOTE: First and last elements within the groups are indices of lower and upper bounds.
+ */
+const getMovedIndicesGroups = (elements, movedElements) => {
+    const indicesGroups = [];
+    let i = 0;
+    while (i < elements.length) {
+        if (movedElements.has(elements[i].id)) {
+            const indicesGroup = [i - 1, i]; // push the lower bound index as the first item
+            while (++i < elements.length) {
+                if (!movedElements.has(elements[i].id)) {
+                    break;
+                }
+                indicesGroup.push(i);
+            }
+            indicesGroup.push(i); // push the upper bound index as the last item
+            indicesGroups.push(indicesGroup);
+        }
+        else {
+            i++;
+        }
+    }
+    return indicesGroups;
+};
+/**
+ * Gets contiguous groups of all invalid indices automatically detected inside the elements array.
+ *
+ * WARN: First and last items within the groups do NOT have to be contiguous, those are the found lower and upper bounds!
+ */
+const getInvalidIndicesGroups = (elements) => {
+    const indicesGroups = [];
+    // once we find lowerBound / upperBound, it cannot be lower than that, so we cache it for better perf.
+    let lowerBound = undefined;
+    let upperBound = undefined;
+    let lowerBoundIndex = -1;
+    let upperBoundIndex = 0;
+    /** @returns maybe valid lowerBound */
+    const getLowerBound = (index) => {
+        const lowerBound = elements[lowerBoundIndex]
+            ? elements[lowerBoundIndex].index
+            : undefined;
+        // we are already iterating left to right, therefore there is no need for additional looping
+        const candidate = elements[index - 1]?.index;
+        if ((!lowerBound && candidate) || // first lowerBound
+            (lowerBound && candidate && candidate > lowerBound) // next lowerBound
+        ) {
+            // WARN: candidate's index could be higher or same as the current element's index
+            return [candidate, index - 1];
+        }
+        // cache hit! take the last lower bound
+        return [lowerBound, lowerBoundIndex];
+    };
+    /** @returns always valid upperBound */
+    const getUpperBound = (index) => {
+        const upperBound = elements[upperBoundIndex]
+            ? elements[upperBoundIndex].index
+            : undefined;
+        // cache hit! don't let it find the upper bound again
+        if (upperBound && index < upperBoundIndex) {
+            return [upperBound, upperBoundIndex];
+        }
+        // set the current upperBoundIndex as the starting point
+        let i = upperBoundIndex;
+        while (++i < elements.length) {
+            const candidate = elements[i]?.index;
+            if ((!upperBound && candidate) || // first upperBound
+                (upperBound && candidate && candidate > upperBound) // next upperBound
+            ) {
+                return [candidate, i];
+            }
+        }
+        // we reached the end, sky is the limit
+        return [undefined, i];
+    };
+    let i = 0;
+    while (i < elements.length) {
+        const current = elements[i].index;
+        [lowerBound, lowerBoundIndex] = getLowerBound(i);
+        [upperBound, upperBoundIndex] = getUpperBound(i);
+        if (!isValidFractionalIndex(current, lowerBound, upperBound)) {
+            // push the lower bound index as the first item
+            const indicesGroup = [lowerBoundIndex, i];
+            while (++i < elements.length) {
+                const current = elements[i].index;
+                const [nextLowerBound, nextLowerBoundIndex] = getLowerBound(i);
+                const [nextUpperBound, nextUpperBoundIndex] = getUpperBound(i);
+                if (isValidFractionalIndex(current, nextLowerBound, nextUpperBound)) {
+                    break;
+                }
+                // assign bounds only for the moved elements
+                [lowerBound, lowerBoundIndex] = [nextLowerBound, nextLowerBoundIndex];
+                [upperBound, upperBoundIndex] = [nextUpperBound, nextUpperBoundIndex];
+                indicesGroup.push(i);
+            }
+            // push the upper bound index as the last item
+            indicesGroup.push(upperBoundIndex);
+            indicesGroups.push(indicesGroup);
+        }
+        else {
+            i++;
+        }
+    }
+    return indicesGroups;
+};
+const isValidFractionalIndex = (index, predecessor, successor) => {
+    if (!index) {
+        return false;
+    }
+    if (predecessor && successor) {
+        return predecessor < index && index < successor;
+    }
+    if (!predecessor && successor) {
+        // first element
+        return index < successor;
+    }
+    if (predecessor && !successor) {
+        // last element
+        return predecessor < index;
+    }
+    // only element in the array
+    return !!index;
+};
+const generateIndices = (elements, indicesGroups) => {
+    const elementsUpdates = new Map();
+    for (const indices of indicesGroups) {
+        const lowerBoundIndex = indices.shift();
+        const upperBoundIndex = indices.pop();
+        const fractionalIndices = generateNKeysBetween(elements[lowerBoundIndex]?.index, elements[upperBoundIndex]?.index, indices.length);
+        for (let i = 0; i < indices.length; i++) {
+            const element = elements[indices[i]];
+            elementsUpdates.set(element, {
+                index: fractionalIndices[i],
+            });
+        }
+    }
+    return elementsUpdates;
+};
+const isOrderedElement = (element) => {
+    // for now it's sufficient whether the index is there
+    // meaning, the element was already ordered in the past
+    // meaning, it is not a newly inserted element, not an unrestored element, etc.
+    // it does not have to mean that the index itself is valid
+    if (element.index) {
+        return true;
+    }
+    return false;
+};

package/dist/excalidraw/frame.d.ts

@@ -1,8 +1,8 @@
-import { ElementsMap, ElementsMapOrArray, ExcalidrawElement, ExcalidrawFrameLikeElement, NonDeleted, NonDeletedExcalidrawElement } from "./element/types";
-import { AppClassProperties, AppState, StaticCanvasAppState } from "./types";
+import type { ElementsMap, ElementsMapOrArray, ExcalidrawElement, ExcalidrawFrameLikeElement, NonDeleted, NonDeletedExcalidrawElement } from "./element/types";
+import type { AppClassProperties, AppState, StaticCanvasAppState } from "./types";
 import type { ExcalidrawElementsIncludingDeleted } from "./scene/Scene";
-import { ReadonlySetLike } from "./utility-types";
-export declare const bindElementsToFramesAfterDuplication: (nextElements: ExcalidrawElement[], oldElements: readonly ExcalidrawElement[], oldIdToDuplicatedId: Map<ExcalidrawElement["id"], ExcalidrawElement["id"]>) => void;
+import type { ReadonlySetLike } from "./utility-types";
+export declare const bindElementsToFramesAfterDuplication: (nextElements: readonly ExcalidrawElement[], oldElements: readonly ExcalidrawElement[], oldIdToDuplicatedId: Map<ExcalidrawElement["id"], ExcalidrawElement["id"]>) => void;
 export declare function isElementIntersectingFrame(element: ExcalidrawElement, frame: ExcalidrawFrameLikeElement, elementsMap: ElementsMap): boolean;
 export declare const getElementsCompletelyInFrame: (elements: readonly ExcalidrawElement[], frame: ExcalidrawFrameLikeElement, elementsMap: ElementsMap) => ExcalidrawElement[];
 export declare const isElementContainingFrame: (elements: readonly ExcalidrawElement[], element: ExcalidrawElement, frame: ExcalidrawFrameLikeElement, elementsMap: ElementsMap) => boolean;

package/dist/excalidraw/gatransforms.d.ts

@@ -1,4 +1,4 @@
-import { Line, Direction, Point } from "./ga";
+import type { Line, Direction, Point } from "./ga";
 /**
  * TODO: docs
  */