refactor: auto ordered imports (#9163)

packages/excalidraw/actions/actionAddToLibrary.ts

@@ -1,10 +1,11 @@
-import { register } from "./register";
-import { deepCopyElement } from "../element/newElement";
-import { randomId } from "../random";
-import { t } from "../i18n";
 import { LIBRARY_DISABLED_TYPES } from "../constants";
+import { deepCopyElement } from "../element/newElement";
+import { t } from "../i18n";
+import { randomId } from "../random";
 import { CaptureUpdateAction } from "../store";
 
+import { register } from "./register";
+
 export const actionAddToLibrary = register({
   name: "addToLibrary",
   trackEvent: { category: "element" },

packages/excalidraw/actions/actionAlign.tsx

@@ -1,5 +1,5 @@
-import type { Alignment } from "../align";
 import { alignElements } from "../align";
+import { ToolButton } from "../components/ToolButton";
 import {
   AlignBottomIcon,
   AlignLeftIcon,
@@ -8,19 +8,21 @@ import {
   CenterHorizontallyIcon,
   CenterVerticallyIcon,
 } from "../components/icons";
-import { ToolButton } from "../components/ToolButton";
 import { getNonDeletedElements } from "../element";
 import { isFrameLikeElement } from "../element/typeChecks";
-import type { ExcalidrawElement } from "../element/types";
 import { updateFrameMembershipOfSelectedElements } from "../frame";
 import { t } from "../i18n";
 import { KEYS } from "../keys";
 import { isSomeElementSelected } from "../scene";
 import { CaptureUpdateAction } from "../store";
-import type { AppClassProperties, AppState, UIAppState } from "../types";
 import { arrayToMap, getShortcutKey } from "../utils";
+
 import { register } from "./register";
 
+import type { Alignment } from "../align";
+import type { ExcalidrawElement } from "../element/types";
+import type { AppClassProperties, AppState, UIAppState } from "../types";
+
 export const alignActionsPredicate = (
   appState: UIAppState,
   app: AppClassProperties,

packages/excalidraw/actions/actionBoundText.tsx

@@ -5,6 +5,11 @@ import {
   VERTICAL_ALIGN,
 } from "../constants";
 import { isTextElement, newElement } from "../element";
+import {
+  getOriginalContainerHeightFromCache,
+  resetOriginalContainerCache,
+  updateOriginalContainerCache,
+} from "../element/containerCache";
 import { mutateElement } from "../element/mutateElement";
 import {
   computeBoundTextPosition,
@@ -12,16 +17,18 @@ import {
   getBoundTextElement,
   redrawTextBoundingBox,
 } from "../element/textElement";
-import {
-  getOriginalContainerHeightFromCache,
-  resetOriginalContainerCache,
-  updateOriginalContainerCache,
-} from "../element/containerCache";
+import { measureText } from "../element/textMeasurements";
 import {
   hasBoundTextElement,
   isTextBindableContainer,
   isUsingAdaptiveRadius,
 } from "../element/typeChecks";
+import { syncMovedIndices } from "../fractionalIndex";
+import { CaptureUpdateAction } from "../store";
+import { arrayToMap, getFontString } from "../utils";
+
+import { register } from "./register";
+
 import type {
   ExcalidrawElement,
   ExcalidrawLinearElement,
@@ -30,11 +37,6 @@ import type {
 } from "../element/types";
 import type { AppState } from "../types";
 import type { Mutable } from "../utility-types";
-import { arrayToMap, getFontString } from "../utils";
-import { register } from "./register";
-import { syncMovedIndices } from "../fractionalIndex";
-import { CaptureUpdateAction } from "../store";
-import { measureText } from "../element/textMeasurements";
 
 export const actionUnbindText = register({
   name: "unbindText",

packages/excalidraw/actions/actionCanvas.tsx

@@ -1,4 +1,14 @@
+import { clamp, roundToStep } from "@excalidraw/math";
+
+import {
+  getDefaultAppState,
+  isEraserActive,
+  isHandToolActive,
+} from "../appState";
+import { DEFAULT_CANVAS_BACKGROUND_PICKS } from "../colors";
 import { ColorPicker } from "../components/ColorPicker/ColorPicker";
+import { ToolButton } from "../components/ToolButton";
+import { Tooltip } from "../components/Tooltip";
 import {
   handIcon,
   MoonIcon,
@@ -9,7 +19,6 @@ import {
   ZoomOutIcon,
   ZoomResetIcon,
 } from "../components/icons";
-import { ToolButton } from "../components/ToolButton";
 import {
   CURSOR_TYPE,
   MAX_ZOOM,
@@ -17,28 +26,22 @@ import {
   THEME,
   ZOOM_STEP,
 } from "../constants";
+import { setCursor } from "../cursor";
 import { getCommonBounds, getNonDeletedElements } from "../element";
-import type { ExcalidrawElement } from "../element/types";
+import { newElementWith } from "../element/mutateElement";
 import { t } from "../i18n";
 import { CODES, KEYS } from "../keys";
 import { getNormalizedZoom } from "../scene";
 import { centerScrollOn } from "../scene/scroll";
 import { getStateForZoom } from "../scene/zoom";
-import type { AppState, Offsets } from "../types";
-import { getShortcutKey, updateActiveTool } from "../utils";
-import { register } from "./register";
-import { Tooltip } from "../components/Tooltip";
-import { newElementWith } from "../element/mutateElement";
-import {
-  getDefaultAppState,
-  isEraserActive,
-  isHandToolActive,
-} from "../appState";
-import { DEFAULT_CANVAS_BACKGROUND_PICKS } from "../colors";
-import type { SceneBounds } from "../element/bounds";
-import { setCursor } from "../cursor";
 import { CaptureUpdateAction } from "../store";
-import { clamp, roundToStep } from "@excalidraw/math";
+import { getShortcutKey, updateActiveTool } from "../utils";
+
+import { register } from "./register";
+
+import type { SceneBounds } from "../element/bounds";
+import type { ExcalidrawElement } from "../element/types";
+import type { AppState, Offsets } from "../types";
 
 export const actionChangeViewBackgroundColor = register({
   name: "changeViewBackgroundColor",

packages/excalidraw/actions/actionClipboard.tsx

@@ -1,5 +1,3 @@
-import { CODES, KEYS } from "../keys";
-import { register } from "./register";
 import {
   copyTextToSystemClipboard,
   copyToClipboard,
@@ -8,14 +6,17 @@ import {
   probablySupportsClipboardWriteText,
   readSystemClipboard,
 } from "../clipboard";
-import { actionDeleteSelected } from "./actionDeleteSelected";
+import { DuplicateIcon, cutIcon, pngIcon, svgIcon } from "../components/icons";
+import { isFirefox } from "../constants";
 import { exportCanvas, prepareElementsForExport } from "../data/index";
 import { getTextFromElements, isTextElement } from "../element";
 import { t } from "../i18n";
-import { isFirefox } from "../constants";
-import { DuplicateIcon, cutIcon, pngIcon, svgIcon } from "../components/icons";
+import { CODES, KEYS } from "../keys";
 import { CaptureUpdateAction } from "../store";
 
+import { actionDeleteSelected } from "./actionDeleteSelected";
+import { register } from "./register";
+
 export const actionCopy = register({
   name: "copy",
   label: "labels.copy",

packages/excalidraw/actions/actionCropEditor.tsx

@@ -1,9 +1,11 @@
-import { register } from "./register";
-import { cropIcon } from "../components/icons";
-import { CaptureUpdateAction } from "../store";
 import { ToolButton } from "../components/ToolButton";
-import { t } from "../i18n";
+import { cropIcon } from "../components/icons";
 import { isImageElement } from "../element/typeChecks";
+import { t } from "../i18n";
+import { CaptureUpdateAction } from "../store";
+
+import { register } from "./register";
+
 import type { ExcalidrawImageElement } from "../element/types";
 
 export const actionToggleCropEditor = register({

packages/excalidraw/actions/actionDeleteSelected.test.tsx

@@ -1,7 +1,9 @@
 import React from "react";
+
 import { Excalidraw, mutateElement } from "../index";
-import { act, assertElements, render } from "../tests/test-utils";
 import { API } from "../tests/helpers/api";
+import { act, assertElements, render } from "../tests/test-utils";
+
 import { actionDeleteSelected } from "./actionDeleteSelected";
 
 const { h } = window;

packages/excalidraw/actions/actionDeleteSelected.tsx

@@ -1,25 +1,27 @@
-import { getSelectedElements, isSomeElementSelected } from "../scene";
-import { KEYS } from "../keys";
 import { ToolButton } from "../components/ToolButton";
-import { t } from "../i18n";
-import { register } from "./register";
+import { TrashIcon } from "../components/icons";
 import { getNonDeletedElements } from "../element";
-import type { ExcalidrawElement } from "../element/types";
-import type { AppClassProperties, AppState } from "../types";
-import { mutateElement, newElementWith } from "../element/mutateElement";
-import { getElementsInGroup, selectGroupsForSelectedElements } from "../groups";
-import { LinearElementEditor } from "../element/linearElementEditor";
 import { fixBindingsAfterDeletion } from "../element/binding";
+import { LinearElementEditor } from "../element/linearElementEditor";
+import { mutateElement, newElementWith } from "../element/mutateElement";
+import { getContainerElement } from "../element/textElement";
 import {
   isBoundToContainer,
   isElbowArrow,
   isFrameLikeElement,
 } from "../element/typeChecks";
-import { updateActiveTool } from "../utils";
-import { TrashIcon } from "../components/icons";
-import { CaptureUpdateAction } from "../store";
-import { getContainerElement } from "../element/textElement";
 import { getFrameChildren } from "../frame";
+import { getElementsInGroup, selectGroupsForSelectedElements } from "../groups";
+import { t } from "../i18n";
+import { KEYS } from "../keys";
+import { getSelectedElements, isSomeElementSelected } from "../scene";
+import { CaptureUpdateAction } from "../store";
+import { updateActiveTool } from "../utils";
+
+import { register } from "./register";
+
+import type { ExcalidrawElement } from "../element/types";
+import type { AppClassProperties, AppState } from "../types";
 
 const deleteSelectedElements = (
   elements: readonly ExcalidrawElement[],

packages/excalidraw/actions/actionDistribute.tsx

@@ -1,22 +1,24 @@
+import { ToolButton } from "../components/ToolButton";
 import {
   DistributeHorizontallyIcon,
   DistributeVerticallyIcon,
 } from "../components/icons";
-import { ToolButton } from "../components/ToolButton";
-import type { Distribution } from "../distribute";
 import { distributeElements } from "../distribute";
 import { getNonDeletedElements } from "../element";
 import { isFrameLikeElement } from "../element/typeChecks";
-import type { ExcalidrawElement } from "../element/types";
 import { updateFrameMembershipOfSelectedElements } from "../frame";
 import { t } from "../i18n";
 import { CODES, KEYS } from "../keys";
 import { isSomeElementSelected } from "../scene";
 import { CaptureUpdateAction } from "../store";
-import type { AppClassProperties, AppState } from "../types";
 import { arrayToMap, getShortcutKey } from "../utils";
+
 import { register } from "./register";
 
+import type { Distribution } from "../distribute";
+import type { ExcalidrawElement } from "../element/types";
+import type { AppClassProperties, AppState } from "../types";
+
 const enableActionGroup = (appState: AppState, app: AppClassProperties) => {
   const selectedElements = app.scene.getSelectedElements(appState);
   return (

packages/excalidraw/actions/actionDuplicateSelection.test.tsx

@@ -1,14 +1,16 @@
+import React from "react";
+
+import { ORIG_ID } from "../constants";
 import { Excalidraw } from "../index";
+import { API } from "../tests/helpers/api";
 import {
   act,
   assertElements,
   getCloneByOrigId,
   render,
 } from "../tests/test-utils";
-import { API } from "../tests/helpers/api";
+
 import { actionDuplicateSelection } from "./actionDuplicateSelection";
-import React from "react";
-import { ORIG_ID } from "../constants";
 
 const { h } = window;
 

packages/excalidraw/actions/actionDuplicateSelection.tsx

@@ -1,27 +1,8 @@
-import { KEYS } from "../keys";
-import { register } from "./register";
-import type { ExcalidrawElement } from "../element/types";
-import { duplicateElement, getNonDeletedElements } from "../element";
-import { isSomeElementSelected } from "../scene";
 import { ToolButton } from "../components/ToolButton";
-import { t } from "../i18n";
-import {
-  arrayToMap,
-  castArray,
-  findLastIndex,
-  getShortcutKey,
-  invariant,
-} from "../utils";
-import { LinearElementEditor } from "../element/linearElementEditor";
-import {
-  selectGroupsForSelectedElements,
-  getSelectedGroupForElement,
-  getElementsInGroup,
-} from "../groups";
-import type { AppState } from "../types";
-import { fixBindingsAfterDuplication } from "../element/binding";
-import type { ActionResult } from "./types";
+import { DuplicateIcon } from "../components/icons";
 import { DEFAULT_GRID_SIZE } from "../constants";
+import { duplicateElement, getNonDeletedElements } from "../element";
+import { fixBindingsAfterDuplication } from "../element/binding";
 import {
   bindTextToShapeAfterDuplication,
   getBoundTextElement,
@@ -33,16 +14,37 @@ import {
   isFrameLikeElement,
 } from "../element/typeChecks";
 import { normalizeElementOrder } from "../element/sortElements";
-import { DuplicateIcon } from "../components/icons";
+import { LinearElementEditor } from "../element/linearElementEditor";
 import {
   bindElementsToFramesAfterDuplication,
   getFrameChildren,
 } from "../frame";
+import {
+  selectGroupsForSelectedElements,
+  getSelectedGroupForElement,
+  getElementsInGroup,
+} from "../groups";
+import { t } from "../i18n";
+import { KEYS } from "../keys";
+import { isSomeElementSelected } from "../scene";
 import {
   excludeElementsInFramesFromSelection,
   getSelectedElements,
 } from "../scene/selection";
 import { CaptureUpdateAction } from "../store";
+import {
+  arrayToMap,
+  castArray,
+  findLastIndex,
+  getShortcutKey,
+  invariant,
+} from "../utils";
+
+import { register } from "./register";
+
+import type { ActionResult } from "./types";
+import type { ExcalidrawElement } from "../element/types";
+import type { AppState } from "../types";
 
 export const actionDuplicateSelection = register({
   name: "duplicateSelection",

packages/excalidraw/actions/actionElementLink.ts

@@ -8,6 +8,7 @@ import {
 import { t } from "../i18n";
 import { getSelectedElements } from "../scene";
 import { CaptureUpdateAction } from "../store";
+
 import { register } from "./register";
 
 export const actionCopyElementLink = register({

packages/excalidraw/actions/actionElementLock.test.tsx

@@ -1,9 +1,10 @@
-import React from "react";
-import { Excalidraw } from "../index";
 import { queryByTestId, fireEvent } from "@testing-library/react";
-import { render } from "../tests/test-utils";
-import { Pointer, UI } from "../tests/helpers/ui";
+import React from "react";
+
+import { Excalidraw } from "../index";
 import { API } from "../tests/helpers/api";
+import { Pointer, UI } from "../tests/helpers/ui";
+import { render } from "../tests/test-utils";
 
 const { h } = window;
 const mouse = new Pointer("mouse");

packages/excalidraw/actions/actionElementLock.ts

@@ -1,13 +1,15 @@
 import { LockedIcon, UnlockedIcon } from "../components/icons";
 import { newElementWith } from "../element/mutateElement";
 import { isFrameLikeElement } from "../element/typeChecks";
-import type { ExcalidrawElement } from "../element/types";
 import { KEYS } from "../keys";
 import { getSelectedElements } from "../scene";
 import { CaptureUpdateAction } from "../store";
 import { arrayToMap } from "../utils";
+
 import { register } from "./register";
 
+import type { ExcalidrawElement } from "../element/types";
+
 const shouldLock = (elements: readonly ExcalidrawElement[]) =>
   elements.every((el) => !el.locked);
 

packages/excalidraw/actions/actionExport.tsx

@@ -1,25 +1,27 @@
-import { ExportIcon, questionCircle, saveAs } from "../components/icons";
+import { useDevice } from "../components/App";
+import { CheckboxItem } from "../components/CheckboxItem";
+import { DarkModeToggle } from "../components/DarkModeToggle";
 import { ProjectName } from "../components/ProjectName";
 import { ToolButton } from "../components/ToolButton";
 import { Tooltip } from "../components/Tooltip";
-import { DarkModeToggle } from "../components/DarkModeToggle";
-import { loadFromJSON, saveAsJSON } from "../data";
-import { resaveAsImageWithScene } from "../data/resave";
-import { t } from "../i18n";
-import { useDevice } from "../components/App";
-import { KEYS } from "../keys";
-import { register } from "./register";
-import { CheckboxItem } from "../components/CheckboxItem";
-import { getExportSize } from "../scene/export";
+import { ExportIcon, questionCircle, saveAs } from "../components/icons";
 import { DEFAULT_EXPORT_PADDING, EXPORT_SCALES, THEME } from "../constants";
-import { getSelectedElements, isSomeElementSelected } from "../scene";
-import { getNonDeletedElements } from "../element";
+import { loadFromJSON, saveAsJSON } from "../data";
 import { isImageFileHandle } from "../data/blob";
 import { nativeFileSystemSupported } from "../data/filesystem";
-import type { Theme } from "../element/types";
+import { resaveAsImageWithScene } from "../data/resave";
+import { getNonDeletedElements } from "../element";
+import { t } from "../i18n";
+import { KEYS } from "../keys";
+import { getSelectedElements, isSomeElementSelected } from "../scene";
+import { getExportSize } from "../scene/export";
+import { CaptureUpdateAction } from "../store";
 
 import "../components/ToolIcon.scss";
-import { CaptureUpdateAction } from "../store";
+
+import { register } from "./register";
+
+import type { Theme } from "../element/types";
 
 export const actionChangeProjectName = register({
   name: "changeProjectName",

packages/excalidraw/actions/actionFinalize.tsx

@@ -1,22 +1,25 @@
-import { KEYS } from "../keys";
-import { isInvisiblySmallElement } from "../element";
-import { arrayToMap, updateActiveTool } from "../utils";
+import { pointFrom } from "@excalidraw/math";
+
 import { ToolButton } from "../components/ToolButton";
 import { done } from "../components/icons";
-import { t } from "../i18n";
-import { register } from "./register";
-import { mutateElement } from "../element/mutateElement";
-import { LinearElementEditor } from "../element/linearElementEditor";
+import { resetCursor } from "../cursor";
+import { isInvisiblySmallElement } from "../element";
 import {
   maybeBindLinearElement,
   bindOrUnbindLinearElement,
 } from "../element/binding";
+import { LinearElementEditor } from "../element/linearElementEditor";
+import { mutateElement } from "../element/mutateElement";
 import { isBindingElement, isLinearElement } from "../element/typeChecks";
-import type { AppState } from "../types";
-import { resetCursor } from "../cursor";
-import { CaptureUpdateAction } from "../store";
-import { pointFrom } from "@excalidraw/math";
+import { t } from "../i18n";
+import { KEYS } from "../keys";
 import { isPathALoop } from "../shapes";
+import { CaptureUpdateAction } from "../store";
+import { arrayToMap, updateActiveTool } from "../utils";
+
+import { register } from "./register";
+
+import type { AppState } from "../types";
 
 export const actionFinalize = register({
   name: "finalize",

packages/excalidraw/actions/actionFlip.test.tsx

@@ -1,8 +1,10 @@
-import React from "react";
-import { Excalidraw } from "../index";
-import { render } from "../tests/test-utils";
-import { API } from "../tests/helpers/api";
 import { pointFrom } from "@excalidraw/math";
+import React from "react";
+
+import { Excalidraw } from "../index";
+import { API } from "../tests/helpers/api";
+import { render } from "../tests/test-utils";
+
 import { actionFlipHorizontal, actionFlipVertical } from "./actionFlip";
 
 const { h } = window;

packages/excalidraw/actions/actionFlip.ts

@@ -1,6 +1,26 @@
-import { register } from "./register";
-import { getSelectedElements } from "../scene";
+import { flipHorizontal, flipVertical } from "../components/icons";
 import { getNonDeletedElements } from "../element";
+import {
+  bindOrUnbindLinearElements,
+  isBindingEnabled,
+} from "../element/binding";
+import { getCommonBoundingBox } from "../element/bounds";
+import { mutateElement, newElementWith } from "../element/mutateElement";
+import { deepCopyElement } from "../element/newElement";
+import { resizeMultipleElements } from "../element/resizeElements";
+import {
+  isArrowElement,
+  isElbowArrow,
+  isLinearElement,
+} from "../element/typeChecks";
+import { updateFrameMembershipOfSelectedElements } from "../frame";
+import { CODES, KEYS } from "../keys";
+import { getSelectedElements } from "../scene";
+import { CaptureUpdateAction } from "../store";
+import { arrayToMap } from "../utils";
+
+import { register } from "./register";
+
 import type {
   ExcalidrawArrowElement,
   ExcalidrawElbowArrowElement,
@@ -8,25 +28,7 @@ import type {
   NonDeleted,
   NonDeletedSceneElementsMap,
 } from "../element/types";
-import { resizeMultipleElements } from "../element/resizeElements";
 import type { AppClassProperties, AppState } from "../types";
-import { arrayToMap } from "../utils";
-import { CODES, KEYS } from "../keys";
-import {
-  bindOrUnbindLinearElements,
-  isBindingEnabled,
-} from "../element/binding";
-import { updateFrameMembershipOfSelectedElements } from "../frame";
-import { flipHorizontal, flipVertical } from "../components/icons";
-import { CaptureUpdateAction } from "../store";
-import {
-  isArrowElement,
-  isElbowArrow,
-  isLinearElement,
-} from "../element/typeChecks";
-import { mutateElement, newElementWith } from "../element/mutateElement";
-import { deepCopyElement } from "../element/newElement";
-import { getCommonBoundingBox } from "../element/bounds";
 
 export const actionFlipHorizontal = register({
   name: "flipHorizontal",

packages/excalidraw/actions/actionFrame.ts

@@ -1,19 +1,21 @@
+import { frameToolIcon } from "../components/icons";
+import { setCursorForShape } from "../cursor";
 import { getCommonBounds, getNonDeletedElements } from "../element";
-import type { ExcalidrawElement } from "../element/types";
+import { mutateElement } from "../element/mutateElement";
+import { newFrameElement } from "../element/newElement";
+import { isFrameLikeElement } from "../element/typeChecks";
 import { addElementsToFrame, removeAllElementsFromFrame } from "../frame";
 import { getFrameChildren } from "../frame";
-import { KEYS } from "../keys";
-import type { AppClassProperties, AppState, UIAppState } from "../types";
-import { updateActiveTool } from "../utils";
-import { setCursorForShape } from "../cursor";
-import { register } from "./register";
-import { isFrameLikeElement } from "../element/typeChecks";
-import { frameToolIcon } from "../components/icons";
-import { CaptureUpdateAction } from "../store";
-import { getSelectedElements } from "../scene";
-import { newFrameElement } from "../element/newElement";
 import { getElementsInGroup } from "../groups";
-import { mutateElement } from "../element/mutateElement";
+import { KEYS } from "../keys";
+import { getSelectedElements } from "../scene";
+import { CaptureUpdateAction } from "../store";
+import { updateActiveTool } from "../utils";
+
+import { register } from "./register";
+
+import type { ExcalidrawElement } from "../element/types";
+import type { AppClassProperties, AppState, UIAppState } from "../types";
 
 const isSingleFrameSelected = (
   appState: UIAppState,

packages/excalidraw/actions/actionGroup.tsx

@@ -1,29 +1,9 @@
-import { KEYS } from "../keys";
-import { t } from "../i18n";
-import { arrayToMap, getShortcutKey } from "../utils";
-import { register } from "./register";
-import { UngroupIcon, GroupIcon } from "../components/icons";
-import { newElementWith } from "../element/mutateElement";
-import { isSomeElementSelected } from "../scene";
-import {
-  getSelectedGroupIds,
-  selectGroup,
-  selectGroupsForSelectedElements,
-  getElementsInGroup,
-  addToGroup,
-  removeFromSelectedGroups,
-  isElementInGroup,
-} from "../groups";
-import { getNonDeletedElements } from "../element";
-import { randomId } from "../random";
 import { ToolButton } from "../components/ToolButton";
-import type {
-  ExcalidrawElement,
-  ExcalidrawTextElement,
-  OrderedExcalidrawElement,
-} from "../element/types";
-import type { AppClassProperties, AppState } from "../types";
+import { UngroupIcon, GroupIcon } from "../components/icons";
+import { getNonDeletedElements } from "../element";
+import { newElementWith } from "../element/mutateElement";
 import { isBoundToContainer } from "../element/typeChecks";
+import { syncMovedIndices } from "../fractionalIndex";
 import {
   frameAndChildrenSelectedTogether,
   getElementsInResizingFrame,
@@ -33,8 +13,30 @@ import {
   removeElementsFromFrame,
   replaceAllElementsInFrame,
 } from "../frame";
-import { syncMovedIndices } from "../fractionalIndex";
+import {
+  getSelectedGroupIds,
+  selectGroup,
+  selectGroupsForSelectedElements,
+  getElementsInGroup,
+  addToGroup,
+  removeFromSelectedGroups,
+  isElementInGroup,
+} from "../groups";
+import { t } from "../i18n";
+import { KEYS } from "../keys";
+import { randomId } from "../random";
+import { isSomeElementSelected } from "../scene";
 import { CaptureUpdateAction } from "../store";
+import { arrayToMap, getShortcutKey } from "../utils";
+
+import { register } from "./register";
+
+import type {
+  ExcalidrawElement,
+  ExcalidrawTextElement,
+  OrderedExcalidrawElement,
+} from "../element/types";
+import type { AppClassProperties, AppState } from "../types";
 
 const allElementsInSameGroup = (elements: readonly ExcalidrawElement[]) => {
   if (elements.length >= 2) {

packages/excalidraw/actions/actionHistory.tsx

@@ -1,17 +1,18 @@
-import type { Action, ActionResult } from "./types";
-import { UndoIcon, RedoIcon } from "../components/icons";
 import { ToolButton } from "../components/ToolButton";
-import { t } from "../i18n";
-import type { History } from "../history";
-import { HistoryChangedEvent } from "../history";
-import type { AppClassProperties, AppState } from "../types";
-import { KEYS, matchKey } from "../keys";
-import { arrayToMap } from "../utils";
+import { UndoIcon, RedoIcon } from "../components/icons";
 import { isWindows } from "../constants";
-import type { SceneElementsMap } from "../element/types";
-import type { Store } from "../store";
-import { CaptureUpdateAction } from "../store";
+import { HistoryChangedEvent } from "../history";
 import { useEmitter } from "../hooks/useEmitter";
+import { t } from "../i18n";
+import { KEYS, matchKey } from "../keys";
+import { CaptureUpdateAction } from "../store";
+import { arrayToMap } from "../utils";
+
+import type { SceneElementsMap } from "../element/types";
+import type { History } from "../history";
+import type { Store } from "../store";
+import type { AppClassProperties, AppState } from "../types";
+import type { Action, ActionResult } from "./types";
 
 const executeHistoryAction = (
   app: AppClassProperties,

packages/excalidraw/actions/actionLinearEditor.tsx

@@ -1,12 +1,14 @@
 import { DEFAULT_CATEGORIES } from "../components/CommandPalette/CommandPalette";
+import { ToolButton } from "../components/ToolButton";
+import { lineEditorIcon } from "../components/icons";
 import { LinearElementEditor } from "../element/linearElementEditor";
 import { isElbowArrow, isLinearElement } from "../element/typeChecks";
-import type { ExcalidrawLinearElement } from "../element/types";
-import { CaptureUpdateAction } from "../store";
-import { register } from "./register";
-import { ToolButton } from "../components/ToolButton";
 import { t } from "../i18n";
-import { lineEditorIcon } from "../components/icons";
+import { CaptureUpdateAction } from "../store";
+
+import { register } from "./register";
+
+import type { ExcalidrawLinearElement } from "../element/types";
 
 export const actionToggleLinearEditor = register({
   name: "toggleLinearEditor",

packages/excalidraw/actions/actionLink.tsx

@@ -1,12 +1,13 @@
+import { ToolButton } from "../components/ToolButton";
 import { getContextMenuLabel } from "../components/hyperlink/Hyperlink";
 import { LinkIcon } from "../components/icons";
-import { ToolButton } from "../components/ToolButton";
 import { isEmbeddableElement } from "../element/typeChecks";
 import { t } from "../i18n";
 import { KEYS } from "../keys";
 import { getSelectedElements } from "../scene";
 import { CaptureUpdateAction } from "../store";
 import { getShortcutKey } from "../utils";
+
 import { register } from "./register";
 
 export const actionLink = register({

packages/excalidraw/actions/actionMenu.tsx

@@ -1,11 +1,12 @@
-import { HamburgerMenuIcon, HelpIconThin, palette } from "../components/icons";
 import { ToolButton } from "../components/ToolButton";
-import { t } from "../i18n";
+import { HamburgerMenuIcon, HelpIconThin, palette } from "../components/icons";
 import { showSelectedShapeActions, getNonDeletedElements } from "../element";
-import { register } from "./register";
+import { t } from "../i18n";
 import { KEYS } from "../keys";
 import { CaptureUpdateAction } from "../store";
 
+import { register } from "./register";
+
 export const actionToggleCanvasMenu = register({
   name: "toggleCanvasMenu",
   label: "buttons.menu",

packages/excalidraw/actions/actionNavigate.tsx

@@ -1,6 +1,7 @@
+import clsx from "clsx";
+
 import { getClientColor } from "../clients";
 import { Avatar } from "../components/Avatar";
-import type { GoToCollaboratorComponentProps } from "../components/UserList";
 import {
   eyeIcon,
   microphoneIcon,
@@ -8,9 +9,11 @@ import {
 } from "../components/icons";
 import { t } from "../i18n";
 import { CaptureUpdateAction } from "../store";
-import type { Collaborator } from "../types";
+
 import { register } from "./register";
-import clsx from "clsx";
+
+import type { GoToCollaboratorComponentProps } from "../components/UserList";
+import type { Collaborator } from "../types";
 
 export const actionGoToCollaborator = register({
   name: "goToCollaborator",

packages/excalidraw/actions/actionProperties.test.tsx

@@ -1,11 +1,12 @@
-import React from "react";
-import { Excalidraw } from "../index";
 import { queryByTestId } from "@testing-library/react";
-import { render } from "../tests/test-utils";
-import { UI } from "../tests/helpers/ui";
-import { API } from "../tests/helpers/api";
+import React from "react";
+
 import { COLOR_PALETTE, DEFAULT_ELEMENT_BACKGROUND_PICKS } from "../colors";
 import { FONT_FAMILY, STROKE_WIDTH } from "../constants";
+import { Excalidraw } from "../index";
+import { API } from "../tests/helpers/api";
+import { UI } from "../tests/helpers/ui";
+import { render } from "../tests/test-utils";
 
 describe("element locking", () => {
   beforeEach(async () => {

packages/excalidraw/actions/actionProperties.tsx

@@ -1,20 +1,23 @@
+import { pointFrom } from "@excalidraw/math";
 import { useEffect, useMemo, useRef, useState } from "react";
-import type { AppClassProperties, AppState, Primitive } from "../types";
-import type { CaptureUpdateActionType } from "../store";
+
+import type { LocalPoint } from "@excalidraw/math";
+
+import { trackEvent } from "../analytics";
 import {
   DEFAULT_ELEMENT_BACKGROUND_COLOR_PALETTE,
   DEFAULT_ELEMENT_BACKGROUND_PICKS,
   DEFAULT_ELEMENT_STROKE_COLOR_PALETTE,
   DEFAULT_ELEMENT_STROKE_PICKS,
 } from "../colors";
-import { trackEvent } from "../analytics";
 import { ButtonIconSelect } from "../components/ButtonIconSelect";
 import { ColorPicker } from "../components/ColorPicker/ColorPicker";
-import { IconPicker } from "../components/IconPicker";
 import { FontPicker } from "../components/FontPicker/FontPicker";
+import { IconPicker } from "../components/IconPicker";
 // TODO barnabasmolnar/editor-redesign
 // TextAlignTopIcon, TextAlignBottomIcon,TextAlignMiddleIcon,
 // ArrowHead icons
+import { Range } from "../components/Range";
 import {
   ArrowheadArrowIcon,
   ArrowheadBarIcon,
@@ -71,6 +74,14 @@ import {
   isTextElement,
   redrawTextBoundingBox,
 } from "../element";
+import {
+  bindLinearElement,
+  bindPointToSnapToElementOutline,
+  calculateFixedPointForElbowArrowBinding,
+  getHoveredElementForBinding,
+  updateBoundElements,
+} from "../element/binding";
+import { LinearElementEditor } from "../element/linearElementEditor";
 import { mutateElement, newElementWith } from "../element/mutateElement";
 import { getBoundTextElement } from "../element/textElement";
 import {
@@ -80,17 +91,7 @@ import {
   isLinearElement,
   isUsingAdaptiveRadius,
 } from "../element/typeChecks";
-import type {
-  Arrowhead,
-  ExcalidrawBindableElement,
-  ExcalidrawElement,
-  ExcalidrawLinearElement,
-  ExcalidrawTextElement,
-  FontFamilyValues,
-  TextAlign,
-  VerticalAlign,
-  NonDeletedSceneElementsMap,
-} from "../element/types";
+import { Fonts, getLineHeight } from "../fonts";
 import { getLanguage, t } from "../i18n";
 import { KEYS } from "../keys";
 import { randomInteger } from "../random";
@@ -102,26 +103,29 @@ import {
   isSomeElementSelected,
 } from "../scene";
 import { hasStrokeColor } from "../scene/comparisons";
+import { CaptureUpdateAction } from "../store";
 import {
   arrayToMap,
   getFontFamilyString,
   getShortcutKey,
   tupleToCoors,
 } from "../utils";
+
 import { register } from "./register";
-import { CaptureUpdateAction } from "../store";
-import { Fonts, getLineHeight } from "../fonts";
-import {
-  bindLinearElement,
-  bindPointToSnapToElementOutline,
-  calculateFixedPointForElbowArrowBinding,
-  getHoveredElementForBinding,
-  updateBoundElements,
-} from "../element/binding";
-import { LinearElementEditor } from "../element/linearElementEditor";
-import type { LocalPoint } from "@excalidraw/math";
-import { pointFrom } from "@excalidraw/math";
-import { Range } from "../components/Range";
+
+import type {
+  Arrowhead,
+  ExcalidrawBindableElement,
+  ExcalidrawElement,
+  ExcalidrawLinearElement,
+  ExcalidrawTextElement,
+  FontFamilyValues,
+  TextAlign,
+  VerticalAlign,
+  NonDeletedSceneElementsMap,
+} from "../element/types";
+import type { CaptureUpdateActionType } from "../store";
+import type { AppClassProperties, AppState, Primitive } from "../types";
 
 const FONT_SIZE_RELATIVE_INCREASE_STEP = 0.1;
 

packages/excalidraw/actions/actionSelectAll.ts

@@ -1,13 +1,15 @@
-import { KEYS } from "../keys";
-import { register } from "./register";
-import { selectGroupsForSelectedElements } from "../groups";
-import { getNonDeletedElements, isTextElement } from "../element";
-import type { ExcalidrawElement } from "../element/types";
-import { isLinearElement } from "../element/typeChecks";
-import { LinearElementEditor } from "../element/linearElementEditor";
 import { selectAllIcon } from "../components/icons";
+import { getNonDeletedElements, isTextElement } from "../element";
+import { LinearElementEditor } from "../element/linearElementEditor";
+import { isLinearElement } from "../element/typeChecks";
+import { selectGroupsForSelectedElements } from "../groups";
+import { KEYS } from "../keys";
 import { CaptureUpdateAction } from "../store";
 
+import { register } from "./register";
+
+import type { ExcalidrawElement } from "../element/types";
+
 export const actionSelectAll = register({
   name: "selectAll",
   label: "labels.selectAll",

packages/excalidraw/actions/actionStyles.ts

@@ -1,17 +1,15 @@
-import {
-  isTextElement,
-  isExcalidrawElement,
-  redrawTextBoundingBox,
-} from "../element";
-import { CODES, KEYS } from "../keys";
-import { t } from "../i18n";
-import { register } from "./register";
-import { newElementWith } from "../element/mutateElement";
+import { paintIcon } from "../components/icons";
 import {
   DEFAULT_FONT_SIZE,
   DEFAULT_FONT_FAMILY,
   DEFAULT_TEXT_ALIGN,
 } from "../constants";
+import {
+  isTextElement,
+  isExcalidrawElement,
+  redrawTextBoundingBox,
+} from "../element";
+import { newElementWith } from "../element/mutateElement";
 import { getBoundTextElement } from "../element/textElement";
 import {
   hasBoundTextElement,
@@ -20,11 +18,15 @@ import {
   isFrameLikeElement,
   isArrowElement,
 } from "../element/typeChecks";
-import { getSelectedElements } from "../scene";
-import type { ExcalidrawTextElement } from "../element/types";
-import { paintIcon } from "../components/icons";
-import { CaptureUpdateAction } from "../store";
 import { getLineHeight } from "../fonts";
+import { t } from "../i18n";
+import { CODES, KEYS } from "../keys";
+import { getSelectedElements } from "../scene";
+import { CaptureUpdateAction } from "../store";
+
+import { register } from "./register";
+
+import type { ExcalidrawTextElement } from "../element/types";
 
 // `copiedStyles` is exported only for tests.
 export let copiedStyles: string = "{}";

packages/excalidraw/actions/actionTextAutoResize.ts

@@ -3,10 +3,12 @@ import { newElementWith } from "../element/mutateElement";
 import { measureText } from "../element/textMeasurements";
 import { getSelectedElements } from "../scene";
 import { CaptureUpdateAction } from "../store";
-import type { AppClassProperties } from "../types";
 import { getFontString } from "../utils";
+
 import { register } from "./register";
 
+import type { AppClassProperties } from "../types";
+
 export const actionTextAutoResize = register({
   name: "autoResize",
   label: "labels.autoResize",

packages/excalidraw/actions/actionToggleGridMode.tsx

@@ -1,9 +1,11 @@
-import { CODES, KEYS } from "../keys";
-import { register } from "./register";
-import type { AppState } from "../types";
 import { gridIcon } from "../components/icons";
+import { CODES, KEYS } from "../keys";
 import { CaptureUpdateAction } from "../store";
 
+import { register } from "./register";
+
+import type { AppState } from "../types";
+
 export const actionToggleGridMode = register({
   name: "gridMode",
   icon: gridIcon,

packages/excalidraw/actions/actionToggleObjectsSnapMode.tsx

@@ -1,6 +1,7 @@
 import { magnetIcon } from "../components/icons";
 import { CODES, KEYS } from "../keys";
 import { CaptureUpdateAction } from "../store";
+
 import { register } from "./register";
 
 export const actionToggleObjectsSnapMode = register({

packages/excalidraw/actions/actionToggleSearchMenu.ts

@@ -1,9 +1,11 @@
-import { KEYS } from "../keys";
-import { register } from "./register";
-import type { AppState } from "../types";
 import { searchIcon } from "../components/icons";
-import { CaptureUpdateAction } from "../store";
 import { CANVAS_SEARCH_TAB, CLASSES, DEFAULT_SIDEBAR } from "../constants";
+import { KEYS } from "../keys";
+import { CaptureUpdateAction } from "../store";
+
+import { register } from "./register";
+
+import type { AppState } from "../types";
 
 export const actionToggleSearchMenu = register({
   name: "searchMenu",

packages/excalidraw/actions/actionToggleStats.tsx

@@ -1,8 +1,9 @@
-import { register } from "./register";
-import { CODES, KEYS } from "../keys";
 import { abacusIcon } from "../components/icons";
+import { CODES, KEYS } from "../keys";
 import { CaptureUpdateAction } from "../store";
 
+import { register } from "./register";
+
 export const actionToggleStats = register({
   name: "stats",
   label: "stats.fullTitle",

packages/excalidraw/actions/actionToggleViewMode.tsx

@@ -1,6 +1,7 @@
 import { eyeIcon } from "../components/icons";
 import { CODES, KEYS } from "../keys";
 import { CaptureUpdateAction } from "../store";
+
 import { register } from "./register";
 
 export const actionToggleViewMode = register({

packages/excalidraw/actions/actionToggleZenMode.tsx

@@ -1,6 +1,7 @@
 import { coffeeIcon } from "../components/icons";
 import { CODES, KEYS } from "../keys";
 import { CaptureUpdateAction } from "../store";
+
 import { register } from "./register";
 
 export const actionToggleZenMode = register({

packages/excalidraw/actions/actionZindex.tsx

@@ -1,13 +1,3 @@
-import {
-  moveOneLeft,
-  moveOneRight,
-  moveAllLeft,
-  moveAllRight,
-} from "../zindex";
-import { KEYS, CODES } from "../keys";
-import { t } from "../i18n";
-import { getShortcutKey } from "../utils";
-import { register } from "./register";
 import {
   BringForwardIcon,
   BringToFrontIcon,
@@ -15,7 +5,18 @@ import {
   SendToBackIcon,
 } from "../components/icons";
 import { isDarwin } from "../constants";
+import { t } from "../i18n";
+import { KEYS, CODES } from "../keys";
 import { CaptureUpdateAction } from "../store";
+import { getShortcutKey } from "../utils";
+import {
+  moveOneLeft,
+  moveOneRight,
+  moveAllLeft,
+  moveAllRight,
+} from "../zindex";
+
+import { register } from "./register";
 
 export const actionSendBackward = register({
   name: "sendBackward",

packages/excalidraw/actions/manager.tsx

@@ -1,4 +1,13 @@
 import React from "react";
+
+import { trackEvent } from "../analytics";
+import { isPromiseLike } from "../utils";
+
+import type {
+  ExcalidrawElement,
+  OrderedExcalidrawElement,
+} from "../element/types";
+import type { AppClassProperties, AppState } from "../types";
 import type {
   Action,
   UpdaterFn,
@@ -7,13 +16,6 @@ import type {
   PanelComponentProps,
   ActionSource,
 } from "./types";
-import type {
-  ExcalidrawElement,
-  OrderedExcalidrawElement,
-} from "../element/types";
-import type { AppClassProperties, AppState } from "../types";
-import { trackEvent } from "../analytics";
-import { isPromiseLike } from "../utils";
 
 const trackAction = (
   action: Action,

packages/excalidraw/actions/shortcuts.ts

@@ -1,7 +1,8 @@
 import { isDarwin } from "../constants";
 import { t } from "../i18n";
-import type { SubtypeOf } from "../utility-types";
 import { getShortcutKey } from "../utils";
+
+import type { SubtypeOf } from "../utility-types";
 import type { ActionName } from "./types";
 
 export type ShortcutName =

packages/excalidraw/actions/types.ts

@@ -1,8 +1,8 @@
-import type React from "react";
 import type {
   ExcalidrawElement,
   OrderedExcalidrawElement,
 } from "../element/types";
+import type { CaptureUpdateActionType } from "../store";
 import type {
   AppClassProperties,
   AppState,
@@ -10,7 +10,7 @@ import type {
   BinaryFiles,
   UIAppState,
 } from "../types";
-import type { CaptureUpdateActionType } from "../store";
+import type React from "react";
 
 export type ActionSource =
   | "ui"