diff --git a/.eslintrc.json b/.eslintrc.json index 095543a8..8263b08a 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -1,6 +1,21 @@ { "extends": ["@excalidraw/eslint-config", "react-app"], "rules": { + "import/order": [ + "warn", + { + "groups": ["builtin", "external", "internal", "parent", "sibling", "index", "object", "type"], + "pathGroups": [ + { + "pattern": "@excalidraw/**", + "group": "external", + "position": "after" + } + ], + "newlines-between": "always-and-inside-groups", + "warnOnUnassignedImports": true + } + ], "import/no-anonymous-default-export": "off", "no-restricted-globals": "off", "@typescript-eslint/consistent-type-imports": [ diff --git a/dev-docs/src/components/Homepage/index.js b/dev-docs/src/components/Homepage/index.js index e350e03a..3c1c25f4 100644 --- a/dev-docs/src/components/Homepage/index.js +++ b/dev-docs/src/components/Homepage/index.js @@ -1,5 +1,6 @@ -import React from "react"; import clsx from "clsx"; +import React from "react"; + import styles from "./styles.module.css"; const FeatureList = [ diff --git a/dev-docs/src/components/Homepage/index.tsx b/dev-docs/src/components/Homepage/index.tsx index ee86e919..613eaa55 100644 --- a/dev-docs/src/components/Homepage/index.tsx +++ b/dev-docs/src/components/Homepage/index.tsx @@ -1,5 +1,6 @@ -import React from "react"; import clsx from "clsx"; +import React from "react"; + import styles from "./styles.module.css"; type FeatureItem = { diff --git a/dev-docs/src/pages/index.tsx b/dev-docs/src/pages/index.tsx index f35c2e4a..39b66bb7 100644 --- a/dev-docs/src/pages/index.tsx +++ b/dev-docs/src/pages/index.tsx @@ -1,10 +1,11 @@ -import React from "react"; -import clsx from "clsx"; -import Layout from "@theme/Layout"; import Link from "@docusaurus/Link"; import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; -import styles from "./index.module.css"; import HomepageFeatures from "@site/src/components/Homepage"; +import Layout from "@theme/Layout"; +import clsx from "clsx"; +import React from "react"; + +import styles from "./index.module.css"; function HomepageHeader() { const { siteConfig } = useDocusaurusContext(); diff --git a/dev-docs/src/theme/MDXComponents.js b/dev-docs/src/theme/MDXComponents.js index 35234301..97ff4d05 100644 --- a/dev-docs/src/theme/MDXComponents.js +++ b/dev-docs/src/theme/MDXComponents.js @@ -1,6 +1,6 @@ // Import the original mapper -import MDXComponents from "@theme-original/MDXComponents"; import Highlight from "@site/src/components/Highlight"; +import MDXComponents from "@theme-original/MDXComponents"; export default { // Re-use the default mapping diff --git a/examples/with-nextjs/src/app/page.tsx b/examples/with-nextjs/src/app/page.tsx index 191aca12..e2325523 100644 --- a/examples/with-nextjs/src/app/page.tsx +++ b/examples/with-nextjs/src/app/page.tsx @@ -1,5 +1,6 @@ import dynamic from "next/dynamic"; import Script from "next/script"; + import "../common.scss"; // Since client components get prerenderd on server as well hence importing the excalidraw stuff dynamically diff --git a/examples/with-nextjs/src/excalidrawWrapper.tsx b/examples/with-nextjs/src/excalidrawWrapper.tsx index b4c45fa7..fab4df65 100644 --- a/examples/with-nextjs/src/excalidrawWrapper.tsx +++ b/examples/with-nextjs/src/excalidrawWrapper.tsx @@ -1,10 +1,11 @@ "use client"; import * as excalidrawLib from "@excalidraw/excalidraw"; import { Excalidraw } from "@excalidraw/excalidraw"; -import App from "../../with-script-in-browser/components/ExampleApp"; import "@excalidraw/excalidraw/index.css"; +import App from "../../with-script-in-browser/components/ExampleApp"; + const ExcalidrawWrapper: React.FC = () => { return ( <> diff --git a/examples/with-nextjs/src/pages/excalidraw-in-pages.tsx b/examples/with-nextjs/src/pages/excalidraw-in-pages.tsx index 527a346b..116bb96c 100644 --- a/examples/with-nextjs/src/pages/excalidraw-in-pages.tsx +++ b/examples/with-nextjs/src/pages/excalidraw-in-pages.tsx @@ -1,4 +1,5 @@ import dynamic from "next/dynamic"; + import "../common.scss"; // Since client components get prerenderd on server as well hence importing the excalidraw stuff dynamically diff --git a/examples/with-script-in-browser/components/CustomFooter.tsx b/examples/with-script-in-browser/components/CustomFooter.tsx index 72fd199f..a9c902ad 100644 --- a/examples/with-script-in-browser/components/CustomFooter.tsx +++ b/examples/with-script-in-browser/components/CustomFooter.tsx @@ -1,4 +1,5 @@ import React from "react"; + import type * as TExcalidraw from "@excalidraw/excalidraw"; import type { ExcalidrawImperativeAPI } from "@excalidraw/excalidraw/types"; diff --git a/examples/with-script-in-browser/components/ExampleApp.tsx b/examples/with-script-in-browser/components/ExampleApp.tsx index 08c8032d..976004f0 100644 --- a/examples/with-script-in-browser/components/ExampleApp.tsx +++ b/examples/with-script-in-browser/components/ExampleApp.tsx @@ -1,3 +1,4 @@ +import { nanoid } from "nanoid"; import React, { useEffect, useState, @@ -6,13 +7,24 @@ import React, { Children, cloneElement, } from "react"; -import ExampleSidebar from "./sidebar/ExampleSidebar"; import type * as TExcalidraw from "@excalidraw/excalidraw"; +import type { ImportedLibraryData } from "@excalidraw/excalidraw/data/types"; +import type { + NonDeletedExcalidrawElement, + Theme, +} from "@excalidraw/excalidraw/element/types"; +import type { + AppState, + BinaryFileData, + ExcalidrawImperativeAPI, + ExcalidrawInitialDataState, + Gesture, + LibraryItems, + PointerDownState as ExcalidrawPointerDownState, +} from "@excalidraw/excalidraw/types"; -import { nanoid } from "nanoid"; - -import type { ResolvablePromise } from "../utils"; +import initialData from "../initialData"; import { resolvablePromise, distance2d, @@ -23,25 +35,12 @@ import { import CustomFooter from "./CustomFooter"; import MobileFooter from "./MobileFooter"; -import initialData from "../initialData"; - -import type { - AppState, - BinaryFileData, - ExcalidrawImperativeAPI, - ExcalidrawInitialDataState, - Gesture, - LibraryItems, - PointerDownState as ExcalidrawPointerDownState, -} from "@excalidraw/excalidraw/types"; -import type { - NonDeletedExcalidrawElement, - Theme, -} from "@excalidraw/excalidraw/element/types"; -import type { ImportedLibraryData } from "@excalidraw/excalidraw/data/types"; +import ExampleSidebar from "./sidebar/ExampleSidebar"; import "./ExampleApp.scss"; +import type { ResolvablePromise } from "../utils"; + type Comment = { x: number; y: number; diff --git a/examples/with-script-in-browser/components/MobileFooter.tsx b/examples/with-script-in-browser/components/MobileFooter.tsx index c8fc0f11..a6e1fa1b 100644 --- a/examples/with-script-in-browser/components/MobileFooter.tsx +++ b/examples/with-script-in-browser/components/MobileFooter.tsx @@ -1,7 +1,9 @@ import React from "react"; + +import type * as TExcalidraw from "@excalidraw/excalidraw"; import type { ExcalidrawImperativeAPI } from "@excalidraw/excalidraw/types"; + import CustomFooter from "./CustomFooter"; -import type * as TExcalidraw from "@excalidraw/excalidraw"; const MobileFooter = ({ excalidrawAPI, diff --git a/examples/with-script-in-browser/components/sidebar/ExampleSidebar.tsx b/examples/with-script-in-browser/components/sidebar/ExampleSidebar.tsx index 19391341..88950b34 100644 --- a/examples/with-script-in-browser/components/sidebar/ExampleSidebar.tsx +++ b/examples/with-script-in-browser/components/sidebar/ExampleSidebar.tsx @@ -1,4 +1,5 @@ import React, { useState } from "react"; + import "./ExampleSidebar.scss"; export default function Sidebar({ children }: { children: React.ReactNode }) { diff --git a/examples/with-script-in-browser/index.tsx b/examples/with-script-in-browser/index.tsx index 25ad96e3..8f92e7cc 100644 --- a/examples/with-script-in-browser/index.tsx +++ b/examples/with-script-in-browser/index.tsx @@ -1,10 +1,11 @@ -import App from "./components/ExampleApp"; import React, { StrictMode } from "react"; import { createRoot } from "react-dom/client"; +import "@excalidraw/excalidraw/index.css"; + import type * as TExcalidraw from "@excalidraw/excalidraw"; -import "@excalidraw/excalidraw/index.css"; +import App from "./components/ExampleApp"; declare global { interface Window { diff --git a/examples/with-script-in-browser/utils.ts b/examples/with-script-in-browser/utils.ts index a77b93fb..285e9652 100644 --- a/examples/with-script-in-browser/utils.ts +++ b/examples/with-script-in-browser/utils.ts @@ -1,6 +1,6 @@ -import { unstable_batchedUpdates } from "react-dom"; -import { fileOpen as _fileOpen } from "browser-fs-access"; import { MIME_TYPES } from "@excalidraw/excalidraw"; +import { fileOpen as _fileOpen } from "browser-fs-access"; +import { unstable_batchedUpdates } from "react-dom"; type FILE_EXTENSION = Exclude; diff --git a/excalidraw-app/App.tsx b/excalidraw-app/App.tsx index 2cb6e771..dc399a7d 100644 --- a/excalidraw-app/App.tsx +++ b/excalidraw-app/App.tsx @@ -1,9 +1,21 @@ -import polyfill from "@excalidraw/excalidraw/polyfill"; -import { useCallback, useEffect, useRef, useState } from "react"; +import { + Excalidraw, + LiveCollaborationTrigger, + TTDDialogTrigger, + CaptureUpdateAction, + reconcileElements, +} from "@excalidraw/excalidraw"; import { trackEvent } from "@excalidraw/excalidraw/analytics"; import { getDefaultAppState } from "@excalidraw/excalidraw/appState"; +import { + CommandPalette, + DEFAULT_CATEGORIES, +} from "@excalidraw/excalidraw/components/CommandPalette/CommandPalette"; import { ErrorDialog } from "@excalidraw/excalidraw/components/ErrorDialog"; -import { TopErrorBoundary } from "./components/TopErrorBoundary"; +import { OverwriteConfirmDialog } from "@excalidraw/excalidraw/components/OverwriteConfirm/OverwriteConfirm"; +import { openConfirmModal } from "@excalidraw/excalidraw/components/OverwriteConfirm/OverwriteConfirmState"; +import { ShareableLinkDialog } from "@excalidraw/excalidraw/components/ShareableLinkDialog"; +import Trans from "@excalidraw/excalidraw/components/Trans"; import { APP_NAME, EVENT, @@ -11,21 +23,47 @@ import { TITLE_TIMEOUT, VERSION_TIMEOUT, } from "@excalidraw/excalidraw/constants"; +import polyfill from "@excalidraw/excalidraw/polyfill"; +import { useCallback, useEffect, useRef, useState } from "react"; import { loadFromBlob } from "@excalidraw/excalidraw/data/blob"; +import { useCallbackRefState } from "@excalidraw/excalidraw/hooks/useCallbackRefState"; +import { t } from "@excalidraw/excalidraw/i18n"; +import { + debounce, + getVersion, + getFrame, + isTestEnv, + preventUnload, + resolvablePromise, + isRunningInIframe, +} from "@excalidraw/excalidraw/utils"; +import { + GithubIcon, + XBrandIcon, + DiscordIcon, + ExcalLogo, + usersIcon, + exportToPlus, + share, + youtubeIcon, +} from "@excalidraw/excalidraw/components/icons"; +import { isElementLink } from "@excalidraw/excalidraw/element/elementLink"; +import { restore, restoreAppState } from "@excalidraw/excalidraw/data/restore"; +import { newElementWith } from "@excalidraw/excalidraw/element/mutateElement"; +import { isInitializedImageElement } from "@excalidraw/excalidraw/element/typeChecks"; +import clsx from "clsx"; +import { + parseLibraryTokensFromUrl, + useHandleLibrary, +} from "@excalidraw/excalidraw/data/library"; + +import type { RemoteExcalidrawElement } from "@excalidraw/excalidraw/data/reconcile"; +import type { RestoredDataState } from "@excalidraw/excalidraw/data/restore"; import type { FileId, NonDeletedExcalidrawElement, OrderedExcalidrawElement, } from "@excalidraw/excalidraw/element/types"; -import { useCallbackRefState } from "@excalidraw/excalidraw/hooks/useCallbackRefState"; -import { t } from "@excalidraw/excalidraw/i18n"; -import { - Excalidraw, - LiveCollaborationTrigger, - TTDDialogTrigger, - CaptureUpdateAction, - reconcileElements, -} from "@excalidraw/excalidraw"; import type { AppState, ExcalidrawImperativeAPI, @@ -33,48 +71,50 @@ import type { ExcalidrawInitialDataState, UIAppState, } from "@excalidraw/excalidraw/types"; +import type { ResolutionType } from "@excalidraw/excalidraw/utility-types"; import type { ResolvablePromise } from "@excalidraw/excalidraw/utils"; + +import CustomStats from "./CustomStats"; import { - debounce, - getVersion, - getFrame, - isTestEnv, - preventUnload, - resolvablePromise, - isRunningInIframe, -} from "@excalidraw/excalidraw/utils"; + Provider, + useAtom, + useAtomValue, + useAtomWithInitialValue, + appJotaiStore, +} from "./app-jotai"; import { FIREBASE_STORAGE_PREFIXES, isExcalidrawPlusSignedUser, STORAGE_KEYS, SYNC_BROWSER_TABS_TIMEOUT, } from "./app_constants"; -import type { CollabAPI } from "./collab/Collab"; import Collab, { collabAPIAtom, isCollaboratingAtom, isOfflineAtom, } from "./collab/Collab"; +import { AppFooter } from "./components/AppFooter"; +import { AppMainMenu } from "./components/AppMainMenu"; +import { AppWelcomeScreen } from "./components/AppWelcomeScreen"; +import { + ExportToExcalidrawPlus, + exportToExcalidrawPlus, +} from "./components/ExportToExcalidrawPlus"; +import { TopErrorBoundary } from "./components/TopErrorBoundary"; + import { exportToBackend, getCollaborationLinkData, isCollaborationLink, loadScene, } from "./data"; + +import { updateStaleImageStatuses } from "./data/FileManager"; import { importFromLocalStorage, importUsernameFromLocalStorage, } from "./data/localStorage"; -import CustomStats from "./CustomStats"; -import type { RestoredDataState } from "@excalidraw/excalidraw/data/restore"; -import { restore, restoreAppState } from "@excalidraw/excalidraw/data/restore"; -import { - ExportToExcalidrawPlus, - exportToExcalidrawPlus, -} from "./components/ExportToExcalidrawPlus"; -import { updateStaleImageStatuses } from "./data/FileManager"; -import { newElementWith } from "@excalidraw/excalidraw/element/mutateElement"; -import { isInitializedImageElement } from "@excalidraw/excalidraw/element/typeChecks"; + import { loadFilesFromFirebase } from "./data/firebase"; import { LibraryIndexedDBAdapter, @@ -82,45 +122,8 @@ import { LocalData, } from "./data/LocalData"; import { isBrowserStorageStateNewer } from "./data/tabSync"; -import clsx from "clsx"; -import { - parseLibraryTokensFromUrl, - useHandleLibrary, -} from "@excalidraw/excalidraw/data/library"; -import { AppMainMenu } from "./components/AppMainMenu"; -import { AppWelcomeScreen } from "./components/AppWelcomeScreen"; -import { AppFooter } from "./components/AppFooter"; -import { - Provider, - useAtom, - useAtomValue, - useAtomWithInitialValue, - appJotaiStore, -} from "./app-jotai"; - -import "./index.scss"; -import type { ResolutionType } from "@excalidraw/excalidraw/utility-types"; -import { ShareableLinkDialog } from "@excalidraw/excalidraw/components/ShareableLinkDialog"; -import { openConfirmModal } from "@excalidraw/excalidraw/components/OverwriteConfirm/OverwriteConfirmState"; -import { OverwriteConfirmDialog } from "@excalidraw/excalidraw/components/OverwriteConfirm/OverwriteConfirm"; -import Trans from "@excalidraw/excalidraw/components/Trans"; import { ShareDialog, shareDialogStateAtom } from "./share/ShareDialog"; import CollabError, { collabErrorIndicatorAtom } from "./collab/CollabError"; -import type { RemoteExcalidrawElement } from "@excalidraw/excalidraw/data/reconcile"; -import { - CommandPalette, - DEFAULT_CATEGORIES, -} from "@excalidraw/excalidraw/components/CommandPalette/CommandPalette"; -import { - GithubIcon, - XBrandIcon, - DiscordIcon, - ExcalLogo, - usersIcon, - exportToPlus, - share, - youtubeIcon, -} from "@excalidraw/excalidraw/components/icons"; import { useHandleAppTheme } from "./useHandleAppTheme"; import { getPreferredLanguage } from "./app-language/language-detector"; import { useAppLangCode } from "./app-language/language-state"; @@ -131,7 +134,10 @@ import DebugCanvas, { } from "./components/DebugCanvas"; import { AIComponents } from "./components/AI"; import { ExcalidrawPlusIframeExport } from "./ExcalidrawPlusIframeExport"; -import { isElementLink } from "@excalidraw/excalidraw/element/elementLink"; + +import "./index.scss"; + +import type { CollabAPI } from "./collab/Collab"; polyfill(); diff --git a/excalidraw-app/CustomStats.tsx b/excalidraw-app/CustomStats.tsx index 96ca55d6..c57f297f 100644 --- a/excalidraw-app/CustomStats.tsx +++ b/excalidraw-app/CustomStats.tsx @@ -1,15 +1,17 @@ -import { useEffect, useState } from "react"; +import { Stats } from "@excalidraw/excalidraw"; +import { copyTextToSystemClipboard } from "@excalidraw/excalidraw/clipboard"; +import { DEFAULT_VERSION } from "@excalidraw/excalidraw/constants"; +import { t } from "@excalidraw/excalidraw/i18n"; import { debounce, getVersion, nFormatter } from "@excalidraw/excalidraw/utils"; +import { useEffect, useState } from "react"; + +import type { NonDeletedExcalidrawElement } from "@excalidraw/excalidraw/element/types"; +import type { UIAppState } from "@excalidraw/excalidraw/types"; + import { getElementsStorageSize, getTotalStorageSize, } from "./data/localStorage"; -import { DEFAULT_VERSION } from "@excalidraw/excalidraw/constants"; -import { t } from "@excalidraw/excalidraw/i18n"; -import { copyTextToSystemClipboard } from "@excalidraw/excalidraw/clipboard"; -import type { NonDeletedExcalidrawElement } from "@excalidraw/excalidraw/element/types"; -import type { UIAppState } from "@excalidraw/excalidraw/types"; -import { Stats } from "@excalidraw/excalidraw"; type StorageSizes = { scene: number; total: number }; diff --git a/excalidraw-app/ExcalidrawPlusIframeExport.tsx b/excalidraw-app/ExcalidrawPlusIframeExport.tsx index 1f9cd631..be046f79 100644 --- a/excalidraw-app/ExcalidrawPlusIframeExport.tsx +++ b/excalidraw-app/ExcalidrawPlusIframeExport.tsx @@ -1,13 +1,15 @@ +import { base64urlToString } from "@excalidraw/excalidraw/data/encode"; +import { ExcalidrawError } from "@excalidraw/excalidraw/errors"; import { useLayoutEffect, useRef } from "react"; -import { STORAGE_KEYS } from "./app_constants"; -import { LocalData } from "./data/LocalData"; + import type { FileId, OrderedExcalidrawElement, } from "@excalidraw/excalidraw/element/types"; import type { AppState, BinaryFileData } from "@excalidraw/excalidraw/types"; -import { ExcalidrawError } from "@excalidraw/excalidraw/errors"; -import { base64urlToString } from "@excalidraw/excalidraw/data/encode"; + +import { STORAGE_KEYS } from "./app_constants"; +import { LocalData } from "./data/LocalData"; const EVENT_REQUEST_SCENE = "REQUEST_SCENE"; diff --git a/excalidraw-app/app-language/LanguageList.tsx b/excalidraw-app/app-language/LanguageList.tsx index 001d4ea1..b4682f35 100644 --- a/excalidraw-app/app-language/LanguageList.tsx +++ b/excalidraw-app/app-language/LanguageList.tsx @@ -1,6 +1,8 @@ -import React from "react"; import { useI18n, languages } from "@excalidraw/excalidraw/i18n"; +import React from "react"; + import { useSetAtom } from "../app-jotai"; + import { appLangCodeAtom } from "./language-state"; export const LanguageList = ({ style }: { style?: React.CSSProperties }) => { diff --git a/excalidraw-app/app-language/language-detector.ts b/excalidraw-app/app-language/language-detector.ts index 52da4908..535189d0 100644 --- a/excalidraw-app/app-language/language-detector.ts +++ b/excalidraw-app/app-language/language-detector.ts @@ -1,5 +1,5 @@ -import LanguageDetector from "i18next-browser-languagedetector"; import { defaultLang, languages } from "@excalidraw/excalidraw"; +import LanguageDetector from "i18next-browser-languagedetector"; export const languageDetector = new LanguageDetector(); diff --git a/excalidraw-app/app-language/language-state.ts b/excalidraw-app/app-language/language-state.ts index f491c221..d9ec9032 100644 --- a/excalidraw-app/app-language/language-state.ts +++ b/excalidraw-app/app-language/language-state.ts @@ -1,5 +1,7 @@ import { useEffect } from "react"; + import { atom, useAtom } from "../app-jotai"; + import { getPreferredLanguage, languageDetector } from "./language-detector"; export const appLangCodeAtom = atom(getPreferredLanguage()); diff --git a/excalidraw-app/collab/Collab.tsx b/excalidraw-app/collab/Collab.tsx index 9a16e056..0964a736 100644 --- a/excalidraw-app/collab/Collab.tsx +++ b/excalidraw-app/collab/Collab.tsx @@ -1,21 +1,3 @@ -import throttle from "lodash.throttle"; -import { PureComponent } from "react"; -import type { - BinaryFileData, - ExcalidrawImperativeAPI, - SocketId, - Collaborator, - Gesture, -} from "@excalidraw/excalidraw/types"; -import { ErrorDialog } from "@excalidraw/excalidraw/components/ErrorDialog"; -import { APP_NAME, ENV, EVENT } from "@excalidraw/excalidraw/constants"; -import type { ImportedDataState } from "@excalidraw/excalidraw/data/types"; -import type { - ExcalidrawElement, - FileId, - InitializedExcalidrawImageElement, - OrderedExcalidrawElement, -} from "@excalidraw/excalidraw/element/types"; import { CaptureUpdateAction, getSceneVersion, @@ -23,12 +5,53 @@ import { zoomToFitBounds, reconcileElements, } from "@excalidraw/excalidraw"; +import { ErrorDialog } from "@excalidraw/excalidraw/components/ErrorDialog"; +import { APP_NAME, ENV, EVENT } from "@excalidraw/excalidraw/constants"; +import { + IDLE_THRESHOLD, + ACTIVE_THRESHOLD, + UserIdleState, +} from "@excalidraw/excalidraw/constants"; +import { decryptData } from "@excalidraw/excalidraw/data/encryption"; +import { getVisibleSceneBounds } from "@excalidraw/excalidraw/element/bounds"; +import { newElementWith } from "@excalidraw/excalidraw/element/mutateElement"; +import { + isImageElement, + isInitializedImageElement, +} from "@excalidraw/excalidraw/element/typeChecks"; +import { AbortError } from "@excalidraw/excalidraw/errors"; +import { t } from "@excalidraw/excalidraw/i18n"; +import { withBatchedUpdates } from "@excalidraw/excalidraw/reactUtils"; import { assertNever, preventUnload, resolvablePromise, throttleRAF, } from "@excalidraw/excalidraw/utils"; +import throttle from "lodash.throttle"; +import { PureComponent } from "react"; + +import type { + ReconciledExcalidrawElement, + RemoteExcalidrawElement, +} from "@excalidraw/excalidraw/data/reconcile"; +import type { ImportedDataState } from "@excalidraw/excalidraw/data/types"; +import type { + ExcalidrawElement, + FileId, + InitializedExcalidrawImageElement, + OrderedExcalidrawElement, +} from "@excalidraw/excalidraw/element/types"; +import type { + BinaryFileData, + ExcalidrawImperativeAPI, + SocketId, + Collaborator, + Gesture, +} from "@excalidraw/excalidraw/types"; +import type { Mutable, ValueOf } from "@excalidraw/excalidraw/utility-types"; + +import { appJotaiStore, atom } from "../app-jotai"; import { CURSOR_SYNC_TIMEOUT, FILE_UPLOAD_MAX_BYTES, @@ -39,15 +62,17 @@ import { SYNC_FULL_SCENE_INTERVAL_MS, WS_EVENTS, } from "../app_constants"; -import type { - SocketUpdateDataSource, - SyncableExcalidrawElement, -} from "../data"; import { generateCollaborationLinkData, getCollaborationLink, getSyncableElements, } from "../data"; +import { + encodeFilesForUpload, + FileManager, + updateStaleImageStatuses, +} from "../data/FileManager"; +import { LocalData } from "../data/LocalData"; import { isSavedToFirebase, loadFilesFromFirebase, @@ -59,36 +84,15 @@ import { importUsernameFromLocalStorage, saveUsernameToLocalStorage, } from "../data/localStorage"; -import Portal from "./Portal"; -import { t } from "@excalidraw/excalidraw/i18n"; -import { - IDLE_THRESHOLD, - ACTIVE_THRESHOLD, - UserIdleState, -} from "@excalidraw/excalidraw/constants"; -import { - encodeFilesForUpload, - FileManager, - updateStaleImageStatuses, -} from "../data/FileManager"; -import { AbortError } from "@excalidraw/excalidraw/errors"; -import { - isImageElement, - isInitializedImageElement, -} from "@excalidraw/excalidraw/element/typeChecks"; -import { newElementWith } from "@excalidraw/excalidraw/element/mutateElement"; -import { decryptData } from "@excalidraw/excalidraw/data/encryption"; import { resetBrowserStateVersions } from "../data/tabSync"; -import { LocalData } from "../data/LocalData"; -import { appJotaiStore, atom } from "../app-jotai"; -import type { Mutable, ValueOf } from "@excalidraw/excalidraw/utility-types"; -import { getVisibleSceneBounds } from "@excalidraw/excalidraw/element/bounds"; -import { withBatchedUpdates } from "@excalidraw/excalidraw/reactUtils"; + import { collabErrorIndicatorAtom } from "./CollabError"; +import Portal from "./Portal"; + import type { - ReconciledExcalidrawElement, - RemoteExcalidrawElement, -} from "@excalidraw/excalidraw/data/reconcile"; + SocketUpdateDataSource, + SyncableExcalidrawElement, +} from "../data"; export const collabAPIAtom = atom(null); export const isCollaboratingAtom = atom(false); diff --git a/excalidraw-app/collab/CollabError.tsx b/excalidraw-app/collab/CollabError.tsx index 76828cf1..eb6f391b 100644 --- a/excalidraw-app/collab/CollabError.tsx +++ b/excalidraw-app/collab/CollabError.tsx @@ -2,6 +2,7 @@ import { Tooltip } from "@excalidraw/excalidraw/components/Tooltip"; import { warning } from "@excalidraw/excalidraw/components/icons"; import clsx from "clsx"; import { useEffect, useRef, useState } from "react"; + import { atom } from "../app-jotai"; import "./CollabError.scss"; diff --git a/excalidraw-app/collab/Portal.tsx b/excalidraw-app/collab/Portal.tsx index 1788d39f..037bca31 100644 --- a/excalidraw-app/collab/Portal.tsx +++ b/excalidraw-app/collab/Portal.tsx @@ -1,25 +1,26 @@ -import type { - SocketUpdateData, - SocketUpdateDataSource, - SyncableExcalidrawElement, -} from "../data"; -import { isSyncableElement } from "../data"; - -import type { TCollabClass } from "./Collab"; +import { CaptureUpdateAction } from "@excalidraw/excalidraw"; +import { trackEvent } from "@excalidraw/excalidraw/analytics"; +import { encryptData } from "@excalidraw/excalidraw/data/encryption"; +import { newElementWith } from "@excalidraw/excalidraw/element/mutateElement"; +import throttle from "lodash.throttle"; +import type { UserIdleState } from "@excalidraw/excalidraw/constants"; import type { OrderedExcalidrawElement } from "@excalidraw/excalidraw/element/types"; -import { WS_EVENTS, FILE_UPLOAD_TIMEOUT, WS_SUBTYPES } from "../app_constants"; import type { OnUserFollowedPayload, SocketId, } from "@excalidraw/excalidraw/types"; -import type { UserIdleState } from "@excalidraw/excalidraw/constants"; -import { trackEvent } from "@excalidraw/excalidraw/analytics"; -import throttle from "lodash.throttle"; -import { newElementWith } from "@excalidraw/excalidraw/element/mutateElement"; -import { encryptData } from "@excalidraw/excalidraw/data/encryption"; + +import { WS_EVENTS, FILE_UPLOAD_TIMEOUT, WS_SUBTYPES } from "../app_constants"; +import { isSyncableElement } from "../data"; + +import type { + SocketUpdateData, + SocketUpdateDataSource, + SyncableExcalidrawElement, +} from "../data"; +import type { TCollabClass } from "./Collab"; import type { Socket } from "socket.io-client"; -import { CaptureUpdateAction } from "@excalidraw/excalidraw"; class Portal { collab: TCollabClass; diff --git a/excalidraw-app/components/AI.tsx b/excalidraw-app/components/AI.tsx index fa5d12fa..c9b6684b 100644 --- a/excalidraw-app/components/AI.tsx +++ b/excalidraw-app/components/AI.tsx @@ -1,4 +1,3 @@ -import type { ExcalidrawImperativeAPI } from "@excalidraw/excalidraw/types"; import { DiagramToCodePlugin, exportToBlob, @@ -9,6 +8,8 @@ import { import { getDataURL } from "@excalidraw/excalidraw/data/blob"; import { safelyParseJSON } from "@excalidraw/excalidraw/utils"; +import type { ExcalidrawImperativeAPI } from "@excalidraw/excalidraw/types"; + export const AIComponents = ({ excalidrawAPI, }: { diff --git a/excalidraw-app/components/AppFooter.tsx b/excalidraw-app/components/AppFooter.tsx index e81df7c4..7d42d46b 100644 --- a/excalidraw-app/components/AppFooter.tsx +++ b/excalidraw-app/components/AppFooter.tsx @@ -1,9 +1,11 @@ -import React from "react"; import { Footer } from "@excalidraw/excalidraw/index"; -import { EncryptedIcon } from "./EncryptedIcon"; -import { ExcalidrawPlusAppLink } from "./ExcalidrawPlusAppLink"; +import React from "react"; + import { isExcalidrawPlusSignedUser } from "../app_constants"; + import { DebugFooter, isVisualDebuggerEnabled } from "./DebugCanvas"; +import { EncryptedIcon } from "./EncryptedIcon"; +import { ExcalidrawPlusAppLink } from "./ExcalidrawPlusAppLink"; export const AppFooter = React.memo( ({ onChange }: { onChange: () => void }) => { diff --git a/excalidraw-app/components/AppMainMenu.tsx b/excalidraw-app/components/AppMainMenu.tsx index cb741cf2..996d6912 100644 --- a/excalidraw-app/components/AppMainMenu.tsx +++ b/excalidraw-app/components/AppMainMenu.tsx @@ -1,13 +1,16 @@ -import React from "react"; import { loginIcon, ExcalLogo, eyeIcon, } from "@excalidraw/excalidraw/components/icons"; -import type { Theme } from "@excalidraw/excalidraw/element/types"; import { MainMenu } from "@excalidraw/excalidraw/index"; -import { isExcalidrawPlusSignedUser } from "../app_constants"; +import React from "react"; + +import type { Theme } from "@excalidraw/excalidraw/element/types"; + import { LanguageList } from "../app-language/LanguageList"; +import { isExcalidrawPlusSignedUser } from "../app_constants"; + import { saveDebugState } from "./DebugCanvas"; export const AppMainMenu: React.FC<{ diff --git a/excalidraw-app/components/AppWelcomeScreen.tsx b/excalidraw-app/components/AppWelcomeScreen.tsx index bdc9859f..c33de092 100644 --- a/excalidraw-app/components/AppWelcomeScreen.tsx +++ b/excalidraw-app/components/AppWelcomeScreen.tsx @@ -1,9 +1,10 @@ -import React from "react"; import { loginIcon } from "@excalidraw/excalidraw/components/icons"; +import { POINTER_EVENTS } from "@excalidraw/excalidraw/constants"; import { useI18n } from "@excalidraw/excalidraw/i18n"; import { WelcomeScreen } from "@excalidraw/excalidraw/index"; +import React from "react"; + import { isExcalidrawPlusSignedUser } from "../app_constants"; -import { POINTER_EVENTS } from "@excalidraw/excalidraw/constants"; export const AppWelcomeScreen: React.FC<{ onCollabDialogOpen: () => any; diff --git a/excalidraw-app/components/DebugCanvas.tsx b/excalidraw-app/components/DebugCanvas.tsx index 31898ba5..af1a2b14 100644 --- a/excalidraw-app/components/DebugCanvas.tsx +++ b/excalidraw-app/components/DebugCanvas.tsx @@ -1,24 +1,27 @@ -import { useCallback, useImperativeHandle, useRef } from "react"; -import { type AppState } from "@excalidraw/excalidraw/types"; -import { throttleRAF } from "@excalidraw/excalidraw/utils"; -import { - bootstrapCanvas, - getNormalizedCanvasDimensions, -} from "@excalidraw/excalidraw/renderer/helpers"; -import type { DebugElement } from "@excalidraw/excalidraw/visualdebug"; import { ArrowheadArrowIcon, CloseIcon, TrashIcon, } from "@excalidraw/excalidraw/components/icons"; -import { STORAGE_KEYS } from "../app_constants"; -import type { Curve } from "../../packages/math"; +import { + bootstrapCanvas, + getNormalizedCanvasDimensions, +} from "@excalidraw/excalidraw/renderer/helpers"; +import { type AppState } from "@excalidraw/excalidraw/types"; +import { throttleRAF } from "@excalidraw/excalidraw/utils"; +import { useCallback, useImperativeHandle, useRef } from "react"; + +import type { DebugElement } from "@excalidraw/excalidraw/visualdebug"; + import { isLineSegment, type GlobalPoint, type LineSegment, } from "../../packages/math"; import { isCurve } from "../../packages/math/curve"; +import { STORAGE_KEYS } from "../app_constants"; + +import type { Curve } from "../../packages/math"; const renderLine = ( context: CanvasRenderingContext2D, diff --git a/excalidraw-app/components/EncryptedIcon.tsx b/excalidraw-app/components/EncryptedIcon.tsx index a3a84178..552e7ca8 100644 --- a/excalidraw-app/components/EncryptedIcon.tsx +++ b/excalidraw-app/components/EncryptedIcon.tsx @@ -1,5 +1,5 @@ -import { shield } from "@excalidraw/excalidraw/components/icons"; import { Tooltip } from "@excalidraw/excalidraw/components/Tooltip"; +import { shield } from "@excalidraw/excalidraw/components/icons"; import { useI18n } from "@excalidraw/excalidraw/i18n"; export const EncryptedIcon = () => { diff --git a/excalidraw-app/components/ExportToExcalidrawPlus.tsx b/excalidraw-app/components/ExportToExcalidrawPlus.tsx index 782ecd96..a630f804 100644 --- a/excalidraw-app/components/ExportToExcalidrawPlus.tsx +++ b/excalidraw-app/components/ExportToExcalidrawPlus.tsx @@ -1,8 +1,20 @@ -import React from "react"; +import { trackEvent } from "@excalidraw/excalidraw/analytics"; import { Card } from "@excalidraw/excalidraw/components/Card"; +import { ExcalidrawLogo } from "@excalidraw/excalidraw/components/ExcalidrawLogo"; import { ToolButton } from "@excalidraw/excalidraw/components/ToolButton"; +import { MIME_TYPES } from "@excalidraw/excalidraw/constants"; +import { + encryptData, + generateEncryptionKey, +} from "@excalidraw/excalidraw/data/encryption"; import { serializeAsJSON } from "@excalidraw/excalidraw/data/json"; -import { loadFirebaseStorage, saveFilesToFirebase } from "../data/firebase"; +import { isInitializedImageElement } from "@excalidraw/excalidraw/element/typeChecks"; +import { useI18n } from "@excalidraw/excalidraw/i18n"; +import { getFrame } from "@excalidraw/excalidraw/utils"; +import { uploadBytes, ref } from "firebase/storage"; +import { nanoid } from "nanoid"; +import React from "react"; + import type { FileId, NonDeletedExcalidrawElement, @@ -12,20 +24,10 @@ import type { BinaryFileData, BinaryFiles, } from "@excalidraw/excalidraw/types"; -import { nanoid } from "nanoid"; -import { useI18n } from "@excalidraw/excalidraw/i18n"; -import { - encryptData, - generateEncryptionKey, -} from "@excalidraw/excalidraw/data/encryption"; -import { isInitializedImageElement } from "@excalidraw/excalidraw/element/typeChecks"; + import { FILE_UPLOAD_MAX_BYTES } from "../app_constants"; import { encodeFilesForUpload } from "../data/FileManager"; -import { uploadBytes, ref } from "firebase/storage"; -import { MIME_TYPES } from "@excalidraw/excalidraw/constants"; -import { trackEvent } from "@excalidraw/excalidraw/analytics"; -import { getFrame } from "@excalidraw/excalidraw/utils"; -import { ExcalidrawLogo } from "@excalidraw/excalidraw/components/ExcalidrawLogo"; +import { loadFirebaseStorage, saveFilesToFirebase } from "../data/firebase"; export const exportToExcalidrawPlus = async ( elements: readonly NonDeletedExcalidrawElement[], diff --git a/excalidraw-app/components/GitHubCorner.tsx b/excalidraw-app/components/GitHubCorner.tsx index 4d74242d..b1c17f29 100644 --- a/excalidraw-app/components/GitHubCorner.tsx +++ b/excalidraw-app/components/GitHubCorner.tsx @@ -1,6 +1,7 @@ +import { THEME } from "@excalidraw/excalidraw/constants"; import oc from "open-color"; import React from "react"; -import { THEME } from "@excalidraw/excalidraw/constants"; + import type { Theme } from "@excalidraw/excalidraw/element/types"; // https://github.com/tholman/github-corners diff --git a/excalidraw-app/components/TopErrorBoundary.tsx b/excalidraw-app/components/TopErrorBoundary.tsx index e7e00be3..77d9e5f4 100644 --- a/excalidraw-app/components/TopErrorBoundary.tsx +++ b/excalidraw-app/components/TopErrorBoundary.tsx @@ -1,7 +1,7 @@ -import React from "react"; -import * as Sentry from "@sentry/browser"; -import { t } from "@excalidraw/excalidraw/i18n"; import Trans from "@excalidraw/excalidraw/components/Trans"; +import { t } from "@excalidraw/excalidraw/i18n"; +import * as Sentry from "@sentry/browser"; +import React from "react"; interface TopErrorBoundaryState { hasError: boolean; diff --git a/excalidraw-app/data/FileManager.ts b/excalidraw-app/data/FileManager.ts index f5f4eaca..93d7ddec 100644 --- a/excalidraw-app/data/FileManager.ts +++ b/excalidraw-app/data/FileManager.ts @@ -2,13 +2,14 @@ import { CaptureUpdateAction } from "@excalidraw/excalidraw"; import { compressData } from "@excalidraw/excalidraw/data/encode"; import { newElementWith } from "@excalidraw/excalidraw/element/mutateElement"; import { isInitializedImageElement } from "@excalidraw/excalidraw/element/typeChecks"; +import { t } from "@excalidraw/excalidraw/i18n"; + import type { ExcalidrawElement, ExcalidrawImageElement, FileId, InitializedExcalidrawImageElement, } from "@excalidraw/excalidraw/element/types"; -import { t } from "@excalidraw/excalidraw/i18n"; import type { BinaryFileData, BinaryFileMetadata, diff --git a/excalidraw-app/data/LocalData.ts b/excalidraw-app/data/LocalData.ts index 3ab0ad93..6b53cc48 100644 --- a/excalidraw-app/data/LocalData.ts +++ b/excalidraw-app/data/LocalData.ts @@ -10,6 +10,13 @@ * (localStorage, indexedDB). */ +import { clearAppStateForLocalStorage } from "@excalidraw/excalidraw/appState"; +import { + CANVAS_SEARCH_TAB, + DEFAULT_SIDEBAR, +} from "@excalidraw/excalidraw/constants"; +import { clearElementsForLocalStorage } from "@excalidraw/excalidraw/element"; +import { debounce } from "@excalidraw/excalidraw/utils"; import { createStore, entries, @@ -19,14 +26,9 @@ import { setMany, get, } from "idb-keyval"; -import { clearAppStateForLocalStorage } from "@excalidraw/excalidraw/appState"; -import { - CANVAS_SEARCH_TAB, - DEFAULT_SIDEBAR, -} from "@excalidraw/excalidraw/constants"; + import type { LibraryPersistedData } from "@excalidraw/excalidraw/data/library"; import type { ImportedDataState } from "@excalidraw/excalidraw/data/types"; -import { clearElementsForLocalStorage } from "@excalidraw/excalidraw/element"; import type { ExcalidrawElement, FileId, @@ -37,8 +39,9 @@ import type { BinaryFiles, } from "@excalidraw/excalidraw/types"; import type { MaybePromise } from "@excalidraw/excalidraw/utility-types"; -import { debounce } from "@excalidraw/excalidraw/utils"; + import { SAVE_TO_LOCAL_STORAGE_TIMEOUT, STORAGE_KEYS } from "../app_constants"; + import { FileManager } from "./FileManager"; import { Locker } from "./Locker"; import { updateBrowserStateVersion } from "./tabSync"; diff --git a/excalidraw-app/data/firebase.ts b/excalidraw-app/data/firebase.ts index a871b489..66893b51 100644 --- a/excalidraw-app/data/firebase.ts +++ b/excalidraw-app/data/firebase.ts @@ -1,27 +1,12 @@ import { reconcileElements } from "@excalidraw/excalidraw"; -import type { - ExcalidrawElement, - FileId, - OrderedExcalidrawElement, -} from "@excalidraw/excalidraw/element/types"; -import { getSceneVersion } from "@excalidraw/excalidraw/element"; -import type Portal from "../collab/Portal"; -import { restoreElements } from "@excalidraw/excalidraw/data/restore"; -import type { - AppState, - BinaryFileData, - BinaryFileMetadata, - DataURL, -} from "@excalidraw/excalidraw/types"; -import { FILE_CACHE_MAX_AGE_SEC } from "../app_constants"; +import { MIME_TYPES } from "@excalidraw/excalidraw/constants"; import { decompressData } from "@excalidraw/excalidraw/data/encode"; import { encryptData, decryptData, } from "@excalidraw/excalidraw/data/encryption"; -import { MIME_TYPES } from "@excalidraw/excalidraw/constants"; -import type { SyncableExcalidrawElement } from "."; -import { getSyncableElements } from "."; +import { restoreElements } from "@excalidraw/excalidraw/data/restore"; +import { getSceneVersion } from "@excalidraw/excalidraw/element"; import { initializeApp } from "firebase/app"; import { getFirestore, @@ -31,8 +16,27 @@ import { Bytes, } from "firebase/firestore"; import { getStorage, ref, uploadBytes } from "firebase/storage"; -import type { Socket } from "socket.io-client"; + import type { RemoteExcalidrawElement } from "@excalidraw/excalidraw/data/reconcile"; +import type { + ExcalidrawElement, + FileId, + OrderedExcalidrawElement, +} from "@excalidraw/excalidraw/element/types"; +import type { + AppState, + BinaryFileData, + BinaryFileMetadata, + DataURL, +} from "@excalidraw/excalidraw/types"; + +import { FILE_CACHE_MAX_AGE_SEC } from "../app_constants"; + +import { getSyncableElements } from "."; + +import type { SyncableExcalidrawElement } from "."; +import type Portal from "../collab/Portal"; +import type { Socket } from "socket.io-client"; // private // ----------------------------------------------------------------------------- diff --git a/excalidraw-app/data/index.ts b/excalidraw-app/data/index.ts index 6ecb98f7..e8fbc1f4 100644 --- a/excalidraw-app/data/index.ts +++ b/excalidraw-app/data/index.ts @@ -9,34 +9,38 @@ import { } from "@excalidraw/excalidraw/data/encryption"; import { serializeAsJSON } from "@excalidraw/excalidraw/data/json"; import { restore } from "@excalidraw/excalidraw/data/restore"; -import type { ImportedDataState } from "@excalidraw/excalidraw/data/types"; -import type { SceneBounds } from "@excalidraw/excalidraw/element/bounds"; import { isInvisiblySmallElement } from "@excalidraw/excalidraw/element/sizeHelpers"; import { isInitializedImageElement } from "@excalidraw/excalidraw/element/typeChecks"; +import { t } from "@excalidraw/excalidraw/i18n"; +import { bytesToHexString } from "@excalidraw/excalidraw/utils"; + +import type { UserIdleState } from "@excalidraw/excalidraw/constants"; +import type { ImportedDataState } from "@excalidraw/excalidraw/data/types"; +import type { SceneBounds } from "@excalidraw/excalidraw/element/bounds"; import type { ExcalidrawElement, FileId, OrderedExcalidrawElement, } from "@excalidraw/excalidraw/element/types"; -import { t } from "@excalidraw/excalidraw/i18n"; import type { AppState, BinaryFileData, BinaryFiles, SocketId, } from "@excalidraw/excalidraw/types"; -import type { UserIdleState } from "@excalidraw/excalidraw/constants"; import type { MakeBrand } from "@excalidraw/excalidraw/utility-types"; -import { bytesToHexString } from "@excalidraw/excalidraw/utils"; -import type { WS_SUBTYPES } from "../app_constants"; + import { DELETED_ELEMENT_TIMEOUT, FILE_UPLOAD_MAX_BYTES, ROOM_ID_BYTES, } from "../app_constants"; + import { encodeFilesForUpload } from "./FileManager"; import { saveFilesToFirebase } from "./firebase"; +import type { WS_SUBTYPES } from "../app_constants"; + export type SyncableExcalidrawElement = OrderedExcalidrawElement & MakeBrand<"SyncableExcalidrawElement">; diff --git a/excalidraw-app/data/localStorage.ts b/excalidraw-app/data/localStorage.ts index 640dfdb6..ac120649 100644 --- a/excalidraw-app/data/localStorage.ts +++ b/excalidraw-app/data/localStorage.ts @@ -1,10 +1,12 @@ -import type { ExcalidrawElement } from "@excalidraw/excalidraw/element/types"; -import type { AppState } from "@excalidraw/excalidraw/types"; import { clearAppStateForLocalStorage, getDefaultAppState, } from "@excalidraw/excalidraw/appState"; import { clearElementsForLocalStorage } from "@excalidraw/excalidraw/element"; + +import type { ExcalidrawElement } from "@excalidraw/excalidraw/element/types"; +import type { AppState } from "@excalidraw/excalidraw/types"; + import { STORAGE_KEYS } from "../app_constants"; export const saveUsernameToLocalStorage = (username: string) => { diff --git a/excalidraw-app/index.tsx b/excalidraw-app/index.tsx index a28bd9e4..98c902e3 100644 --- a/excalidraw-app/index.tsx +++ b/excalidraw-app/index.tsx @@ -1,9 +1,11 @@ import { StrictMode } from "react"; import { createRoot } from "react-dom/client"; -import ExcalidrawApp from "./App"; import { registerSW } from "virtual:pwa-register"; import "../excalidraw-app/sentry"; + +import ExcalidrawApp from "./App"; + window.__EXCALIDRAW_SHA__ = import.meta.env.VITE_APP_GIT_SHA; const rootElement = document.getElementById("root")!; const root = createRoot(rootElement); diff --git a/excalidraw-app/share/ShareDialog.tsx b/excalidraw-app/share/ShareDialog.tsx index bba7e367..de77c607 100644 --- a/excalidraw-app/share/ShareDialog.tsx +++ b/excalidraw-app/share/ShareDialog.tsx @@ -1,10 +1,8 @@ -import { useEffect, useRef, useState } from "react"; -import { copyTextToSystemClipboard } from "@excalidraw/excalidraw/clipboard"; import { trackEvent } from "@excalidraw/excalidraw/analytics"; -import { getFrame } from "@excalidraw/excalidraw/utils"; -import { useI18n } from "@excalidraw/excalidraw/i18n"; -import { KEYS } from "@excalidraw/excalidraw/keys"; +import { copyTextToSystemClipboard } from "@excalidraw/excalidraw/clipboard"; import { Dialog } from "@excalidraw/excalidraw/components/Dialog"; +import { FilledButton } from "@excalidraw/excalidraw/components/FilledButton"; +import { TextField } from "@excalidraw/excalidraw/components/TextField"; import { copyIcon, LinkIcon, @@ -14,16 +12,20 @@ import { shareIOS, shareWindows, } from "@excalidraw/excalidraw/components/icons"; -import { TextField } from "@excalidraw/excalidraw/components/TextField"; -import { FilledButton } from "@excalidraw/excalidraw/components/FilledButton"; -import type { CollabAPI } from "../collab/Collab"; -import { activeRoomLinkAtom } from "../collab/Collab"; import { useUIAppState } from "@excalidraw/excalidraw/context/ui-appState"; import { useCopyStatus } from "@excalidraw/excalidraw/hooks/useCopiedIndicator"; +import { useI18n } from "@excalidraw/excalidraw/i18n"; +import { KEYS } from "@excalidraw/excalidraw/keys"; +import { getFrame } from "@excalidraw/excalidraw/utils"; +import { useEffect, useRef, useState } from "react"; + import { atom, useAtom, useAtomValue } from "../app-jotai"; +import { activeRoomLinkAtom } from "../collab/Collab"; import "./ShareDialog.scss"; +import type { CollabAPI } from "../collab/Collab"; + type OnExportToBackend = () => void; type ShareDialogType = "share" | "collaborationOnly"; diff --git a/excalidraw-app/tests/MobileMenu.test.tsx b/excalidraw-app/tests/MobileMenu.test.tsx index a6eef3b5..3b05e729 100644 --- a/excalidraw-app/tests/MobileMenu.test.tsx +++ b/excalidraw-app/tests/MobileMenu.test.tsx @@ -1,11 +1,11 @@ -import ExcalidrawApp from "../App"; +import { UI } from "@excalidraw/excalidraw/tests/helpers/ui"; import { mockBoundingClientRect, render, restoreOriginalGetBoundingClientRect, } from "@excalidraw/excalidraw/tests/test-utils"; -import { UI } from "@excalidraw/excalidraw/tests/helpers/ui"; +import ExcalidrawApp from "../App"; describe("Test MobileMenu", () => { const { h } = window; diff --git a/excalidraw-app/tests/collab.test.tsx b/excalidraw-app/tests/collab.test.tsx index 80cf4b0b..f6cd68fa 100644 --- a/excalidraw-app/tests/collab.test.tsx +++ b/excalidraw-app/tests/collab.test.tsx @@ -1,13 +1,14 @@ -import { vi } from "vitest"; -import { act, render, waitFor } from "@excalidraw/excalidraw/tests/test-utils"; -import ExcalidrawApp from "../App"; -import { API } from "@excalidraw/excalidraw/tests/helpers/api"; -import { syncInvalidIndices } from "@excalidraw/excalidraw/fractionalIndex"; +import { CaptureUpdateAction, newElementWith } from "@excalidraw/excalidraw"; import { createRedoAction, createUndoAction, } from "@excalidraw/excalidraw/actions/actionHistory"; -import { CaptureUpdateAction, newElementWith } from "@excalidraw/excalidraw"; +import { syncInvalidIndices } from "@excalidraw/excalidraw/fractionalIndex"; +import { API } from "@excalidraw/excalidraw/tests/helpers/api"; +import { act, render, waitFor } from "@excalidraw/excalidraw/tests/test-utils"; +import { vi } from "vitest"; + +import ExcalidrawApp from "../App"; const { h } = window; diff --git a/excalidraw-app/useHandleAppTheme.ts b/excalidraw-app/useHandleAppTheme.ts index e3196117..6fc2ff54 100644 --- a/excalidraw-app/useHandleAppTheme.ts +++ b/excalidraw-app/useHandleAppTheme.ts @@ -1,8 +1,10 @@ -import { useEffect, useLayoutEffect, useState } from "react"; import { THEME } from "@excalidraw/excalidraw"; import { EVENT } from "@excalidraw/excalidraw/constants"; -import type { Theme } from "@excalidraw/excalidraw/element/types"; import { CODES, KEYS } from "@excalidraw/excalidraw/keys"; +import { useEffect, useLayoutEffect, useState } from "react"; + +import type { Theme } from "@excalidraw/excalidraw/element/types"; + import { STORAGE_KEYS } from "./app_constants"; const getDarkThemeMediaQuery = (): MediaQueryList | undefined => diff --git a/package.json b/package.json index aaa8027a..9ff4379d 100644 --- a/package.json +++ b/package.json @@ -26,6 +26,7 @@ "dotenv": "16.0.1", "eslint-config-prettier": "8.5.0", "eslint-config-react-app": "7.0.1", + "eslint-plugin-import": "2.31.0", "eslint-plugin-prettier": "3.3.1", "http-server": "14.1.1", "husky": "7.0.4", diff --git a/packages/excalidraw/actions/actionAddToLibrary.ts b/packages/excalidraw/actions/actionAddToLibrary.ts index 3186e3bc..b246918a 100644 --- a/packages/excalidraw/actions/actionAddToLibrary.ts +++ b/packages/excalidraw/actions/actionAddToLibrary.ts @@ -1,10 +1,11 @@ -import { register } from "./register"; +import { LIBRARY_DISABLED_TYPES } from "../constants"; import { deepCopyElement } from "../element/newElement"; -import { randomId } from "../random"; import { t } from "../i18n"; -import { LIBRARY_DISABLED_TYPES } from "../constants"; +import { randomId } from "../random"; import { CaptureUpdateAction } from "../store"; +import { register } from "./register"; + export const actionAddToLibrary = register({ name: "addToLibrary", trackEvent: { category: "element" }, diff --git a/packages/excalidraw/actions/actionAlign.tsx b/packages/excalidraw/actions/actionAlign.tsx index 53e8e618..b42122a5 100644 --- a/packages/excalidraw/actions/actionAlign.tsx +++ b/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, diff --git a/packages/excalidraw/actions/actionBoundText.tsx b/packages/excalidraw/actions/actionBoundText.tsx index b72ddee6..4da3f99a 100644 --- a/packages/excalidraw/actions/actionBoundText.tsx +++ b/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", diff --git a/packages/excalidraw/actions/actionCanvas.tsx b/packages/excalidraw/actions/actionCanvas.tsx index 903a6d84..f3e0a8a3 100644 --- a/packages/excalidraw/actions/actionCanvas.tsx +++ b/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 { CaptureUpdateAction } from "../store"; 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 type { ExcalidrawElement } from "../element/types"; +import type { AppState, Offsets } from "../types"; export const actionChangeViewBackgroundColor = register({ name: "changeViewBackgroundColor", diff --git a/packages/excalidraw/actions/actionClipboard.tsx b/packages/excalidraw/actions/actionClipboard.tsx index fffe7b37..4ce3c39d 100644 --- a/packages/excalidraw/actions/actionClipboard.tsx +++ b/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", diff --git a/packages/excalidraw/actions/actionCropEditor.tsx b/packages/excalidraw/actions/actionCropEditor.tsx index 643f666b..c377b3a0 100644 --- a/packages/excalidraw/actions/actionCropEditor.tsx +++ b/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({ diff --git a/packages/excalidraw/actions/actionDeleteSelected.test.tsx b/packages/excalidraw/actions/actionDeleteSelected.test.tsx index d48646fa..090c8194 100644 --- a/packages/excalidraw/actions/actionDeleteSelected.test.tsx +++ b/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; diff --git a/packages/excalidraw/actions/actionDeleteSelected.tsx b/packages/excalidraw/actions/actionDeleteSelected.tsx index c640f925..fe3f8c5d 100644 --- a/packages/excalidraw/actions/actionDeleteSelected.tsx +++ b/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[], diff --git a/packages/excalidraw/actions/actionDistribute.tsx b/packages/excalidraw/actions/actionDistribute.tsx index 15d33b1f..c96bdaa3 100644 --- a/packages/excalidraw/actions/actionDistribute.tsx +++ b/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 ( diff --git a/packages/excalidraw/actions/actionDuplicateSelection.test.tsx b/packages/excalidraw/actions/actionDuplicateSelection.test.tsx index dc471df3..2c1d44e9 100644 --- a/packages/excalidraw/actions/actionDuplicateSelection.test.tsx +++ b/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; diff --git a/packages/excalidraw/actions/actionDuplicateSelection.tsx b/packages/excalidraw/actions/actionDuplicateSelection.tsx index b28e831c..ce225a1d 100644 --- a/packages/excalidraw/actions/actionDuplicateSelection.tsx +++ b/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", diff --git a/packages/excalidraw/actions/actionElementLink.ts b/packages/excalidraw/actions/actionElementLink.ts index 91469fd6..69fc67dd 100644 --- a/packages/excalidraw/actions/actionElementLink.ts +++ b/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({ diff --git a/packages/excalidraw/actions/actionElementLock.test.tsx b/packages/excalidraw/actions/actionElementLock.test.tsx index d6dd3f7a..ec45ab9b 100644 --- a/packages/excalidraw/actions/actionElementLock.test.tsx +++ b/packages/excalidraw/actions/actionElementLock.test.tsx @@ -1,9 +1,10 @@ +import { queryByTestId, fireEvent } from "@testing-library/react"; 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 { 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"); diff --git a/packages/excalidraw/actions/actionElementLock.ts b/packages/excalidraw/actions/actionElementLock.ts index eba21f24..57ca1dde 100644 --- a/packages/excalidraw/actions/actionElementLock.ts +++ b/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); diff --git a/packages/excalidraw/actions/actionExport.tsx b/packages/excalidraw/actions/actionExport.tsx index 8d18acd8..c9d70fc4 100644 --- a/packages/excalidraw/actions/actionExport.tsx +++ b/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 { ExportIcon, questionCircle, saveAs } from "../components/icons"; +import { DEFAULT_EXPORT_PADDING, EXPORT_SCALES, THEME } from "../constants"; import { loadFromJSON, saveAsJSON } from "../data"; +import { isImageFileHandle } from "../data/blob"; +import { nativeFileSystemSupported } from "../data/filesystem"; import { resaveAsImageWithScene } from "../data/resave"; +import { getNonDeletedElements } from "../element"; 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 { DEFAULT_EXPORT_PADDING, EXPORT_SCALES, THEME } from "../constants"; import { getSelectedElements, isSomeElementSelected } from "../scene"; -import { getNonDeletedElements } from "../element"; -import { isImageFileHandle } from "../data/blob"; -import { nativeFileSystemSupported } from "../data/filesystem"; -import type { Theme } from "../element/types"; +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", diff --git a/packages/excalidraw/actions/actionFinalize.tsx b/packages/excalidraw/actions/actionFinalize.tsx index f2d8c015..ac8a4e03 100644 --- a/packages/excalidraw/actions/actionFinalize.tsx +++ b/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", diff --git a/packages/excalidraw/actions/actionFlip.test.tsx b/packages/excalidraw/actions/actionFlip.test.tsx index 94e4721d..e9953e02 100644 --- a/packages/excalidraw/actions/actionFlip.test.tsx +++ b/packages/excalidraw/actions/actionFlip.test.tsx @@ -1,8 +1,10 @@ +import { pointFrom } from "@excalidraw/math"; 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 { render } from "../tests/test-utils"; + import { actionFlipHorizontal, actionFlipVertical } from "./actionFlip"; const { h } = window; diff --git a/packages/excalidraw/actions/actionFlip.ts b/packages/excalidraw/actions/actionFlip.ts index 80149b87..bfc7fb72 100644 --- a/packages/excalidraw/actions/actionFlip.ts +++ b/packages/excalidraw/actions/actionFlip.ts @@ -1,32 +1,34 @@ -import { register } from "./register"; -import { getSelectedElements } from "../scene"; +import { flipHorizontal, flipVertical } from "../components/icons"; import { getNonDeletedElements } from "../element"; -import type { - ExcalidrawArrowElement, - ExcalidrawElbowArrowElement, - ExcalidrawElement, - 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 { 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 { mutateElement, newElementWith } from "../element/mutateElement"; -import { deepCopyElement } from "../element/newElement"; -import { getCommonBoundingBox } from "../element/bounds"; +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, + ExcalidrawElement, + NonDeleted, + NonDeletedSceneElementsMap, +} from "../element/types"; +import type { AppClassProperties, AppState } from "../types"; export const actionFlipHorizontal = register({ name: "flipHorizontal", diff --git a/packages/excalidraw/actions/actionFrame.ts b/packages/excalidraw/actions/actionFrame.ts index ce05b533..198994b2 100644 --- a/packages/excalidraw/actions/actionFrame.ts +++ b/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 { getElementsInGroup } from "../groups"; import { KEYS } from "../keys"; -import type { AppClassProperties, AppState, UIAppState } from "../types"; +import { getSelectedElements } from "../scene"; +import { CaptureUpdateAction } from "../store"; 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 type { ExcalidrawElement } from "../element/types"; +import type { AppClassProperties, AppState, UIAppState } from "../types"; const isSingleFrameSelected = ( appState: UIAppState, diff --git a/packages/excalidraw/actions/actionGroup.tsx b/packages/excalidraw/actions/actionGroup.tsx index 4e98c59c..ded2f5b7 100644 --- a/packages/excalidraw/actions/actionGroup.tsx +++ b/packages/excalidraw/actions/actionGroup.tsx @@ -1,10 +1,18 @@ -import { KEYS } from "../keys"; -import { t } from "../i18n"; -import { arrayToMap, getShortcutKey } from "../utils"; -import { register } from "./register"; +import { ToolButton } from "../components/ToolButton"; import { UngroupIcon, GroupIcon } from "../components/icons"; +import { getNonDeletedElements } from "../element"; import { newElementWith } from "../element/mutateElement"; -import { isSomeElementSelected } from "../scene"; +import { isBoundToContainer } from "../element/typeChecks"; +import { syncMovedIndices } from "../fractionalIndex"; +import { + frameAndChildrenSelectedTogether, + getElementsInResizingFrame, + getFrameLikeElements, + getRootElements, + groupByFrameLikes, + removeElementsFromFrame, + replaceAllElementsInFrame, +} from "../frame"; import { getSelectedGroupIds, selectGroup, @@ -14,27 +22,21 @@ import { removeFromSelectedGroups, isElementInGroup, } from "../groups"; -import { getNonDeletedElements } from "../element"; +import { t } from "../i18n"; +import { KEYS } from "../keys"; import { randomId } from "../random"; -import { ToolButton } from "../components/ToolButton"; +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"; -import { isBoundToContainer } from "../element/typeChecks"; -import { - frameAndChildrenSelectedTogether, - getElementsInResizingFrame, - getFrameLikeElements, - getRootElements, - groupByFrameLikes, - removeElementsFromFrame, - replaceAllElementsInFrame, -} from "../frame"; -import { syncMovedIndices } from "../fractionalIndex"; -import { CaptureUpdateAction } from "../store"; const allElementsInSameGroup = (elements: readonly ExcalidrawElement[]) => { if (elements.length >= 2) { diff --git a/packages/excalidraw/actions/actionHistory.tsx b/packages/excalidraw/actions/actionHistory.tsx index 299a09f3..da4f8021 100644 --- a/packages/excalidraw/actions/actionHistory.tsx +++ b/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 { UndoIcon, RedoIcon } from "../components/icons"; +import { isWindows } from "../constants"; import { HistoryChangedEvent } from "../history"; -import type { AppClassProperties, AppState } from "../types"; +import { useEmitter } from "../hooks/useEmitter"; +import { t } from "../i18n"; import { KEYS, matchKey } from "../keys"; +import { CaptureUpdateAction } from "../store"; import { arrayToMap } from "../utils"; -import { isWindows } from "../constants"; + import type { SceneElementsMap } from "../element/types"; +import type { History } from "../history"; import type { Store } from "../store"; -import { CaptureUpdateAction } from "../store"; -import { useEmitter } from "../hooks/useEmitter"; +import type { AppClassProperties, AppState } from "../types"; +import type { Action, ActionResult } from "./types"; const executeHistoryAction = ( app: AppClassProperties, diff --git a/packages/excalidraw/actions/actionLinearEditor.tsx b/packages/excalidraw/actions/actionLinearEditor.tsx index 1f05755b..f17f0e56 100644 --- a/packages/excalidraw/actions/actionLinearEditor.tsx +++ b/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 { t } from "../i18n"; import { CaptureUpdateAction } from "../store"; + import { register } from "./register"; -import { ToolButton } from "../components/ToolButton"; -import { t } from "../i18n"; -import { lineEditorIcon } from "../components/icons"; + +import type { ExcalidrawLinearElement } from "../element/types"; export const actionToggleLinearEditor = register({ name: "toggleLinearEditor", diff --git a/packages/excalidraw/actions/actionLink.tsx b/packages/excalidraw/actions/actionLink.tsx index beb95d2c..91d01b7a 100644 --- a/packages/excalidraw/actions/actionLink.tsx +++ b/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({ diff --git a/packages/excalidraw/actions/actionMenu.tsx b/packages/excalidraw/actions/actionMenu.tsx index 9e71fe25..15b763cb 100644 --- a/packages/excalidraw/actions/actionMenu.tsx +++ b/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", diff --git a/packages/excalidraw/actions/actionNavigate.tsx b/packages/excalidraw/actions/actionNavigate.tsx index 48037200..73838683 100644 --- a/packages/excalidraw/actions/actionNavigate.tsx +++ b/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", diff --git a/packages/excalidraw/actions/actionProperties.test.tsx b/packages/excalidraw/actions/actionProperties.test.tsx index 80d2ca25..c5467bb9 100644 --- a/packages/excalidraw/actions/actionProperties.test.tsx +++ b/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 () => { diff --git a/packages/excalidraw/actions/actionProperties.tsx b/packages/excalidraw/actions/actionProperties.tsx index 0c2ad3ba..1e24d9be 100644 --- a/packages/excalidraw/actions/actionProperties.tsx +++ b/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; diff --git a/packages/excalidraw/actions/actionSelectAll.ts b/packages/excalidraw/actions/actionSelectAll.ts index 61c27805..5f6d7eab 100644 --- a/packages/excalidraw/actions/actionSelectAll.ts +++ b/packages/excalidraw/actions/actionSelectAll.ts @@ -1,13 +1,15 @@ -import { KEYS } from "../keys"; -import { register } from "./register"; -import { selectGroupsForSelectedElements } from "../groups"; +import { selectAllIcon } from "../components/icons"; 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 { 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", diff --git a/packages/excalidraw/actions/actionStyles.ts b/packages/excalidraw/actions/actionStyles.ts index 01f80406..ea517c44 100644 --- a/packages/excalidraw/actions/actionStyles.ts +++ b/packages/excalidraw/actions/actionStyles.ts @@ -1,17 +1,15 @@ +import { paintIcon } from "../components/icons"; +import { + DEFAULT_FONT_SIZE, + DEFAULT_FONT_FAMILY, + DEFAULT_TEXT_ALIGN, +} from "../constants"; 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 { - DEFAULT_FONT_SIZE, - DEFAULT_FONT_FAMILY, - DEFAULT_TEXT_ALIGN, -} from "../constants"; import { getBoundTextElement } from "../element/textElement"; import { hasBoundTextElement, @@ -20,11 +18,15 @@ import { isFrameLikeElement, isArrowElement, } from "../element/typeChecks"; +import { getLineHeight } from "../fonts"; +import { t } from "../i18n"; +import { CODES, KEYS } from "../keys"; import { getSelectedElements } from "../scene"; -import type { ExcalidrawTextElement } from "../element/types"; -import { paintIcon } from "../components/icons"; import { CaptureUpdateAction } from "../store"; -import { getLineHeight } from "../fonts"; + +import { register } from "./register"; + +import type { ExcalidrawTextElement } from "../element/types"; // `copiedStyles` is exported only for tests. export let copiedStyles: string = "{}"; diff --git a/packages/excalidraw/actions/actionTextAutoResize.ts b/packages/excalidraw/actions/actionTextAutoResize.ts index 29f54c9a..b9ad7783 100644 --- a/packages/excalidraw/actions/actionTextAutoResize.ts +++ b/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", diff --git a/packages/excalidraw/actions/actionToggleGridMode.tsx b/packages/excalidraw/actions/actionToggleGridMode.tsx index 69d65705..98360e84 100644 --- a/packages/excalidraw/actions/actionToggleGridMode.tsx +++ b/packages/excalidraw/actions/actionToggleGridMode.tsx @@ -1,8 +1,10 @@ +import { gridIcon } from "../components/icons"; import { CODES, KEYS } from "../keys"; +import { CaptureUpdateAction } from "../store"; + import { register } from "./register"; + import type { AppState } from "../types"; -import { gridIcon } from "../components/icons"; -import { CaptureUpdateAction } from "../store"; export const actionToggleGridMode = register({ name: "gridMode", diff --git a/packages/excalidraw/actions/actionToggleObjectsSnapMode.tsx b/packages/excalidraw/actions/actionToggleObjectsSnapMode.tsx index 1ae3cbe0..d5112413 100644 --- a/packages/excalidraw/actions/actionToggleObjectsSnapMode.tsx +++ b/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({ diff --git a/packages/excalidraw/actions/actionToggleSearchMenu.ts b/packages/excalidraw/actions/actionToggleSearchMenu.ts index 9261e79c..75d9074c 100644 --- a/packages/excalidraw/actions/actionToggleSearchMenu.ts +++ b/packages/excalidraw/actions/actionToggleSearchMenu.ts @@ -1,9 +1,11 @@ +import { searchIcon } from "../components/icons"; +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"; -import { searchIcon } from "../components/icons"; -import { CaptureUpdateAction } from "../store"; -import { CANVAS_SEARCH_TAB, CLASSES, DEFAULT_SIDEBAR } from "../constants"; export const actionToggleSearchMenu = register({ name: "searchMenu", diff --git a/packages/excalidraw/actions/actionToggleStats.tsx b/packages/excalidraw/actions/actionToggleStats.tsx index e28d099a..d0cdc64a 100644 --- a/packages/excalidraw/actions/actionToggleStats.tsx +++ b/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", diff --git a/packages/excalidraw/actions/actionToggleViewMode.tsx b/packages/excalidraw/actions/actionToggleViewMode.tsx index cae3b095..05513526 100644 --- a/packages/excalidraw/actions/actionToggleViewMode.tsx +++ b/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({ diff --git a/packages/excalidraw/actions/actionToggleZenMode.tsx b/packages/excalidraw/actions/actionToggleZenMode.tsx index 31afd3f3..31c72bf9 100644 --- a/packages/excalidraw/actions/actionToggleZenMode.tsx +++ b/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({ diff --git a/packages/excalidraw/actions/actionZindex.tsx b/packages/excalidraw/actions/actionZindex.tsx index 4097b2df..82d3d77d 100644 --- a/packages/excalidraw/actions/actionZindex.tsx +++ b/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", diff --git a/packages/excalidraw/actions/manager.tsx b/packages/excalidraw/actions/manager.tsx index f3784380..d3609640 100644 --- a/packages/excalidraw/actions/manager.tsx +++ b/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, diff --git a/packages/excalidraw/actions/shortcuts.ts b/packages/excalidraw/actions/shortcuts.ts index 451609df..89a7c5ae 100644 --- a/packages/excalidraw/actions/shortcuts.ts +++ b/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 = diff --git a/packages/excalidraw/actions/types.ts b/packages/excalidraw/actions/types.ts index 71ac9f4a..c30f53f5 100644 --- a/packages/excalidraw/actions/types.ts +++ b/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" diff --git a/packages/excalidraw/align.ts b/packages/excalidraw/align.ts index 113ba274..36e5d660 100644 --- a/packages/excalidraw/align.ts +++ b/packages/excalidraw/align.ts @@ -1,9 +1,10 @@ -import type { ElementsMap, ExcalidrawElement } from "./element/types"; -import { mutateElement } from "./element/mutateElement"; -import type { BoundingBox } from "./element/bounds"; +import { updateBoundElements } from "./element/binding"; import { getCommonBoundingBox } from "./element/bounds"; +import { mutateElement } from "./element/mutateElement"; import { getMaximumGroups } from "./groups"; -import { updateBoundElements } from "./element/binding"; + +import type { BoundingBox } from "./element/bounds"; +import type { ElementsMap, ExcalidrawElement } from "./element/types"; import type Scene from "./scene/Scene"; export interface Alignment { diff --git a/packages/excalidraw/animated-trail.ts b/packages/excalidraw/animated-trail.ts index 97a00546..a2046077 100644 --- a/packages/excalidraw/animated-trail.ts +++ b/packages/excalidraw/animated-trail.ts @@ -1,10 +1,13 @@ -import type { LaserPointerOptions } from "@excalidraw/laser-pointer"; import { LaserPointer } from "@excalidraw/laser-pointer"; -import type { AnimationFrameHandler } from "./animation-frame-handler"; -import type { AppState } from "./types"; + +import type { LaserPointerOptions } from "@excalidraw/laser-pointer"; + +import { SVG_NS } from "./constants"; import { getSvgPathFromStroke, sceneCoordsToViewportCoords } from "./utils"; + +import type { AnimationFrameHandler } from "./animation-frame-handler"; import type App from "./components/App"; -import { SVG_NS } from "./constants"; +import type { AppState } from "./types"; export interface Trail { start(container: SVGSVGElement): void; diff --git a/packages/excalidraw/appState.ts b/packages/excalidraw/appState.ts index 644949e7..acda8468 100644 --- a/packages/excalidraw/appState.ts +++ b/packages/excalidraw/appState.ts @@ -11,6 +11,7 @@ import { THEME, DEFAULT_GRID_STEP, } from "./constants"; + import type { AppState, NormalizedZoomValue } from "./types"; const defaultExportScale = EXPORT_SCALES.includes(devicePixelRatio) diff --git a/packages/excalidraw/change.ts b/packages/excalidraw/change.ts index 1cbf39e8..206f3dcc 100644 --- a/packages/excalidraw/change.ts +++ b/packages/excalidraw/change.ts @@ -1,5 +1,4 @@ import { ENV } from "./constants"; -import type { BindableProp, BindingProp } from "./element/binding"; import { BoundElement, BindableElement, @@ -7,7 +6,6 @@ import { updateBoundElements, } from "./element/binding"; import { LinearElementEditor } from "./element/linearElementEditor"; -import type { ElementUpdate } from "./element/mutateElement"; import { mutateElement, newElementWith } from "./element/mutateElement"; import { getBoundTextElementId, @@ -20,6 +18,19 @@ import { isImageElement, isTextElement, } from "./element/typeChecks"; +import { orderByFractionalIndex, syncMovedIndices } from "./fractionalIndex"; +import { getNonDeletedGroupIds } from "./groups"; +import { getObservedAppState } from "./store"; +import { + arrayToMap, + arrayToObject, + assertNever, + isShallowEqual, + toBrandedType, +} from "./utils"; + +import type { BindableProp, BindingProp } from "./element/binding"; +import type { ElementUpdate } from "./element/mutateElement"; import type { ExcalidrawElement, ExcalidrawImageElement, @@ -30,9 +41,6 @@ import type { OrderedExcalidrawElement, SceneElementsMap, } from "./element/types"; -import { orderByFractionalIndex, syncMovedIndices } from "./fractionalIndex"; -import { getNonDeletedGroupIds } from "./groups"; -import { getObservedAppState } from "./store"; import type { AppState, ObservedAppState, @@ -40,13 +48,6 @@ import type { ObservedStandaloneAppState, } from "./types"; import type { SubtypeOf, ValueOf } from "./utility-types"; -import { - arrayToMap, - arrayToObject, - assertNever, - isShallowEqual, - toBrandedType, -} from "./utils"; /** * Represents the difference between two objects of the same type. diff --git a/packages/excalidraw/charts.test.ts b/packages/excalidraw/charts.test.ts index fcd8823a..94fa92fa 100644 --- a/packages/excalidraw/charts.test.ts +++ b/packages/excalidraw/charts.test.ts @@ -1,6 +1,7 @@ -import type { Spreadsheet } from "./charts"; import { tryParseCells, tryParseNumber, VALID_SPREADSHEET } from "./charts"; +import type { Spreadsheet } from "./charts"; + describe("charts", () => { describe("tryParseNumber", () => { it.each<[string, number]>([ diff --git a/packages/excalidraw/charts.ts b/packages/excalidraw/charts.ts index 65d17e22..e54c55f2 100644 --- a/packages/excalidraw/charts.ts +++ b/packages/excalidraw/charts.ts @@ -1,5 +1,7 @@ -import type { Radians } from "@excalidraw/math"; import { pointFrom } from "@excalidraw/math"; + +import type { Radians } from "@excalidraw/math"; + import { COLOR_PALETTE, DEFAULT_CHART_COLOR_INDEX, @@ -11,9 +13,10 @@ import { VERTICAL_ALIGN, } from "./constants"; import { newElement, newLinearElement, newTextElement } from "./element"; -import type { NonDeletedExcalidrawElement } from "./element/types"; import { randomId } from "./random"; +import type { NonDeletedExcalidrawElement } from "./element/types"; + export type ChartElements = readonly NonDeletedExcalidrawElement[]; const BAR_WIDTH = 32; diff --git a/packages/excalidraw/clients.ts b/packages/excalidraw/clients.ts index 29d24001..6cf4613a 100644 --- a/packages/excalidraw/clients.ts +++ b/packages/excalidraw/clients.ts @@ -6,6 +6,7 @@ import { UserIdleState, } from "./constants"; import { roundRect } from "./renderer/roundRect"; + import type { InteractiveCanvasRenderConfig } from "./scene/types"; import type { Collaborator, diff --git a/packages/excalidraw/clipboard.ts b/packages/excalidraw/clipboard.ts index 296a3415..1b0e9942 100644 --- a/packages/excalidraw/clipboard.ts +++ b/packages/excalidraw/clipboard.ts @@ -1,25 +1,26 @@ -import type { - ExcalidrawElement, - NonDeletedExcalidrawElement, -} from "./element/types"; -import type { BinaryFiles } from "./types"; -import type { Spreadsheet } from "./charts"; import { tryParseSpreadsheet, VALID_SPREADSHEET } from "./charts"; import { ALLOWED_PASTE_MIME_TYPES, EXPORT_DATA_TYPES, MIME_TYPES, } from "./constants"; +import { createFile, isSupportedImageFileType } from "./data/blob"; +import { mutateElement } from "./element/mutateElement"; +import { deepCopyElement } from "./element/newElement"; import { isFrameLikeElement, isInitializedImageElement, } from "./element/typeChecks"; -import { deepCopyElement } from "./element/newElement"; -import { mutateElement } from "./element/mutateElement"; +import { ExcalidrawError } from "./errors"; import { getContainingFrame } from "./frame"; import { arrayToMap, isMemberOf, isPromiseLike } from "./utils"; -import { createFile, isSupportedImageFileType } from "./data/blob"; -import { ExcalidrawError } from "./errors"; + +import type { Spreadsheet } from "./charts"; +import type { + ExcalidrawElement, + NonDeletedExcalidrawElement, +} from "./element/types"; +import type { BinaryFiles } from "./types"; type ElementsClipboard = { type: typeof EXPORT_DATA_TYPES.excalidrawClipboard; diff --git a/packages/excalidraw/colors.ts b/packages/excalidraw/colors.ts index e4cd67a9..84d04bcf 100644 --- a/packages/excalidraw/colors.ts +++ b/packages/excalidraw/colors.ts @@ -1,4 +1,5 @@ import oc from "open-color"; + import type { Merge } from "./utility-types"; // FIXME can't put to utils.ts rn because of circular dependency diff --git a/packages/excalidraw/components/Actions.tsx b/packages/excalidraw/components/Actions.tsx index cd9120fb..c74c1ad8 100644 --- a/packages/excalidraw/components/Actions.tsx +++ b/packages/excalidraw/components/Actions.tsx @@ -1,13 +1,25 @@ +import clsx from "clsx"; import { useState } from "react"; -import type { ActionManager } from "../actions/manager"; -import type { - ExcalidrawElement, - ExcalidrawElementType, - NonDeletedElementsMap, - NonDeletedSceneElementsMap, -} from "../element/types"; + +import { actionToggleZenMode } from "../actions"; + +import { KEYS } from "../keys"; +import { CLASSES } from "../constants"; +import { alignActionsPredicate } from "../actions/actionAlign"; +import { trackEvent } from "../analytics"; +import { useTunnels } from "../context/tunnels"; +import { + shouldAllowVerticalAlign, + suppportsHorizontalAlign, +} from "../element/textElement"; +import { + hasBoundTextElement, + isElbowArrow, + isImageElement, + isLinearElement, + isTextElement, +} from "../element/typeChecks"; import { t } from "../i18n"; -import { useDevice } from "./App"; import { canChangeRoundness, canHaveArrowheads, @@ -16,29 +28,16 @@ import { hasStrokeStyle, hasStrokeWidth, } from "../scene"; +import { hasStrokeColor, toolIsArrow } from "../scene/comparisons"; import { SHAPES } from "../shapes"; -import type { AppClassProperties, AppProps, UIAppState, Zoom } from "../types"; import { capitalizeString, isTransparent } from "../utils"; + +import "./Actions.scss"; + +import { useDevice } from "./App"; import Stack from "./Stack"; import { ToolButton } from "./ToolButton"; -import { hasStrokeColor, toolIsArrow } from "../scene/comparisons"; -import { trackEvent } from "../analytics"; -import { - hasBoundTextElement, - isElbowArrow, - isImageElement, - isLinearElement, - isTextElement, -} from "../element/typeChecks"; -import clsx from "clsx"; -import { actionToggleZenMode } from "../actions"; import { Tooltip } from "./Tooltip"; -import { - shouldAllowVerticalAlign, - suppportsHorizontalAlign, -} from "../element/textElement"; - -import "./Actions.scss"; import DropdownMenu from "./dropdownMenu/DropdownMenu"; import { EmbedIcon, @@ -48,10 +47,15 @@ import { laserPointerToolIcon, MagicIcon, } from "./icons"; -import { KEYS } from "../keys"; -import { useTunnels } from "../context/tunnels"; -import { CLASSES } from "../constants"; -import { alignActionsPredicate } from "../actions/actionAlign"; + +import type { + ExcalidrawElement, + ExcalidrawElementType, + NonDeletedElementsMap, + NonDeletedSceneElementsMap, +} from "../element/types"; +import type { AppClassProperties, AppProps, UIAppState, Zoom } from "../types"; +import type { ActionManager } from "../actions/manager"; export const canChangeStrokeColor = ( appState: UIAppState, diff --git a/packages/excalidraw/components/ActiveConfirmDialog.tsx b/packages/excalidraw/components/ActiveConfirmDialog.tsx index 699fbc61..00c6ad57 100644 --- a/packages/excalidraw/components/ActiveConfirmDialog.tsx +++ b/packages/excalidraw/components/ActiveConfirmDialog.tsx @@ -1,6 +1,7 @@ import { actionClearCanvas } from "../actions"; -import { t } from "../i18n"; import { atom, useAtom } from "../editor-jotai"; +import { t } from "../i18n"; + import { useExcalidrawActionManager } from "./App"; import ConfirmDialog from "./ConfirmDialog"; diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx index dc6d2878..6017b73b 100644 --- a/packages/excalidraw/components/App.tsx +++ b/packages/excalidraw/components/App.tsx @@ -1,10 +1,26 @@ +import { + clamp, + pointFrom, + pointDistance, + vector, + pointRotateRads, + vectorScale, + vectorFromPoint, + vectorSubtract, + vectorDot, + vectorNormalize, +} from "@excalidraw/math"; +import { isPointInShape } from "@excalidraw/utils/collision"; +import { getSelectionBoxShape } from "@excalidraw/utils/geometry/shape"; +import clsx from "clsx"; +import throttle from "lodash.throttle"; +import { nanoid } from "nanoid"; import React, { useContext } from "react"; import { flushSync } from "react-dom"; - -import type { RoughCanvas } from "roughjs/bin/canvas"; import rough from "roughjs/bin/rough"; -import clsx from "clsx"; -import { nanoid } from "nanoid"; + +import type { LocalPoint, Radians } from "@excalidraw/math"; + import { actionAddToLibrary, actionBringForward, @@ -37,17 +53,29 @@ import { actionToggleObjectsSnapMode, actionToggleCropEditor, } from "../actions"; +import { actionWrapTextInContainer } from "../actions/actionBoundText"; +import { actionToggleHandTool, zoomToFit } from "../actions/actionCanvas"; +import { actionPaste } from "../actions/actionClipboard"; +import { actionCopyElementLink } from "../actions/actionElementLink"; +import { actionUnlockAllElements } from "../actions/actionElementLock"; +import { + actionRemoveAllElementsFromFrame, + actionSelectAllElementsInFrame, + actionWrapSelectionInFrame, +} from "../actions/actionFrame"; import { createRedoAction, createUndoAction } from "../actions/actionHistory"; +import { actionTextAutoResize } from "../actions/actionTextAutoResize"; +import { actionToggleViewMode } from "../actions/actionToggleViewMode"; import { ActionManager } from "../actions/manager"; import { actions } from "../actions/register"; -import type { Action, ActionResult } from "../actions/types"; +import { getShortcutFromShortcutName } from "../actions/shortcuts"; import { trackEvent } from "../analytics"; +import { AnimationFrameHandler } from "../animation-frame-handler"; import { getDefaultAppState, isEraserActive, isHandToolActive, } from "../appState"; -import type { PastedMixedContent } from "../clipboard"; import { copyTextToSystemClipboard, parseClipboard } from "../clipboard"; import { APP_NAME, @@ -92,7 +120,6 @@ import { isSafari, type EXPORT_IMAGE_TYPES, } from "../constants"; -import type { ExportedElements } from "../data"; import { exportCanvas, loadFromBlob } from "../data"; import Library, { distributeLibraryItemsOnSquareGrid } from "../data/library"; import { restore, restoreElements } from "../data/restore"; @@ -167,30 +194,6 @@ import { isFlowchartNodeElement, isBindableElement, } from "../element/typeChecks"; -import type { - ExcalidrawBindableElement, - ExcalidrawElement, - ExcalidrawFreeDrawElement, - ExcalidrawGenericElement, - ExcalidrawLinearElement, - ExcalidrawTextElement, - NonDeleted, - InitializedExcalidrawImageElement, - ExcalidrawImageElement, - FileId, - NonDeletedExcalidrawElement, - ExcalidrawTextContainer, - ExcalidrawFrameLikeElement, - ExcalidrawMagicFrameElement, - ExcalidrawIframeLikeElement, - IframeData, - ExcalidrawIframeElement, - ExcalidrawEmbeddableElement, - Ordered, - MagicGenerationData, - ExcalidrawNonSelectionElement, - ExcalidrawArrowElement, -} from "../element/types"; import { getCenter, getDistance } from "../gesture"; import { editGroupForSelectedElement, @@ -224,10 +227,6 @@ import { isSomeElementSelected, } from "../scene"; import Scene from "../scene/Scene"; -import type { - RenderInteractiveSceneCallback, - ScrollBars, -} from "../scene/types"; import { getStateForZoom } from "../scene/zoom"; import { findShapeByKey, @@ -236,36 +235,6 @@ import { getElementShape, isPathALoop, } from "../shapes"; -import { getSelectionBoxShape } from "@excalidraw/utils/geometry/shape"; -import { isPointInShape } from "@excalidraw/utils/collision"; -import type { - AppClassProperties, - AppProps, - AppState, - BinaryFileData, - DataURL, - ExcalidrawImperativeAPI, - BinaryFiles, - Gesture, - GestureEvent, - LibraryItems, - PointerDownState, - SceneData, - Device, - FrameNameBoundsCache, - SidebarName, - SidebarTabName, - KeyboardModifiersObject, - CollaboratorPointer, - ToolType, - OnUserFollowedPayload, - UnsubscribeCallback, - EmbedsValidationStatus, - ElementsPendingErasure, - GenerateDiagramToCode, - NullableGridSize, - Offsets, -} from "../types"; import { debounce, distance, @@ -299,11 +268,6 @@ import { maybeParseEmbedSrc, getEmbedLink, } from "../element/embeddable"; -import type { ContextMenuItems } from "./ContextMenu"; -import { ContextMenu, CONTEXT_MENU_SEPARATOR } from "./ContextMenu"; -import LayerUI from "./LayerUI"; -import { Toast } from "./Toast"; -import { actionToggleViewMode } from "../actions/actionToggleViewMode"; import { dataURLToFile, dataURLToString, @@ -326,8 +290,6 @@ import { normalizeSVG, updateImageCache as _updateImageCache, } from "../element/image"; -import throttle from "lodash.throttle"; -import type { FileSystemHandle } from "../data/filesystem"; import { fileOpen } from "../data/filesystem"; import { bindTextToShapeAfterDuplication, @@ -343,7 +305,6 @@ import { } from "../components/hyperlink/Hyperlink"; import { isLocalLink, normalizeLink, toValidURL } from "../data/url"; import { shouldShowBoundingBox } from "../element/transformHandles"; -import { actionUnlockAllElements } from "../actions/actionElementLock"; import { Fonts, getLineHeight } from "../fonts"; import { getFrameChildren, @@ -366,15 +327,7 @@ import { excludeElementsInFramesFromSelection, makeNextSelectedElementIds, } from "../scene/selection"; -import { actionPaste } from "../actions/actionClipboard"; -import { - actionRemoveAllElementsFromFrame, - actionSelectAllElementsInFrame, - actionWrapSelectionInFrame, -} from "../actions/actionFrame"; -import { actionToggleHandTool, zoomToFit } from "../actions/actionCanvas"; import { editorJotaiStore } from "../editor-jotai"; -import { activeConfirmDialogAtom } from "./ActiveConfirmDialog"; import { ImageSceneDataError } from "../errors"; import { getSnapLinesAtPointer, @@ -389,17 +342,9 @@ import { isGridModeEnabled, getGridPoint, } from "../snapping"; -import { actionWrapTextInContainer } from "../actions/actionBoundText"; -import BraveMeasureTextError from "./BraveMeasureTextError"; -import { activeEyeDropperAtom } from "./EyeDropper"; -import type { ExcalidrawElementSkeleton } from "../data/transform"; import { convertToExcalidrawElements } from "../data/transform"; -import type { ValueOf } from "../utility-types"; -import { isSidebarDockedAtom } from "./Sidebar/Sidebar"; -import { StaticCanvas, InteractiveCanvas } from "./canvases"; import { Renderer } from "../scene/Renderer"; import { ShapeCache } from "../scene/ShapeCache"; -import { SVGLayer } from "./SVGLayer"; import { setEraserCursor, setCursor, @@ -409,11 +354,7 @@ import { import { Emitter } from "../emitter"; import { ElementCanvasButtons } from "../element/ElementCanvasButtons"; import { COLOR_PALETTE } from "../colors"; -import { ElementCanvasButton } from "./MagicButton"; -import { MagicIcon, copyIcon, fullscreenIcon } from "./icons"; -import FollowMode from "./FollowMode/FollowMode"; import { Store, CaptureUpdateAction } from "../store"; -import { AnimationFrameHandler } from "../animation-frame-handler"; import { AnimatedTrail } from "../animated-trail"; import { LaserTrails } from "../laser-trails"; import { withBatchedUpdates, withBatchedUpdatesThrottled } from "../reactUtils"; @@ -426,37 +367,15 @@ import { import { textWysiwyg } from "../element/textWysiwyg"; import { isOverScrollBars } from "../scene/scrollbars"; import { syncInvalidIndices, syncMovedIndices } from "../fractionalIndex"; -import { - isPointHittingLink, - isPointHittingLinkIcon, -} from "./hyperlink/helpers"; -import { getShortcutFromShortcutName } from "../actions/shortcuts"; -import { actionTextAutoResize } from "../actions/actionTextAutoResize"; import { getVisibleSceneBounds } from "../element/bounds"; import { isMaybeMermaidDefinition } from "../mermaid"; -import NewElementCanvas from "./canvases/NewElementCanvas"; import { FlowChartCreator, FlowChartNavigator, getLinkDirectionFromKey, } from "../element/flowchart"; -import { searchItemInFocusAtom } from "./SearchMenu"; -import type { LocalPoint, Radians } from "@excalidraw/math"; -import { - clamp, - pointFrom, - pointDistance, - vector, - pointRotateRads, - vectorScale, - vectorFromPoint, - vectorSubtract, - vectorDot, - vectorNormalize, -} from "@excalidraw/math"; import { cropElement } from "../element/cropElement"; import { wrapText } from "../element/textWrapping"; -import { actionCopyElementLink } from "../actions/actionElementLink"; import { isElementLink, parseElementLinkFromURL } from "../element/elementLink"; import { isMeasureTextSupported, @@ -468,6 +387,90 @@ import { getMinTextElementWidth, } from "../element/textMeasurements"; +import { activeConfirmDialogAtom } from "./ActiveConfirmDialog"; +import BraveMeasureTextError from "./BraveMeasureTextError"; +import { ContextMenu, CONTEXT_MENU_SEPARATOR } from "./ContextMenu"; +import { activeEyeDropperAtom } from "./EyeDropper"; +import FollowMode from "./FollowMode/FollowMode"; +import LayerUI from "./LayerUI"; +import { ElementCanvasButton } from "./MagicButton"; +import { SVGLayer } from "./SVGLayer"; +import { searchItemInFocusAtom } from "./SearchMenu"; +import { isSidebarDockedAtom } from "./Sidebar/Sidebar"; +import { StaticCanvas, InteractiveCanvas } from "./canvases"; +import NewElementCanvas from "./canvases/NewElementCanvas"; +import { + isPointHittingLink, + isPointHittingLinkIcon, +} from "./hyperlink/helpers"; +import { MagicIcon, copyIcon, fullscreenIcon } from "./icons"; +import { Toast } from "./Toast"; + +import type { Action, ActionResult } from "../actions/types"; +import type { PastedMixedContent } from "../clipboard"; +import type { ExportedElements } from "../data"; +import type { ContextMenuItems } from "./ContextMenu"; +import type { FileSystemHandle } from "../data/filesystem"; +import type { ExcalidrawElementSkeleton } from "../data/transform"; +import type { + ExcalidrawBindableElement, + ExcalidrawElement, + ExcalidrawFreeDrawElement, + ExcalidrawGenericElement, + ExcalidrawLinearElement, + ExcalidrawTextElement, + NonDeleted, + InitializedExcalidrawImageElement, + ExcalidrawImageElement, + FileId, + NonDeletedExcalidrawElement, + ExcalidrawTextContainer, + ExcalidrawFrameLikeElement, + ExcalidrawMagicFrameElement, + ExcalidrawIframeLikeElement, + IframeData, + ExcalidrawIframeElement, + ExcalidrawEmbeddableElement, + Ordered, + MagicGenerationData, + ExcalidrawNonSelectionElement, + ExcalidrawArrowElement, +} from "../element/types"; +import type { + RenderInteractiveSceneCallback, + ScrollBars, +} from "../scene/types"; +import type { + AppClassProperties, + AppProps, + AppState, + BinaryFileData, + DataURL, + ExcalidrawImperativeAPI, + BinaryFiles, + Gesture, + GestureEvent, + LibraryItems, + PointerDownState, + SceneData, + Device, + FrameNameBoundsCache, + SidebarName, + SidebarTabName, + KeyboardModifiersObject, + CollaboratorPointer, + ToolType, + OnUserFollowedPayload, + UnsubscribeCallback, + EmbedsValidationStatus, + ElementsPendingErasure, + GenerateDiagramToCode, + NullableGridSize, + Offsets, +} from "../types"; +import type { ValueOf } from "../utility-types"; +import type { RoughCanvas } from "roughjs/bin/canvas"; + const AppContext = React.createContext(null!); const AppPropsContext = React.createContext(null!); diff --git a/packages/excalidraw/components/Avatar.tsx b/packages/excalidraw/components/Avatar.tsx index 9ddc319c..648fb5fc 100644 --- a/packages/excalidraw/components/Avatar.tsx +++ b/packages/excalidraw/components/Avatar.tsx @@ -1,8 +1,9 @@ -import "./Avatar.scss"; - +import clsx from "clsx"; import React, { useState } from "react"; + import { getNameInitial } from "../clients"; -import clsx from "clsx"; + +import "./Avatar.scss"; type AvatarProps = { onClick: (e: React.MouseEvent) => void; diff --git a/packages/excalidraw/components/Button.tsx b/packages/excalidraw/components/Button.tsx index 779cee58..9512d607 100644 --- a/packages/excalidraw/components/Button.tsx +++ b/packages/excalidraw/components/Button.tsx @@ -1,6 +1,8 @@ import clsx from "clsx"; import React from "react"; + import { composeEventHandlers } from "../utils"; + import "./Button.scss"; interface ButtonProps diff --git a/packages/excalidraw/components/ButtonIcon.tsx b/packages/excalidraw/components/ButtonIcon.tsx index cbbd73df..27b4dc3d 100644 --- a/packages/excalidraw/components/ButtonIcon.tsx +++ b/packages/excalidraw/components/ButtonIcon.tsx @@ -1,9 +1,10 @@ -import { forwardRef } from "react"; -import type { JSX } from "react"; import clsx from "clsx"; +import { forwardRef } from "react"; import "./ButtonIcon.scss"; +import type { JSX } from "react"; + interface ButtonIconProps { icon: JSX.Element; title: string; diff --git a/packages/excalidraw/components/ButtonIconCycle.tsx b/packages/excalidraw/components/ButtonIconCycle.tsx index b73a8ec5..53c5e12b 100644 --- a/packages/excalidraw/components/ButtonIconCycle.tsx +++ b/packages/excalidraw/components/ButtonIconCycle.tsx @@ -1,6 +1,7 @@ -import type { JSX } from "react"; import clsx from "clsx"; +import type { JSX } from "react"; + export const ButtonIconCycle = ({ options, value, diff --git a/packages/excalidraw/components/ButtonIconSelect.tsx b/packages/excalidraw/components/ButtonIconSelect.tsx index 26191b50..45665e4c 100644 --- a/packages/excalidraw/components/ButtonIconSelect.tsx +++ b/packages/excalidraw/components/ButtonIconSelect.tsx @@ -1,7 +1,9 @@ -import type { JSX } from "react"; import clsx from "clsx"; + import { ButtonIcon } from "./ButtonIcon"; +import type { JSX } from "react"; + // TODO: It might be "clever" to add option.icon to the existing component export const ButtonIconSelect = ( props: { diff --git a/packages/excalidraw/components/CheckboxItem.tsx b/packages/excalidraw/components/CheckboxItem.tsx index 21c5cfaf..9c757eab 100644 --- a/packages/excalidraw/components/CheckboxItem.tsx +++ b/packages/excalidraw/components/CheckboxItem.tsx @@ -1,5 +1,6 @@ -import React from "react"; import clsx from "clsx"; +import React from "react"; + import { checkIcon } from "./icons"; import "./CheckboxItem.scss"; diff --git a/packages/excalidraw/components/ColorPicker/ColorInput.tsx b/packages/excalidraw/components/ColorPicker/ColorInput.tsx index 837c8870..dc7d572a 100644 --- a/packages/excalidraw/components/ColorPicker/ColorInput.tsx +++ b/packages/excalidraw/components/ColorPicker/ColorInput.tsx @@ -1,15 +1,18 @@ +import clsx from "clsx"; import { useCallback, useEffect, useRef, useState } from "react"; -import { getColor } from "./ColorPicker"; -import type { ColorPickerType } from "./colorPickerUtils"; -import { activeColorPickerSectionAtom } from "./colorPickerUtils"; -import { eyeDropperIcon } from "../icons"; + import { useAtom } from "../../editor-jotai"; -import { KEYS } from "../../keys"; -import { activeEyeDropperAtom } from "../EyeDropper"; -import clsx from "clsx"; import { t } from "../../i18n"; -import { useDevice } from "../App"; +import { KEYS } from "../../keys"; import { getShortcutKey } from "../../utils"; +import { useDevice } from "../App"; +import { activeEyeDropperAtom } from "../EyeDropper"; +import { eyeDropperIcon } from "../icons"; + +import { getColor } from "./ColorPicker"; +import { activeColorPickerSectionAtom } from "./colorPickerUtils"; + +import type { ColorPickerType } from "./colorPickerUtils"; interface ColorInputProps { color: string; diff --git a/packages/excalidraw/components/ColorPicker/ColorPicker.tsx b/packages/excalidraw/components/ColorPicker/ColorPicker.tsx index 74d55270..7f6ee8a8 100644 --- a/packages/excalidraw/components/ColorPicker/ColorPicker.tsx +++ b/packages/excalidraw/components/ColorPicker/ColorPicker.tsx @@ -1,26 +1,29 @@ -import { isTransparent } from "../../utils"; -import type { ExcalidrawElement } from "../../element/types"; -import type { AppState } from "../../types"; -import { TopPicks } from "./TopPicks"; -import { ButtonSeparator } from "../ButtonSeparator"; -import { Picker } from "./Picker"; import * as Popover from "@radix-ui/react-popover"; -import type { ColorPickerType } from "./colorPickerUtils"; -import { activeColorPickerSectionAtom } from "./colorPickerUtils"; -import { useExcalidrawContainer } from "../App"; -import type { ColorTuple, ColorPaletteCustom } from "../../colors"; -import { COLOR_PALETTE } from "../../colors"; -import PickerHeading from "./PickerHeading"; -import { t } from "../../i18n"; import clsx from "clsx"; import { useRef } from "react"; + +import { COLOR_PALETTE } from "../../colors"; import { useAtom } from "../../editor-jotai"; -import { ColorInput } from "./ColorInput"; +import { t } from "../../i18n"; +import { isTransparent } from "../../utils"; +import { useExcalidrawContainer } from "../App"; +import { ButtonSeparator } from "../ButtonSeparator"; import { activeEyeDropperAtom } from "../EyeDropper"; import { PropertiesPopover } from "../PropertiesPopover"; +import { ColorInput } from "./ColorInput"; +import { Picker } from "./Picker"; +import PickerHeading from "./PickerHeading"; +import { TopPicks } from "./TopPicks"; +import { activeColorPickerSectionAtom } from "./colorPickerUtils"; + import "./ColorPicker.scss"; +import type { ColorPickerType } from "./colorPickerUtils"; +import type { ColorTuple, ColorPaletteCustom } from "../../colors"; +import type { ExcalidrawElement } from "../../element/types"; +import type { AppState } from "../../types"; + const isValidColor = (color: string) => { const style = new Option().style; style.color = color; diff --git a/packages/excalidraw/components/ColorPicker/CustomColorList.tsx b/packages/excalidraw/components/ColorPicker/CustomColorList.tsx index 5fe1e3e5..2c735102 100644 --- a/packages/excalidraw/components/ColorPicker/CustomColorList.tsx +++ b/packages/excalidraw/components/ColorPicker/CustomColorList.tsx @@ -1,8 +1,10 @@ import clsx from "clsx"; -import { useAtom } from "../../editor-jotai"; import { useEffect, useRef } from "react"; -import { activeColorPickerSectionAtom } from "./colorPickerUtils"; + +import { useAtom } from "../../editor-jotai"; + import HotkeyLabel from "./HotkeyLabel"; +import { activeColorPickerSectionAtom } from "./colorPickerUtils"; interface CustomColorListProps { colors: string[]; diff --git a/packages/excalidraw/components/ColorPicker/HotkeyLabel.tsx b/packages/excalidraw/components/ColorPicker/HotkeyLabel.tsx index 145060d1..6e4d5e39 100644 --- a/packages/excalidraw/components/ColorPicker/HotkeyLabel.tsx +++ b/packages/excalidraw/components/ColorPicker/HotkeyLabel.tsx @@ -1,4 +1,5 @@ import React from "react"; + import { getContrastYIQ } from "./colorPickerUtils"; interface HotkeyLabelProps { diff --git a/packages/excalidraw/components/ColorPicker/Picker.tsx b/packages/excalidraw/components/ColorPicker/Picker.tsx index 88d68767..9f311e9c 100644 --- a/packages/excalidraw/components/ColorPicker/Picker.tsx +++ b/packages/excalidraw/components/ColorPicker/Picker.tsx @@ -1,28 +1,29 @@ import React, { useEffect, useState } from "react"; -import { t } from "../../i18n"; - -import type { ExcalidrawElement } from "../../element/types"; -import { ShadeList } from "./ShadeList"; -import PickerColorList from "./PickerColorList"; +import { + DEFAULT_ELEMENT_BACKGROUND_COLOR_INDEX, + DEFAULT_ELEMENT_STROKE_COLOR_INDEX, +} from "../../colors"; +import { EVENT } from "../../constants"; import { useAtom } from "../../editor-jotai"; +import { t } from "../../i18n"; +import { KEYS } from "../../keys"; + import { CustomColorList } from "./CustomColorList"; -import { colorPickerKeyNavHandler } from "./keyboardNavHandlers"; +import PickerColorList from "./PickerColorList"; import PickerHeading from "./PickerHeading"; -import type { ColorPickerType } from "./colorPickerUtils"; +import { ShadeList } from "./ShadeList"; import { activeColorPickerSectionAtom, getColorNameAndShadeFromColor, getMostUsedCustomColors, isCustomColor, } from "./colorPickerUtils"; +import { colorPickerKeyNavHandler } from "./keyboardNavHandlers"; + +import type { ColorPickerType } from "./colorPickerUtils"; import type { ColorPaletteCustom } from "../../colors"; -import { - DEFAULT_ELEMENT_BACKGROUND_COLOR_INDEX, - DEFAULT_ELEMENT_STROKE_COLOR_INDEX, -} from "../../colors"; -import { KEYS } from "../../keys"; -import { EVENT } from "../../constants"; +import type { ExcalidrawElement } from "../../element/types"; interface PickerProps { color: string; diff --git a/packages/excalidraw/components/ColorPicker/PickerColorList.tsx b/packages/excalidraw/components/ColorPicker/PickerColorList.tsx index f43559d9..b355228f 100644 --- a/packages/excalidraw/components/ColorPicker/PickerColorList.tsx +++ b/packages/excalidraw/components/ColorPicker/PickerColorList.tsx @@ -1,15 +1,18 @@ import clsx from "clsx"; -import { useAtom } from "../../editor-jotai"; import { useEffect, useRef } from "react"; + +import { useAtom } from "../../editor-jotai"; +import { t } from "../../i18n"; + +import HotkeyLabel from "./HotkeyLabel"; import { activeColorPickerSectionAtom, colorPickerHotkeyBindings, getColorNameAndShadeFromColor, } from "./colorPickerUtils"; -import HotkeyLabel from "./HotkeyLabel"; + import type { ColorPaletteCustom } from "../../colors"; import type { TranslationKeys } from "../../i18n"; -import { t } from "../../i18n"; interface PickerColorListProps { palette: ColorPaletteCustom; diff --git a/packages/excalidraw/components/ColorPicker/ShadeList.tsx b/packages/excalidraw/components/ColorPicker/ShadeList.tsx index 8d3d4cc2..35d89ea8 100644 --- a/packages/excalidraw/components/ColorPicker/ShadeList.tsx +++ b/packages/excalidraw/components/ColorPicker/ShadeList.tsx @@ -1,12 +1,15 @@ import clsx from "clsx"; -import { useAtom } from "../../editor-jotai"; import { useEffect, useRef } from "react"; + +import { useAtom } from "../../editor-jotai"; +import { t } from "../../i18n"; + +import HotkeyLabel from "./HotkeyLabel"; import { activeColorPickerSectionAtom, getColorNameAndShadeFromColor, } from "./colorPickerUtils"; -import HotkeyLabel from "./HotkeyLabel"; -import { t } from "../../i18n"; + import type { ColorPaletteCustom } from "../../colors"; interface ShadeListProps { diff --git a/packages/excalidraw/components/ColorPicker/TopPicks.tsx b/packages/excalidraw/components/ColorPicker/TopPicks.tsx index 5c69d1e4..9bd8fdb9 100644 --- a/packages/excalidraw/components/ColorPicker/TopPicks.tsx +++ b/packages/excalidraw/components/ColorPicker/TopPicks.tsx @@ -1,11 +1,13 @@ import clsx from "clsx"; -import type { ColorPickerType } from "./colorPickerUtils"; + import { DEFAULT_CANVAS_BACKGROUND_PICKS, DEFAULT_ELEMENT_BACKGROUND_PICKS, DEFAULT_ELEMENT_STROKE_PICKS, } from "../../colors"; +import type { ColorPickerType } from "./colorPickerUtils"; + interface TopPicksProps { onChange: (color: string) => void; type: ColorPickerType; diff --git a/packages/excalidraw/components/ColorPicker/colorPickerUtils.ts b/packages/excalidraw/components/ColorPicker/colorPickerUtils.ts index 2733b7ab..bbb4e587 100644 --- a/packages/excalidraw/components/ColorPicker/colorPickerUtils.ts +++ b/packages/excalidraw/components/ColorPicker/colorPickerUtils.ts @@ -1,8 +1,9 @@ -import type { ExcalidrawElement } from "../../element/types"; -import type { ColorPickerColor, ColorPaletteCustom } from "../../colors"; import { MAX_CUSTOM_COLORS_USED_IN_CANVAS } from "../../colors"; import { atom } from "../../editor-jotai"; +import type { ColorPickerColor, ColorPaletteCustom } from "../../colors"; +import type { ExcalidrawElement } from "../../element/types"; + export const getColorNameAndShadeFromColor = ({ palette, color, diff --git a/packages/excalidraw/components/ColorPicker/keyboardNavHandlers.ts b/packages/excalidraw/components/ColorPicker/keyboardNavHandlers.ts index 7767692e..c4e32170 100644 --- a/packages/excalidraw/components/ColorPicker/keyboardNavHandlers.ts +++ b/packages/excalidraw/components/ColorPicker/keyboardNavHandlers.ts @@ -1,16 +1,18 @@ +import { COLORS_PER_ROW, COLOR_PALETTE } from "../../colors"; import { KEYS } from "../../keys"; + +import { + colorPickerHotkeyBindings, + getColorNameAndShadeFromColor, +} from "./colorPickerUtils"; + +import type { ActiveColorPickerSectionAtomType } from "./colorPickerUtils"; import type { ColorPickerColor, ColorPalette, ColorPaletteCustom, } from "../../colors"; -import { COLORS_PER_ROW, COLOR_PALETTE } from "../../colors"; import type { ValueOf } from "../../utility-types"; -import type { ActiveColorPickerSectionAtomType } from "./colorPickerUtils"; -import { - colorPickerHotkeyBindings, - getColorNameAndShadeFromColor, -} from "./colorPickerUtils"; const arrowHandler = ( eventKey: string, diff --git a/packages/excalidraw/components/CommandPalette/CommandPalette.tsx b/packages/excalidraw/components/CommandPalette/CommandPalette.tsx index cc3c782c..7febb61c 100644 --- a/packages/excalidraw/components/CommandPalette/CommandPalette.tsx +++ b/packages/excalidraw/components/CommandPalette/CommandPalette.tsx @@ -1,21 +1,34 @@ +import clsx from "clsx"; +import fuzzy from "fuzzy"; import { useEffect, useRef, useState } from "react"; + +import { + actionClearCanvas, + actionLink, + actionToggleSearchMenu, +} from "../../actions"; +import { + actionCopyElementLink, + actionLinkToElement, +} from "../../actions/actionElementLink"; +import { getShortcutFromShortcutName } from "../../actions/shortcuts"; +import { trackEvent } from "../../analytics"; +import { DEFAULT_SIDEBAR, EVENT } from "../../constants"; +import { useUIAppState } from "../../context/ui-appState"; +import { deburr } from "../../deburr"; +import { atom, useAtom, editorJotaiStore } from "../../editor-jotai"; +import { t } from "../../i18n"; +import { KEYS } from "../../keys"; import { useApp, useAppProps, useExcalidrawActionManager, useExcalidrawSetAppState, } from "../App"; -import { KEYS } from "../../keys"; import { Dialog } from "../Dialog"; +import { InlineIcon } from "../InlineIcon"; import { TextField } from "../TextField"; -import clsx from "clsx"; import { getSelectedElements } from "../../scene"; -import type { Action } from "../../actions/types"; -import type { TranslationKeys } from "../../i18n"; -import { t } from "../../i18n"; -import type { ShortcutName } from "../../actions/shortcuts"; -import { getShortcutFromShortcutName } from "../../actions/shortcuts"; -import { DEFAULT_SIDEBAR, EVENT } from "../../constants"; import { LockedIcon, UnlockedIcon, @@ -28,37 +41,29 @@ import { brainIconThin, LibraryIcon, } from "../icons"; -import fuzzy from "fuzzy"; -import { useUIAppState } from "../../context/ui-appState"; -import type { AppProps, AppState, UIAppState } from "../../types"; + import { capitalizeString, getShortcutKey, isWritableElement, } from "../../utils"; -import { atom, useAtom, editorJotaiStore } from "../../editor-jotai"; -import { deburr } from "../../deburr"; -import type { MarkRequired } from "../../utility-types"; -import { InlineIcon } from "../InlineIcon"; + import { SHAPES } from "../../shapes"; import { canChangeBackgroundColor, canChangeStrokeColor } from "../Actions"; import { useStableCallback } from "../../hooks/useStableCallback"; -import { - actionClearCanvas, - actionLink, - actionToggleSearchMenu, -} from "../../actions"; import { activeConfirmDialogAtom } from "../ActiveConfirmDialog"; -import type { CommandPaletteItem } from "./types"; -import * as defaultItems from "./defaultCommandPaletteItems"; -import { trackEvent } from "../../analytics"; import { useStable } from "../../hooks/useStable"; +import * as defaultItems from "./defaultCommandPaletteItems"; + import "./CommandPalette.scss"; -import { - actionCopyElementLink, - actionLinkToElement, -} from "../../actions/actionElementLink"; + +import type { CommandPaletteItem } from "./types"; +import type { AppProps, AppState, UIAppState } from "../../types"; +import type { MarkRequired } from "../../utility-types"; +import type { ShortcutName } from "../../actions/shortcuts"; +import type { TranslationKeys } from "../../i18n"; +import type { Action } from "../../actions/types"; const lastUsedPaletteItem = atom(null); diff --git a/packages/excalidraw/components/CommandPalette/defaultCommandPaletteItems.ts b/packages/excalidraw/components/CommandPalette/defaultCommandPaletteItems.ts index dea14ff2..485e1767 100644 --- a/packages/excalidraw/components/CommandPalette/defaultCommandPaletteItems.ts +++ b/packages/excalidraw/components/CommandPalette/defaultCommandPaletteItems.ts @@ -1,4 +1,5 @@ import { actionToggleTheme } from "../../actions"; + import type { CommandPaletteItem } from "./types"; export const toggleTheme: CommandPaletteItem = { diff --git a/packages/excalidraw/components/ConfirmDialog.tsx b/packages/excalidraw/components/ConfirmDialog.tsx index 81073ecd..cb402dd9 100644 --- a/packages/excalidraw/components/ConfirmDialog.tsx +++ b/packages/excalidraw/components/ConfirmDialog.tsx @@ -1,13 +1,16 @@ import { flushSync } from "react-dom"; + +import { useSetAtom } from "../editor-jotai"; import { t } from "../i18n"; -import type { DialogProps } from "./Dialog"; -import { Dialog } from "./Dialog"; -import "./ConfirmDialog.scss"; +import { Dialog } from "./Dialog"; import DialogActionButton from "./DialogActionButton"; import { isLibraryMenuOpenAtom } from "./LibraryMenu"; import { useExcalidrawContainer, useExcalidrawSetAppState } from "./App"; -import { useSetAtom } from "../editor-jotai"; + +import "./ConfirmDialog.scss"; + +import type { DialogProps } from "./Dialog"; interface Props extends Omit { onConfirm: () => void; diff --git a/packages/excalidraw/components/ContextMenu.tsx b/packages/excalidraw/components/ContextMenu.tsx index 517e5fae..3295d1d0 100644 --- a/packages/excalidraw/components/ContextMenu.tsx +++ b/packages/excalidraw/components/ContextMenu.tsx @@ -1,15 +1,20 @@ import clsx from "clsx"; -import { Popover } from "./Popover"; -import type { TranslationKeys } from "../i18n"; +import React from "react"; + +import { getShortcutFromShortcutName } from "../actions/shortcuts"; import { t } from "../i18n"; +import { useExcalidrawAppState, useExcalidrawElements } from "./App"; + +import { Popover } from "./Popover"; + import "./ContextMenu.scss"; + +import type { ActionManager } from "../actions/manager"; import type { ShortcutName } from "../actions/shortcuts"; -import { getShortcutFromShortcutName } from "../actions/shortcuts"; import type { Action } from "../actions/types"; -import type { ActionManager } from "../actions/manager"; -import { useExcalidrawAppState, useExcalidrawElements } from "./App"; -import React from "react"; + +import type { TranslationKeys } from "../i18n"; export type ContextMenuItem = typeof CONTEXT_MENU_SEPARATOR | Action; diff --git a/packages/excalidraw/components/DarkModeToggle.tsx b/packages/excalidraw/components/DarkModeToggle.tsx index 6292ba5e..f0471294 100644 --- a/packages/excalidraw/components/DarkModeToggle.tsx +++ b/packages/excalidraw/components/DarkModeToggle.tsx @@ -1,8 +1,10 @@ -import "./ToolIcon.scss"; - +import { THEME } from "../constants"; import { t } from "../i18n"; + import { ToolButton } from "./ToolButton"; -import { THEME } from "../constants"; + +import "./ToolIcon.scss"; + import type { Theme } from "../element/types"; // We chose to use only explicit toggle and not a third option for system value, diff --git a/packages/excalidraw/components/DefaultSidebar.test.tsx b/packages/excalidraw/components/DefaultSidebar.test.tsx index ac1e2961..f8bc0dbb 100644 --- a/packages/excalidraw/components/DefaultSidebar.test.tsx +++ b/packages/excalidraw/components/DefaultSidebar.test.tsx @@ -1,4 +1,5 @@ import React from "react"; + import { DEFAULT_SIDEBAR } from "../constants"; import { DefaultSidebar } from "../index"; import { @@ -6,6 +7,7 @@ import { waitFor, withExcalidrawDimensions, } from "../tests/test-utils"; + import { assertExcalidrawWithSidebar, assertSidebarDockButton, diff --git a/packages/excalidraw/components/DefaultSidebar.tsx b/packages/excalidraw/components/DefaultSidebar.tsx index 70b0c2d6..cd9683c6 100644 --- a/packages/excalidraw/components/DefaultSidebar.tsx +++ b/packages/excalidraw/components/DefaultSidebar.tsx @@ -1,4 +1,5 @@ import clsx from "clsx"; + import { CANVAS_SEARCH_TAB, DEFAULT_SIDEBAR, @@ -6,17 +7,20 @@ import { } from "../constants"; import { useTunnels } from "../context/tunnels"; import { useUIAppState } from "../context/ui-appState"; -import type { MarkOptional, Merge } from "../utility-types"; import { composeEventHandlers } from "../utils"; + +import "../components/dropdownMenu/DropdownMenu.scss"; + import { useExcalidrawSetAppState } from "./App"; -import { withInternalFallback } from "./hoc/withInternalFallback"; import { LibraryMenu } from "./LibraryMenu"; -import type { SidebarProps, SidebarTriggerProps } from "./Sidebar/common"; -import { Sidebar } from "./Sidebar/Sidebar"; -import "../components/dropdownMenu/DropdownMenu.scss"; import { SearchMenu } from "./SearchMenu"; +import { Sidebar } from "./Sidebar/Sidebar"; +import { withInternalFallback } from "./hoc/withInternalFallback"; import { LibraryIcon, searchIcon } from "./icons"; +import type { MarkOptional, Merge } from "../utility-types"; +import type { SidebarProps, SidebarTriggerProps } from "./Sidebar/common"; + const DefaultSidebarTrigger = withInternalFallback( "DefaultSidebarTrigger", ( diff --git a/packages/excalidraw/components/DiagramToCodePlugin/DiagramToCodePlugin.tsx b/packages/excalidraw/components/DiagramToCodePlugin/DiagramToCodePlugin.tsx index 95059996..e225ca19 100644 --- a/packages/excalidraw/components/DiagramToCodePlugin/DiagramToCodePlugin.tsx +++ b/packages/excalidraw/components/DiagramToCodePlugin/DiagramToCodePlugin.tsx @@ -1,5 +1,7 @@ import { useLayoutEffect } from "react"; + import { useApp } from "../App"; + import type { GenerateDiagramToCode } from "../../types"; export const DiagramToCodePlugin = (props: { diff --git a/packages/excalidraw/components/Dialog.tsx b/packages/excalidraw/components/Dialog.tsx index 0a105cf8..cf6b1254 100644 --- a/packages/excalidraw/components/Dialog.tsx +++ b/packages/excalidraw/components/Dialog.tsx @@ -1,21 +1,24 @@ import clsx from "clsx"; import React, { useEffect, useState } from "react"; + +import { useSetAtom } from "../editor-jotai"; import { useCallbackRefState } from "../hooks/useCallbackRefState"; +import { t } from "../i18n"; +import { KEYS } from "../keys"; +import { queryFocusableElements } from "../utils"; + import { useExcalidrawContainer, useDevice, useExcalidrawSetAppState, } from "./App"; -import { KEYS } from "../keys"; -import "./Dialog.scss"; import { Island } from "./Island"; -import { Modal } from "./Modal"; -import { queryFocusableElements } from "../utils"; import { isLibraryMenuOpenAtom } from "./LibraryMenu"; -import { useSetAtom } from "../editor-jotai"; -import { t } from "../i18n"; +import { Modal } from "./Modal"; import { CloseIcon } from "./icons"; +import "./Dialog.scss"; + export type DialogSize = number | "small" | "regular" | "wide" | undefined; export interface DialogProps { diff --git a/packages/excalidraw/components/DialogActionButton.tsx b/packages/excalidraw/components/DialogActionButton.tsx index 0c4f9d58..1637fc31 100644 --- a/packages/excalidraw/components/DialogActionButton.tsx +++ b/packages/excalidraw/components/DialogActionButton.tsx @@ -1,8 +1,11 @@ import clsx from "clsx"; -import type { ReactNode } from "react"; -import "./DialogActionButton.scss"; + import Spinner from "./Spinner"; +import "./DialogActionButton.scss"; + +import type { ReactNode } from "react"; + interface DialogActionButtonProps { label: string; children?: ReactNode; diff --git a/packages/excalidraw/components/ElementLinkDialog.tsx b/packages/excalidraw/components/ElementLinkDialog.tsx index 2ec3eaa0..7cf32963 100644 --- a/packages/excalidraw/components/ElementLinkDialog.tsx +++ b/packages/excalidraw/components/ElementLinkDialog.tsx @@ -1,21 +1,24 @@ -import { TextField } from "./TextField"; -import type { AppProps, AppState, UIAppState } from "../types"; -import DialogActionButton from "./DialogActionButton"; -import { getSelectedElements } from "../scene"; +import { useCallback, useEffect, useState } from "react"; + +import { normalizeLink } from "../data/url"; import { defaultGetElementLinkFromSelection, getLinkIdAndTypeFromSelection, } from "../element/elementLink"; import { mutateElement } from "../element/mutateElement"; -import { useCallback, useEffect, useState } from "react"; import { t } from "../i18n"; -import type { ElementsMap, ExcalidrawElement } from "../element/types"; +import { KEYS } from "../keys"; +import { getSelectedElements } from "../scene"; + +import DialogActionButton from "./DialogActionButton"; +import { TextField } from "./TextField"; import { ToolButton } from "./ToolButton"; import { TrashIcon } from "./icons"; -import { KEYS } from "../keys"; import "./ElementLinkDialog.scss"; -import { normalizeLink } from "../data/url"; + +import type { ElementsMap, ExcalidrawElement } from "../element/types"; +import type { AppProps, AppState, UIAppState } from "../types"; const ElementLinkDialog = ({ sourceElementId, diff --git a/packages/excalidraw/components/ErrorDialog.tsx b/packages/excalidraw/components/ErrorDialog.tsx index 74d265f7..132b292b 100644 --- a/packages/excalidraw/components/ErrorDialog.tsx +++ b/packages/excalidraw/components/ErrorDialog.tsx @@ -1,8 +1,9 @@ import React, { useState } from "react"; + import { t } from "../i18n"; -import { Dialog } from "./Dialog"; import { useExcalidrawContainer } from "./App"; +import { Dialog } from "./Dialog"; export const ErrorDialog = ({ children, diff --git a/packages/excalidraw/components/EyeDropper.tsx b/packages/excalidraw/components/EyeDropper.tsx index 429c68a4..8c4a73e3 100644 --- a/packages/excalidraw/components/EyeDropper.tsx +++ b/packages/excalidraw/components/EyeDropper.tsx @@ -1,19 +1,23 @@ import { useEffect, useRef } from "react"; import { createPortal } from "react-dom"; + import { rgbToHex } from "../colors"; import { EVENT } from "../constants"; import { useUIAppState } from "../context/ui-appState"; +import { atom } from "../editor-jotai"; import { useCreatePortalContainer } from "../hooks/useCreatePortalContainer"; import { useOutsideClick } from "../hooks/useOutsideClick"; +import { useStable } from "../hooks/useStable"; import { KEYS } from "../keys"; import { getSelectedElements } from "../scene"; + import { useApp, useExcalidrawContainer, useExcalidrawElements } from "./App"; -import { useStable } from "../hooks/useStable"; import "./EyeDropper.scss"; -import type { ColorPickerType } from "./ColorPicker/colorPickerUtils"; + import type { ExcalidrawElement } from "../element/types"; -import { atom } from "../editor-jotai"; + +import type { ColorPickerType } from "./ColorPicker/colorPickerUtils"; export type EyeDropperProperties = { keepOpenOnAlt: boolean; diff --git a/packages/excalidraw/components/FilledButton.tsx b/packages/excalidraw/components/FilledButton.tsx index 13609084..4e5b3e3b 100644 --- a/packages/excalidraw/components/FilledButton.tsx +++ b/packages/excalidraw/components/FilledButton.tsx @@ -1,12 +1,14 @@ -import React, { forwardRef, useState } from "react"; import clsx from "clsx"; +import React, { forwardRef, useState } from "react"; -import "./FilledButton.scss"; import { AbortError } from "../errors"; -import Spinner from "./Spinner"; import { isPromiseLike } from "../utils"; + +import Spinner from "./Spinner"; import { tablerCheckIcon } from "./icons"; +import "./FilledButton.scss"; + export type ButtonVariant = "filled" | "outlined" | "icon"; export type ButtonColor = | "primary" diff --git a/packages/excalidraw/components/FixedSideContainer.tsx b/packages/excalidraw/components/FixedSideContainer.tsx index 76aee998..3130d78e 100644 --- a/packages/excalidraw/components/FixedSideContainer.tsx +++ b/packages/excalidraw/components/FixedSideContainer.tsx @@ -1,8 +1,8 @@ -import "./FixedSideContainer.scss"; - import React from "react"; import clsx from "clsx"; +import "./FixedSideContainer.scss"; + type FixedSideContainerProps = { children: React.ReactNode; side: "top" | "left" | "right"; diff --git a/packages/excalidraw/components/FollowMode/FollowMode.tsx b/packages/excalidraw/components/FollowMode/FollowMode.tsx index 89581bfa..e862cb4e 100644 --- a/packages/excalidraw/components/FollowMode/FollowMode.tsx +++ b/packages/excalidraw/components/FollowMode/FollowMode.tsx @@ -1,7 +1,9 @@ -import type { UserToFollow } from "../../types"; import { CloseIcon } from "../icons"; + import "./FollowMode.scss"; +import type { UserToFollow } from "../../types"; + interface FollowModeProps { width: number; height: number; diff --git a/packages/excalidraw/components/FontPicker/FontPicker.tsx b/packages/excalidraw/components/FontPicker/FontPicker.tsx index 4585c584..4018ad24 100644 --- a/packages/excalidraw/components/FontPicker/FontPicker.tsx +++ b/packages/excalidraw/components/FontPicker/FontPicker.tsx @@ -1,21 +1,23 @@ -import React, { useCallback, useMemo } from "react"; import * as Popover from "@radix-ui/react-popover"; +import React, { useCallback, useMemo } from "react"; -import { FontPickerList } from "./FontPickerList"; -import { FontPickerTrigger } from "./FontPickerTrigger"; +import { FONT_FAMILY } from "../../constants"; +import { t } from "../../i18n"; import { ButtonIconSelect } from "../ButtonIconSelect"; +import { ButtonSeparator } from "../ButtonSeparator"; import { FontFamilyCodeIcon, FontFamilyNormalIcon, FreedrawIcon, } from "../icons"; -import { ButtonSeparator } from "../ButtonSeparator"; -import type { FontFamilyValues } from "../../element/types"; -import { FONT_FAMILY } from "../../constants"; -import { t } from "../../i18n"; + +import { FontPickerList } from "./FontPickerList"; +import { FontPickerTrigger } from "./FontPickerTrigger"; import "./FontPicker.scss"; +import type { FontFamilyValues } from "../../element/types"; + export const DEFAULT_FONTS = [ { value: FONT_FAMILY.Excalifont, diff --git a/packages/excalidraw/components/FontPicker/FontPickerList.tsx b/packages/excalidraw/components/FontPicker/FontPickerList.tsx index 3a680b8f..d93b0869 100644 --- a/packages/excalidraw/components/FontPicker/FontPickerList.tsx +++ b/packages/excalidraw/components/FontPicker/FontPickerList.tsx @@ -1,4 +1,3 @@ -import type { JSX } from "react"; import React, { useMemo, useState, @@ -7,6 +6,11 @@ import React, { useCallback, type KeyboardEventHandler, } from "react"; + +import { type FontFamilyValues } from "../../element/types"; +import { Fonts } from "../../fonts"; +import { t } from "../../i18n"; +import { arrayToList, debounce, getFontFamilyString } from "../../utils"; import { useApp, useAppProps, useExcalidrawContainer } from "../App"; import { PropertiesPopover } from "../PropertiesPopover"; import { QuickSearch } from "../QuickSearch"; @@ -16,13 +20,12 @@ import DropdownMenuItem, { DropDownMenuItemBadgeType, DropDownMenuItemBadge, } from "../dropdownMenu/DropdownMenuItem"; -import { type FontFamilyValues } from "../../element/types"; -import { arrayToList, debounce, getFontFamilyString } from "../../utils"; -import { t } from "../../i18n"; +import { FontFamilyNormalIcon } from "../icons"; + import { fontPickerKeyHandler } from "./keyboardNavHandlers"; -import { Fonts } from "../../fonts"; + import type { ValueOf } from "../../utility-types"; -import { FontFamilyNormalIcon } from "../icons"; +import type { JSX } from "react"; export interface FontDescriptor { value: number; diff --git a/packages/excalidraw/components/FontPicker/FontPickerTrigger.tsx b/packages/excalidraw/components/FontPicker/FontPickerTrigger.tsx index 8652dabc..d83dda0f 100644 --- a/packages/excalidraw/components/FontPicker/FontPickerTrigger.tsx +++ b/packages/excalidraw/components/FontPicker/FontPickerTrigger.tsx @@ -1,11 +1,14 @@ import * as Popover from "@radix-ui/react-popover"; import { useMemo } from "react"; + +import { t } from "../../i18n"; import { ButtonIcon } from "../ButtonIcon"; import { TextIcon } from "../icons"; -import type { FontFamilyValues } from "../../element/types"; -import { t } from "../../i18n"; + import { isDefaultFont } from "./FontPicker"; +import type { FontFamilyValues } from "../../element/types"; + interface FontPickerTriggerProps { selectedFontFamily: FontFamilyValues | null; } diff --git a/packages/excalidraw/components/FontPicker/keyboardNavHandlers.ts b/packages/excalidraw/components/FontPicker/keyboardNavHandlers.ts index 19c4adcc..b0ecdf37 100644 --- a/packages/excalidraw/components/FontPicker/keyboardNavHandlers.ts +++ b/packages/excalidraw/components/FontPicker/keyboardNavHandlers.ts @@ -1,7 +1,9 @@ -import type { Node } from "../../utils"; import { KEYS } from "../../keys"; + import { type FontDescriptor } from "./FontPickerList"; +import type { Node } from "../../utils"; + interface FontPickerKeyNavHandlerProps { event: React.KeyboardEvent; inputRef: React.RefObject; diff --git a/packages/excalidraw/components/HandButton.tsx b/packages/excalidraw/components/HandButton.tsx index ce63791e..4bffb100 100644 --- a/packages/excalidraw/components/HandButton.tsx +++ b/packages/excalidraw/components/HandButton.tsx @@ -1,9 +1,11 @@ -import "./ToolIcon.scss"; - import clsx from "clsx"; + +import { KEYS } from "../keys"; + import { ToolButton } from "./ToolButton"; import { handIcon } from "./icons"; -import { KEYS } from "../keys"; + +import "./ToolIcon.scss"; type LockIconProps = { title?: string; diff --git a/packages/excalidraw/components/HelpButton.tsx b/packages/excalidraw/components/HelpButton.tsx index ce387244..39c867cd 100644 --- a/packages/excalidraw/components/HelpButton.tsx +++ b/packages/excalidraw/components/HelpButton.tsx @@ -1,4 +1,5 @@ import { t } from "../i18n"; + import { HelpIcon } from "./icons"; type HelpButtonProps = { diff --git a/packages/excalidraw/components/HelpDialog.tsx b/packages/excalidraw/components/HelpDialog.tsx index 926096c6..19ecaa57 100644 --- a/packages/excalidraw/components/HelpDialog.tsx +++ b/packages/excalidraw/components/HelpDialog.tsx @@ -1,14 +1,18 @@ -import type { JSX } from "react"; import React from "react"; + +import { getShortcutFromShortcutName } from "../actions/shortcuts"; +import { probablySupportsClipboardBlob } from "../clipboard"; +import { isDarwin, isFirefox, isWindows } from "../constants"; import { t } from "../i18n"; import { KEYS } from "../keys"; -import { Dialog } from "./Dialog"; import { getShortcutKey } from "../utils"; -import "./HelpDialog.scss"; + +import { Dialog } from "./Dialog"; import { ExternalLinkIcon, GithubIcon, youtubeIcon } from "./icons"; -import { probablySupportsClipboardBlob } from "../clipboard"; -import { isDarwin, isFirefox, isWindows } from "../constants"; -import { getShortcutFromShortcutName } from "../actions/shortcuts"; + +import "./HelpDialog.scss"; + +import type { JSX } from "react"; const Header = () => (
diff --git a/packages/excalidraw/components/HintViewer.tsx b/packages/excalidraw/components/HintViewer.tsx index f09f6585..c285e361 100644 --- a/packages/excalidraw/components/HintViewer.tsx +++ b/packages/excalidraw/components/HintViewer.tsx @@ -1,5 +1,4 @@ -import { t } from "../i18n"; -import type { AppClassProperties, Device, UIAppState } from "../types"; +import { isEraserActive } from "../appState"; import { isFlowchartNodeElement, isImageElement, @@ -7,14 +6,18 @@ import { isTextBindableContainer, isTextElement, } from "../element/typeChecks"; +import { t } from "../i18n"; + import { getShortcutKey } from "../utils"; -import { isEraserActive } from "../appState"; -import "./HintViewer.scss"; import { isNodeInFlowchart } from "../element/flowchart"; import { isGridModeEnabled } from "../snapping"; import { CANVAS_SEARCH_TAB, DEFAULT_SIDEBAR } from "../constants"; +import "./HintViewer.scss"; + +import type { AppClassProperties, Device, UIAppState } from "../types"; + interface HintViewerProps { appState: UIAppState; isMobile: boolean; diff --git a/packages/excalidraw/components/IconPicker.tsx b/packages/excalidraw/components/IconPicker.tsx index ee83f905..b91d37c2 100644 --- a/packages/excalidraw/components/IconPicker.tsx +++ b/packages/excalidraw/components/IconPicker.tsx @@ -1,15 +1,18 @@ -import type { JSX } from "react"; -import React, { useEffect } from "react"; import * as Popover from "@radix-ui/react-popover"; -import { isArrowKey, KEYS } from "../keys"; -import { getLanguage, t } from "../i18n"; import clsx from "clsx"; -import Collapsible from "./Stats/Collapsible"; +import React, { useEffect } from "react"; + import { atom, useAtom } from "../editor-jotai"; +import { getLanguage, t } from "../i18n"; +import { isArrowKey, KEYS } from "../keys"; + +import Collapsible from "./Stats/Collapsible"; import { useDevice } from "./App"; import "./IconPicker.scss"; +import type { JSX } from "react"; + const moreOptionsAtom = atom(false); type Option = { diff --git a/packages/excalidraw/components/ImageExportDialog.tsx b/packages/excalidraw/components/ImageExportDialog.tsx index d06f4a84..0d19f5b5 100644 --- a/packages/excalidraw/components/ImageExportDialog.tsx +++ b/packages/excalidraw/components/ImageExportDialog.tsx @@ -1,8 +1,6 @@ +import { exportToCanvas } from "@excalidraw/utils/export"; import React, { useEffect, useRef, useState } from "react"; -import type { ActionManager } from "../actions/manager"; -import type { AppClassProperties, BinaryFiles, UIAppState } from "../types"; - import { actionExportWithDarkMode, actionChangeExportBackground, @@ -17,25 +15,27 @@ import { isFirefox, EXPORT_SCALES, } from "../constants"; - +import { prepareElementsForExport } from "../data"; import { canvasToBlob } from "../data/blob"; import { nativeFileSystemSupported } from "../data/filesystem"; -import type { NonDeletedExcalidrawElement } from "../element/types"; +import { useCopyStatus } from "../hooks/useCopiedIndicator"; + import { t } from "../i18n"; import { isSomeElementSelected } from "../scene"; -import { exportToCanvas } from "@excalidraw/utils/export"; +import { cloneJSON } from "../utils"; import { copyIcon, downloadIcon, helpIcon } from "./icons"; import { Dialog } from "./Dialog"; import { RadioGroup } from "./RadioGroup"; import { Switch } from "./Switch"; import { Tooltip } from "./Tooltip"; +import { FilledButton } from "./FilledButton"; import "./ImageExportDialog.scss"; -import { FilledButton } from "./FilledButton"; -import { cloneJSON } from "../utils"; -import { prepareElementsForExport } from "../data"; -import { useCopyStatus } from "../hooks/useCopiedIndicator"; + +import type { ActionManager } from "../actions/manager"; +import type { NonDeletedExcalidrawElement } from "../element/types"; +import type { AppClassProperties, BinaryFiles, UIAppState } from "../types"; const supportsContextFilters = "filter" in document.createElement("canvas").getContext("2d")!; diff --git a/packages/excalidraw/components/InitializeApp.tsx b/packages/excalidraw/components/InitializeApp.tsx index 41f90cee..efc83a55 100644 --- a/packages/excalidraw/components/InitializeApp.tsx +++ b/packages/excalidraw/components/InitializeApp.tsx @@ -1,9 +1,11 @@ import React, { useEffect, useState } from "react"; -import { LoadingMessage } from "./LoadingMessage"; -import type { Language } from "../i18n"; import { defaultLang, languages, setLanguage } from "../i18n"; + +import { LoadingMessage } from "./LoadingMessage"; + import type { Theme } from "../element/types"; +import type { Language } from "../i18n"; interface Props { langCode: Language["code"]; diff --git a/packages/excalidraw/components/Island.tsx b/packages/excalidraw/components/Island.tsx index 7baf307a..8219e5fc 100644 --- a/packages/excalidraw/components/Island.tsx +++ b/packages/excalidraw/components/Island.tsx @@ -1,8 +1,8 @@ -import "./Island.scss"; - import React from "react"; import clsx from "clsx"; +import "./Island.scss"; + type IslandProps = { children: React.ReactNode; padding?: number; diff --git a/packages/excalidraw/components/JSONExportDialog.tsx b/packages/excalidraw/components/JSONExportDialog.tsx index 527ad574..ae203d3e 100644 --- a/packages/excalidraw/components/JSONExportDialog.tsx +++ b/packages/excalidraw/components/JSONExportDialog.tsx @@ -1,19 +1,22 @@ import React from "react"; -import type { NonDeletedExcalidrawElement } from "../element/types"; + +import { actionSaveFileToDisk } from "../actions/actionExport"; + +import { trackEvent } from "../analytics"; +import { nativeFileSystemSupported } from "../data/filesystem"; import { t } from "../i18n"; +import { getFrame } from "../utils"; -import type { ExportOpts, BinaryFiles, UIAppState } from "../types"; +import { Card } from "./Card"; import { Dialog } from "./Dialog"; -import { exportToFileIcon, LinkIcon } from "./icons"; import { ToolButton } from "./ToolButton"; -import { actionSaveFileToDisk } from "../actions/actionExport"; -import { Card } from "./Card"; +import { exportToFileIcon, LinkIcon } from "./icons"; import "./ExportDialog.scss"; -import { nativeFileSystemSupported } from "../data/filesystem"; -import { trackEvent } from "../analytics"; + import type { ActionManager } from "../actions/manager"; -import { getFrame } from "../utils"; +import type { NonDeletedExcalidrawElement } from "../element/types"; +import type { ExportOpts, BinaryFiles, UIAppState } from "../types"; export type ExportCB = ( elements: readonly NonDeletedExcalidrawElement[], diff --git a/packages/excalidraw/components/LaserPointerButton.tsx b/packages/excalidraw/components/LaserPointerButton.tsx index 35470f6e..237d0831 100644 --- a/packages/excalidraw/components/LaserPointerButton.tsx +++ b/packages/excalidraw/components/LaserPointerButton.tsx @@ -1,9 +1,11 @@ +import clsx from "clsx"; + import "./ToolIcon.scss"; -import clsx from "clsx"; -import type { ToolButtonSize } from "./ToolButton"; import { laserPointerToolIcon } from "./icons"; +import type { ToolButtonSize } from "./ToolButton"; + type LaserPointerIconProps = { title?: string; name?: string; diff --git a/packages/excalidraw/components/LayerUI.tsx b/packages/excalidraw/components/LayerUI.tsx index 11914d09..83ac7ae9 100644 --- a/packages/excalidraw/components/LayerUI.tsx +++ b/packages/excalidraw/components/LayerUI.tsx @@ -1,64 +1,67 @@ import clsx from "clsx"; import React from "react"; -import type { ActionManager } from "../actions/manager"; + +import { mutateElement } from "../element/mutateElement"; +import { ShapeCache } from "../scene/ShapeCache"; +import Scene from "../scene/Scene"; +import { actionToggleStats } from "../actions"; +import { trackEvent } from "../analytics"; +import { isHandToolActive } from "../appState"; import { CLASSES, DEFAULT_SIDEBAR, TOOL_TYPE } from "../constants"; +import { TunnelsContext, useInitializeTunnels } from "../context/tunnels"; +import { UIAppStateContext } from "../context/ui-appState"; +import { useAtom, useAtomValue } from "../editor-jotai"; import { showSelectedShapeActions } from "../element"; -import type { NonDeletedExcalidrawElement } from "../element/types"; -import type { Language } from "../i18n"; import { t } from "../i18n"; import { calculateScrollCenter } from "../scene"; -import type { - AppProps, - AppState, - ExcalidrawProps, - BinaryFiles, - UIAppState, - AppClassProperties, -} from "../types"; import { capitalizeString, isShallowEqual } from "../utils"; + import { SelectedShapeActions, ShapesSwitcher } from "./Actions"; -import { ErrorDialog } from "./ErrorDialog"; -import { ImageExportDialog } from "./ImageExportDialog"; -import { FixedSideContainer } from "./FixedSideContainer"; -import { HintViewer } from "./HintViewer"; -import { Island } from "./Island"; import { LoadingMessage } from "./LoadingMessage"; import { LockButton } from "./LockButton"; import { MobileMenu } from "./MobileMenu"; import { PasteChartDialog } from "./PasteChartDialog"; import { Section } from "./Section"; -import { HelpDialog } from "./HelpDialog"; import Stack from "./Stack"; import { UserList } from "./UserList"; -import { JSONExportDialog } from "./JSONExportDialog"; import { PenModeButton } from "./PenModeButton"; -import { trackEvent } from "../analytics"; -import { useDevice } from "./App"; import Footer from "./footer/Footer"; import { isSidebarDockedAtom } from "./Sidebar/Sidebar"; -import { useAtom, useAtomValue } from "../editor-jotai"; import MainMenu from "./main-menu/MainMenu"; import { ActiveConfirmDialog } from "./ActiveConfirmDialog"; +import { useDevice } from "./App"; import { OverwriteConfirmDialog } from "./OverwriteConfirm/OverwriteConfirm"; -import { HandButton } from "./HandButton"; -import { isHandToolActive } from "../appState"; -import { TunnelsContext, useInitializeTunnels } from "../context/tunnels"; import { LibraryIcon } from "./icons"; -import { UIAppStateContext } from "../context/ui-appState"; import { DefaultSidebar } from "./DefaultSidebar"; -import { EyeDropper, activeEyeDropperAtom } from "./EyeDropper"; -import { mutateElement } from "../element/mutateElement"; -import { ShapeCache } from "../scene/ShapeCache"; -import Scene from "../scene/Scene"; -import { LaserPointerButton } from "./LaserPointerButton"; import { TTDDialog } from "./TTDDialog/TTDDialog"; import { Stats } from "./Stats"; -import { actionToggleStats } from "../actions"; import ElementLinkDialog from "./ElementLinkDialog"; +import { ErrorDialog } from "./ErrorDialog"; +import { EyeDropper, activeEyeDropperAtom } from "./EyeDropper"; +import { FixedSideContainer } from "./FixedSideContainer"; +import { HandButton } from "./HandButton"; +import { HelpDialog } from "./HelpDialog"; +import { HintViewer } from "./HintViewer"; +import { ImageExportDialog } from "./ImageExportDialog"; +import { Island } from "./Island"; +import { JSONExportDialog } from "./JSONExportDialog"; +import { LaserPointerButton } from "./LaserPointerButton"; import "./LayerUI.scss"; import "./Toolbar.scss"; +import type { ActionManager } from "../actions/manager"; +import type { NonDeletedExcalidrawElement } from "../element/types"; +import type { Language } from "../i18n"; +import type { + AppProps, + AppState, + ExcalidrawProps, + BinaryFiles, + UIAppState, + AppClassProperties, +} from "../types"; + interface LayerUIProps { actionManager: ActionManager; appState: UIAppState; diff --git a/packages/excalidraw/components/LibraryMenu.tsx b/packages/excalidraw/components/LibraryMenu.tsx index 0162d93a..03c476e4 100644 --- a/packages/excalidraw/components/LibraryMenu.tsx +++ b/packages/excalidraw/components/LibraryMenu.tsx @@ -6,41 +6,44 @@ import React, { memo, useRef, } from "react"; -import type Library from "../data/library"; + +import { trackEvent } from "../analytics"; +import { LIBRARY_DISABLED_TYPES } from "../constants"; +import { useUIAppState } from "../context/ui-appState"; import { distributeLibraryItemsOnSquareGrid, libraryItemsAtom, } from "../data/library"; +import { atom, useAtom } from "../editor-jotai"; import { t } from "../i18n"; import { randomId } from "../random"; -import type { - LibraryItems, - LibraryItem, - ExcalidrawProps, - UIAppState, - AppClassProperties, -} from "../types"; -import LibraryMenuItems from "./LibraryMenuItems"; -import { trackEvent } from "../analytics"; -import { atom, useAtom } from "../editor-jotai"; -import Spinner from "./Spinner"; +import { getSelectedElements } from "../scene"; +import { isShallowEqual } from "../utils"; + import { useApp, useAppProps, useExcalidrawElements, useExcalidrawSetAppState, } from "./App"; -import { getSelectedElements } from "../scene"; -import { useUIAppState } from "../context/ui-appState"; +import { LibraryMenuControlButtons } from "./LibraryMenuControlButtons"; +import LibraryMenuItems from "./LibraryMenuItems"; +import Spinner from "./Spinner"; import "./LibraryMenu.scss"; -import { LibraryMenuControlButtons } from "./LibraryMenuControlButtons"; + import type { ExcalidrawElement, NonDeletedExcalidrawElement, } from "../element/types"; -import { LIBRARY_DISABLED_TYPES } from "../constants"; -import { isShallowEqual } from "../utils"; +import type { + LibraryItems, + LibraryItem, + ExcalidrawProps, + UIAppState, + AppClassProperties, +} from "../types"; +import type Library from "../data/library"; export const isLibraryMenuOpenAtom = atom(false); diff --git a/packages/excalidraw/components/LibraryMenuBrowseButton.tsx b/packages/excalidraw/components/LibraryMenuBrowseButton.tsx index 43fbedd7..2b2623ed 100644 --- a/packages/excalidraw/components/LibraryMenuBrowseButton.tsx +++ b/packages/excalidraw/components/LibraryMenuBrowseButton.tsx @@ -1,5 +1,6 @@ import { VERSIONS } from "../constants"; import { t } from "../i18n"; + import type { ExcalidrawProps, UIAppState } from "../types"; const LibraryMenuBrowseButton = ({ diff --git a/packages/excalidraw/components/LibraryMenuControlButtons.tsx b/packages/excalidraw/components/LibraryMenuControlButtons.tsx index b467ca39..1ea72216 100644 --- a/packages/excalidraw/components/LibraryMenuControlButtons.tsx +++ b/packages/excalidraw/components/LibraryMenuControlButtons.tsx @@ -1,7 +1,9 @@ -import type { ExcalidrawProps, UIAppState } from "../types"; -import LibraryMenuBrowseButton from "./LibraryMenuBrowseButton"; import clsx from "clsx"; +import LibraryMenuBrowseButton from "./LibraryMenuBrowseButton"; + +import type { ExcalidrawProps, UIAppState } from "../types"; + export const LibraryMenuControlButtons = ({ libraryReturnUrl, theme, diff --git a/packages/excalidraw/components/LibraryMenuHeaderContent.tsx b/packages/excalidraw/components/LibraryMenuHeaderContent.tsx index bec31aa3..cc6c942a 100644 --- a/packages/excalidraw/components/LibraryMenuHeaderContent.tsx +++ b/packages/excalidraw/components/LibraryMenuHeaderContent.tsx @@ -1,12 +1,23 @@ +import clsx from "clsx"; import { useCallback, useState } from "react"; -import { t } from "../i18n"; -import Trans from "./Trans"; -import { useAtom } from "../editor-jotai"; -import type { LibraryItem, LibraryItems, UIAppState } from "../types"; -import { useApp, useExcalidrawSetAppState } from "./App"; + +import { useUIAppState } from "../context/ui-appState"; +import { fileOpen } from "../data/filesystem"; import { saveLibraryAsJSON } from "../data/json"; -import type Library from "../data/library"; import { libraryItemsAtom } from "../data/library"; +import { useAtom } from "../editor-jotai"; +import { useLibraryCache } from "../hooks/useLibraryItemSvg"; +import { t } from "../i18n"; +import { muteFSAbortError } from "../utils"; + +import { useApp, useExcalidrawSetAppState } from "./App"; +import ConfirmDialog from "./ConfirmDialog"; +import { Dialog } from "./Dialog"; +import { isLibraryMenuOpenAtom } from "./LibraryMenu"; +import PublishLibrary from "./PublishLibrary"; +import { ToolButton } from "./ToolButton"; +import Trans from "./Trans"; +import DropdownMenu from "./dropdownMenu/DropdownMenu"; import { DotsIcon, ExportIcon, @@ -14,17 +25,9 @@ import { publishIcon, TrashIcon, } from "./icons"; -import { ToolButton } from "./ToolButton"; -import { fileOpen } from "../data/filesystem"; -import { muteFSAbortError } from "../utils"; -import ConfirmDialog from "./ConfirmDialog"; -import PublishLibrary from "./PublishLibrary"; -import { Dialog } from "./Dialog"; -import DropdownMenu from "./dropdownMenu/DropdownMenu"; -import { isLibraryMenuOpenAtom } from "./LibraryMenu"; -import { useUIAppState } from "../context/ui-appState"; -import clsx from "clsx"; -import { useLibraryCache } from "../hooks/useLibraryItemSvg"; + +import type Library from "../data/library"; +import type { LibraryItem, LibraryItems, UIAppState } from "../types"; const getSelectedItems = ( libraryItems: LibraryItems, diff --git a/packages/excalidraw/components/LibraryMenuItems.tsx b/packages/excalidraw/components/LibraryMenuItems.tsx index aa2c3e68..af5b9d3e 100644 --- a/packages/excalidraw/components/LibraryMenuItems.tsx +++ b/packages/excalidraw/components/LibraryMenuItems.tsx @@ -5,30 +5,33 @@ import React, { useRef, useState, } from "react"; + +import { MIME_TYPES } from "../constants"; import { serializeLibraryAsJSON } from "../data/json"; +import { duplicateElements } from "../element/newElement"; +import { useLibraryCache } from "../hooks/useLibraryItemSvg"; +import { useScrollPosition } from "../hooks/useScrollPosition"; import { t } from "../i18n"; -import type { - ExcalidrawProps, - LibraryItem, - LibraryItems, - UIAppState, -} from "../types"; import { arrayToMap } from "../utils"; -import Stack from "./Stack"; -import { MIME_TYPES } from "../constants"; -import Spinner from "./Spinner"; -import { duplicateElements } from "../element/newElement"; + import { LibraryMenuControlButtons } from "./LibraryMenuControlButtons"; import { LibraryDropdownMenu } from "./LibraryMenuHeaderContent"; import { LibraryMenuSection, LibraryMenuSectionGrid, } from "./LibraryMenuSection"; -import { useScrollPosition } from "../hooks/useScrollPosition"; -import { useLibraryCache } from "../hooks/useLibraryItemSvg"; +import Spinner from "./Spinner"; +import Stack from "./Stack"; import "./LibraryMenuItems.scss"; +import type { + ExcalidrawProps, + LibraryItem, + LibraryItems, + UIAppState, +} from "../types"; + // using an odd number of items per batch so the rendering creates an irregular // pattern which looks more organic const ITEMS_RENDERED_PER_BATCH = 17; diff --git a/packages/excalidraw/components/LibraryMenuSection.tsx b/packages/excalidraw/components/LibraryMenuSection.tsx index b07d6b1c..5f7de2b0 100644 --- a/packages/excalidraw/components/LibraryMenuSection.tsx +++ b/packages/excalidraw/components/LibraryMenuSection.tsx @@ -1,10 +1,13 @@ -import type { ReactNode } from "react"; import React, { memo, useEffect, useState } from "react"; + +import { useTransition } from "../hooks/useTransition"; + import { EmptyLibraryUnit, LibraryUnit } from "./LibraryUnit"; -import type { LibraryItem } from "../types"; + import type { ExcalidrawElement, NonDeleted } from "../element/types"; import type { SvgCache } from "../hooks/useLibraryItemSvg"; -import { useTransition } from "../hooks/useTransition"; +import type { LibraryItem } from "../types"; +import type { ReactNode } from "react"; type LibraryOrPendingItem = ( | LibraryItem diff --git a/packages/excalidraw/components/LibraryUnit.tsx b/packages/excalidraw/components/LibraryUnit.tsx index 71e1a00f..9cd89171 100644 --- a/packages/excalidraw/components/LibraryUnit.tsx +++ b/packages/excalidraw/components/LibraryUnit.tsx @@ -1,12 +1,16 @@ import clsx from "clsx"; import { memo, useEffect, useRef, useState } from "react"; + +import { useLibraryItemSvg } from "../hooks/useLibraryItemSvg"; + import { useDevice } from "./App"; -import type { LibraryItem } from "../types"; -import "./LibraryUnit.scss"; import { CheckboxItem } from "./CheckboxItem"; import { PlusIcon } from "./icons"; + +import "./LibraryUnit.scss"; + +import type { LibraryItem } from "../types"; import type { SvgCache } from "../hooks/useLibraryItemSvg"; -import { useLibraryItemSvg } from "../hooks/useLibraryItemSvg"; export const LibraryUnit = memo( ({ diff --git a/packages/excalidraw/components/LoadingMessage.tsx b/packages/excalidraw/components/LoadingMessage.tsx index b0072525..bdcc5a34 100644 --- a/packages/excalidraw/components/LoadingMessage.tsx +++ b/packages/excalidraw/components/LoadingMessage.tsx @@ -1,8 +1,11 @@ -import { t } from "../i18n"; -import { useState, useEffect } from "react"; -import Spinner from "./Spinner"; import clsx from "clsx"; +import { useState, useEffect } from "react"; + import { THEME } from "../constants"; +import { t } from "../i18n"; + +import Spinner from "./Spinner"; + import type { Theme } from "../element/types"; export const LoadingMessage: React.FC<{ delay?: number; theme?: Theme }> = ({ diff --git a/packages/excalidraw/components/LockButton.tsx b/packages/excalidraw/components/LockButton.tsx index f7913d12..8363ffa0 100644 --- a/packages/excalidraw/components/LockButton.tsx +++ b/packages/excalidraw/components/LockButton.tsx @@ -1,9 +1,11 @@ +import clsx from "clsx"; + import "./ToolIcon.scss"; -import clsx from "clsx"; -import type { ToolButtonSize } from "./ToolButton"; import { LockedIcon, UnlockedIcon } from "./icons"; +import type { ToolButtonSize } from "./ToolButton"; + type LockIconProps = { title?: string; name?: string; diff --git a/packages/excalidraw/components/MagicButton.tsx b/packages/excalidraw/components/MagicButton.tsx index eedc63b3..b2bbd03e 100644 --- a/packages/excalidraw/components/MagicButton.tsx +++ b/packages/excalidraw/components/MagicButton.tsx @@ -1,9 +1,10 @@ -import type { JSX } from "react"; import clsx from "clsx"; -import type { ToolButtonSize } from "./ToolButton"; import "./ToolIcon.scss"; +import type { ToolButtonSize } from "./ToolButton"; +import type { JSX } from "react"; + const DEFAULT_SIZE: ToolButtonSize = "small"; export const ElementCanvasButton = (props: { diff --git a/packages/excalidraw/components/MobileMenu.tsx b/packages/excalidraw/components/MobileMenu.tsx index bef99a91..08a20174 100644 --- a/packages/excalidraw/components/MobileMenu.tsx +++ b/packages/excalidraw/components/MobileMenu.tsx @@ -1,5 +1,24 @@ -import type { JSX } from "react"; import React from "react"; + +import { isHandToolActive } from "../appState"; +import { useTunnels } from "../context/tunnels"; +import { showSelectedShapeActions } from "../element"; +import { t } from "../i18n"; +import { calculateScrollCenter } from "../scene"; +import { SCROLLBAR_WIDTH, SCROLLBAR_MARGIN } from "../scene/scrollbars"; + +import { SelectedShapeActions, ShapesSwitcher } from "./Actions"; +import { FixedSideContainer } from "./FixedSideContainer"; +import { HandButton } from "./HandButton"; +import { HintViewer } from "./HintViewer"; +import { Island } from "./Island"; +import { LockButton } from "./LockButton"; +import { PenModeButton } from "./PenModeButton"; +import { Section } from "./Section"; +import Stack from "./Stack"; + +import type { ActionManager } from "../actions/manager"; +import type { NonDeletedExcalidrawElement } from "../element/types"; import type { AppClassProperties, AppProps, @@ -8,23 +27,7 @@ import type { ExcalidrawProps, UIAppState, } from "../types"; -import type { ActionManager } from "../actions/manager"; -import { t } from "../i18n"; -import Stack from "./Stack"; -import { showSelectedShapeActions } from "../element"; -import type { NonDeletedExcalidrawElement } from "../element/types"; -import { FixedSideContainer } from "./FixedSideContainer"; -import { Island } from "./Island"; -import { HintViewer } from "./HintViewer"; -import { calculateScrollCenter } from "../scene"; -import { SelectedShapeActions, ShapesSwitcher } from "./Actions"; -import { Section } from "./Section"; -import { SCROLLBAR_WIDTH, SCROLLBAR_MARGIN } from "../scene/scrollbars"; -import { LockButton } from "./LockButton"; -import { PenModeButton } from "./PenModeButton"; -import { HandButton } from "./HandButton"; -import { isHandToolActive } from "../appState"; -import { useTunnels } from "../context/tunnels"; +import type { JSX } from "react"; type MobileMenuProps = { appState: UIAppState; diff --git a/packages/excalidraw/components/Modal.tsx b/packages/excalidraw/components/Modal.tsx index e8fff195..a5ade9ef 100644 --- a/packages/excalidraw/components/Modal.tsx +++ b/packages/excalidraw/components/Modal.tsx @@ -1,11 +1,13 @@ -import "./Modal.scss"; - -import { createPortal } from "react-dom"; import clsx from "clsx"; +import { useRef } from "react"; +import { createPortal } from "react-dom"; + +import { useCreatePortalContainer } from "../hooks/useCreatePortalContainer"; import { KEYS } from "../keys"; + +import "./Modal.scss"; + import type { AppState } from "../types"; -import { useCreatePortalContainer } from "../hooks/useCreatePortalContainer"; -import { useRef } from "react"; export const Modal: React.FC<{ className?: string; diff --git a/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirm.tsx b/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirm.tsx index 4bf8d671..f2de877e 100644 --- a/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirm.tsx +++ b/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirm.tsx @@ -3,12 +3,13 @@ import React from "react"; import { useTunnels } from "../../context/tunnels"; import { useAtom } from "../../editor-jotai"; import { Dialog } from "../Dialog"; -import { withInternalFallback } from "../hoc/withInternalFallback"; -import { overwriteConfirmStateAtom } from "./OverwriteConfirmState"; - import { FilledButton } from "../FilledButton"; +import { withInternalFallback } from "../hoc/withInternalFallback"; import { alertTriangleIcon } from "../icons"; + import { Actions, Action } from "./OverwriteConfirmActions"; +import { overwriteConfirmStateAtom } from "./OverwriteConfirmState"; + import "./OverwriteConfirm.scss"; export type OverwriteConfirmDialogProps = { diff --git a/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirmActions.tsx b/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirmActions.tsx index 5da0a08e..e5fb56d8 100644 --- a/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirmActions.tsx +++ b/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirmActions.tsx @@ -1,9 +1,10 @@ import React from "react"; -import { FilledButton } from "../FilledButton"; -import { useExcalidrawActionManager, useExcalidrawSetAppState } from "../App"; + import { actionSaveFileToDisk } from "../../actions"; -import { useI18n } from "../../i18n"; import { actionChangeExportEmbedScene } from "../../actions/actionExport"; +import { useI18n } from "../../i18n"; +import { useExcalidrawActionManager, useExcalidrawSetAppState } from "../App"; +import { FilledButton } from "../FilledButton"; export type ActionProps = { title: string; diff --git a/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirmState.ts b/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirmState.ts index 04616aa8..cefb2153 100644 --- a/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirmState.ts +++ b/packages/excalidraw/components/OverwriteConfirm/OverwriteConfirmState.ts @@ -1,4 +1,5 @@ import { atom, editorJotaiStore } from "../../editor-jotai"; + import type React from "react"; export type OverwriteConfirmState = diff --git a/packages/excalidraw/components/PasteChartDialog.tsx b/packages/excalidraw/components/PasteChartDialog.tsx index 08a5634a..58bd5a38 100644 --- a/packages/excalidraw/components/PasteChartDialog.tsx +++ b/packages/excalidraw/components/PasteChartDialog.tsx @@ -1,17 +1,20 @@ import oc from "open-color"; import React, { useLayoutEffect, useRef, useState } from "react"; + import { trackEvent } from "../analytics"; -import type { ChartElements, Spreadsheet } from "../charts"; import { renderSpreadsheet } from "../charts"; -import type { ChartType } from "../element/types"; import { t } from "../i18n"; import { exportToSvg } from "../scene/export"; -import type { UIAppState } from "../types"; + import { useApp } from "./App"; import { Dialog } from "./Dialog"; import "./PasteChartDialog.scss"; +import type { ChartElements, Spreadsheet } from "../charts"; +import type { ChartType } from "../element/types"; +import type { UIAppState } from "../types"; + type OnInsertChart = (chartType: ChartType, elements: ChartElements) => void; const ChartPreviewBtn = (props: { diff --git a/packages/excalidraw/components/PenModeButton.tsx b/packages/excalidraw/components/PenModeButton.tsx index ca5ceb2b..e5df8ac9 100644 --- a/packages/excalidraw/components/PenModeButton.tsx +++ b/packages/excalidraw/components/PenModeButton.tsx @@ -1,9 +1,11 @@ +import clsx from "clsx"; + import "./ToolIcon.scss"; -import clsx from "clsx"; -import type { ToolButtonSize } from "./ToolButton"; import { PenModeIcon } from "./icons"; +import type { ToolButtonSize } from "./ToolButton"; + type PenModeIconProps = { title?: string; name?: string; diff --git a/packages/excalidraw/components/Popover.tsx b/packages/excalidraw/components/Popover.tsx index 987e9fb9..2bd72b20 100644 --- a/packages/excalidraw/components/Popover.tsx +++ b/packages/excalidraw/components/Popover.tsx @@ -1,8 +1,10 @@ import React, { useLayoutEffect, useRef, useEffect } from "react"; -import "./Popover.scss"; import { unstable_batchedUpdates } from "react-dom"; -import { queryFocusableElements } from "../utils"; + import { KEYS } from "../keys"; +import { queryFocusableElements } from "../utils"; + +import "./Popover.scss"; type Props = { top?: number; diff --git a/packages/excalidraw/components/ProjectName.tsx b/packages/excalidraw/components/ProjectName.tsx index 59296179..0d60ddd6 100644 --- a/packages/excalidraw/components/ProjectName.tsx +++ b/packages/excalidraw/components/ProjectName.tsx @@ -1,11 +1,12 @@ -import "./TextInput.scss"; - import React, { useState } from "react"; + import { focusNearestParent } from "../utils"; +import { KEYS } from "../keys"; -import "./ProjectName.scss"; import { useExcalidrawContainer } from "./App"; -import { KEYS } from "../keys"; + +import "./TextInput.scss"; +import "./ProjectName.scss"; type Props = { value: string; diff --git a/packages/excalidraw/components/PropertiesPopover.tsx b/packages/excalidraw/components/PropertiesPopover.tsx index 455af118..a30f1374 100644 --- a/packages/excalidraw/components/PropertiesPopover.tsx +++ b/packages/excalidraw/components/PropertiesPopover.tsx @@ -1,10 +1,11 @@ -import React, { type ReactNode } from "react"; -import clsx from "clsx"; import * as Popover from "@radix-ui/react-popover"; +import clsx from "clsx"; +import React, { type ReactNode } from "react"; + +import { isInteractive } from "../utils"; import { useDevice } from "./App"; import { Island } from "./Island"; -import { isInteractive } from "../utils"; interface PropertiesPopoverProps { className?: string; diff --git a/packages/excalidraw/components/PublishLibrary.tsx b/packages/excalidraw/components/PublishLibrary.tsx index fe68f880..8a7188b6 100644 --- a/packages/excalidraw/components/PublishLibrary.tsx +++ b/packages/excalidraw/components/PublishLibrary.tsx @@ -1,13 +1,7 @@ -import type { ReactNode } from "react"; -import { useCallback, useEffect, useRef, useState } from "react"; +import { exportToCanvas, exportToSvg } from "@excalidraw/utils/export"; import OpenColor from "open-color"; +import { useCallback, useEffect, useRef, useState } from "react"; -import { Dialog } from "./Dialog"; -import { t } from "../i18n"; -import Trans from "./Trans"; - -import type { LibraryItems, LibraryItem, UIAppState } from "../types"; -import { exportToCanvas, exportToSvg } from "@excalidraw/utils/export"; import { EDITOR_LS_KEYS, EXPORT_DATA_TYPES, @@ -15,16 +9,23 @@ import { MIME_TYPES, VERSIONS, } from "../constants"; -import type { ExportedLibraryData } from "../data/types"; +import { EditorLocalStorage } from "../data/EditorLocalStorage"; import { canvasToBlob, resizeImageFile } from "../data/blob"; +import { t } from "../i18n"; import { chunk } from "../utils"; + +import { Dialog } from "./Dialog"; import DialogActionButton from "./DialogActionButton"; -import { CloseIcon } from "./icons"; import { ToolButton } from "./ToolButton"; -import { EditorLocalStorage } from "../data/EditorLocalStorage"; +import Trans from "./Trans"; +import { CloseIcon } from "./icons"; import "./PublishLibrary.scss"; +import type { ReactNode } from "react"; +import type { ExportedLibraryData } from "../data/types"; +import type { LibraryItems, LibraryItem, UIAppState } from "../types"; + interface PublishLibraryDataParams { authorName: string; githubHandle: string; diff --git a/packages/excalidraw/components/QuickSearch.tsx b/packages/excalidraw/components/QuickSearch.tsx index c7ec78b5..83b65183 100644 --- a/packages/excalidraw/components/QuickSearch.tsx +++ b/packages/excalidraw/components/QuickSearch.tsx @@ -1,5 +1,6 @@ import clsx from "clsx"; import React from "react"; + import { searchIcon } from "./icons"; import "./QuickSearch.scss"; diff --git a/packages/excalidraw/components/RadioGroup.tsx b/packages/excalidraw/components/RadioGroup.tsx index 64d4d587..c08355aa 100644 --- a/packages/excalidraw/components/RadioGroup.tsx +++ b/packages/excalidraw/components/RadioGroup.tsx @@ -1,4 +1,5 @@ import clsx from "clsx"; + import "./RadioGroup.scss"; export type RadioGroupChoice = { diff --git a/packages/excalidraw/components/Range.tsx b/packages/excalidraw/components/Range.tsx index cd1869cc..3ab9ede1 100644 --- a/packages/excalidraw/components/Range.tsx +++ b/packages/excalidraw/components/Range.tsx @@ -1,6 +1,8 @@ import React, { useEffect } from "react"; + import { getFormValue } from "../actions/actionProperties"; import { t } from "../i18n"; + import "./Range.scss"; export type RangeProps = { diff --git a/packages/excalidraw/components/SVGLayer.tsx b/packages/excalidraw/components/SVGLayer.tsx index 667b89ab..815d463a 100644 --- a/packages/excalidraw/components/SVGLayer.tsx +++ b/packages/excalidraw/components/SVGLayer.tsx @@ -1,8 +1,9 @@ import { useEffect, useRef } from "react"; -import type { Trail } from "../animated-trail"; import "./SVGLayer.scss"; +import type { Trail } from "../animated-trail"; + type SVGLayerProps = { trails: Trail[]; }; diff --git a/packages/excalidraw/components/SearchMenu.tsx b/packages/excalidraw/components/SearchMenu.tsx index 873de5ad..70d3f4f2 100644 --- a/packages/excalidraw/components/SearchMenu.tsx +++ b/packages/excalidraw/components/SearchMenu.tsx @@ -1,25 +1,29 @@ -import { Fragment, memo, useEffect, useRef, useState } from "react"; -import { collapseDownIcon, upIcon, searchIcon } from "./icons"; -import { TextField } from "./TextField"; -import { Button } from "./Button"; -import { useApp, useExcalidrawSetAppState } from "./App"; -import debounce from "lodash.debounce"; -import type { AppClassProperties } from "../types"; -import { isTextElement, newTextElement } from "../element"; -import type { ExcalidrawTextElement } from "../element/types"; -import { addEventListener, getFontString } from "../utils"; -import { KEYS } from "../keys"; +import { round } from "@excalidraw/math"; import clsx from "clsx"; +import debounce from "lodash.debounce"; +import { Fragment, memo, useEffect, useRef, useState } from "react"; + +import { CLASSES, EVENT } from "../constants"; import { atom, useAtom } from "../editor-jotai"; -import { t } from "../i18n"; +import { isTextElement, newTextElement } from "../element"; import { isElementCompletelyInViewport } from "../element/sizeHelpers"; -import { randomInteger } from "../random"; -import { CLASSES, EVENT } from "../constants"; + +import { measureText } from "../element/textMeasurements"; import { useStable } from "../hooks/useStable"; +import { t } from "../i18n"; +import { KEYS } from "../keys"; +import { randomInteger } from "../random"; +import { addEventListener, getFontString } from "../utils"; + +import { useApp, useExcalidrawSetAppState } from "./App"; +import { Button } from "./Button"; +import { TextField } from "./TextField"; +import { collapseDownIcon, upIcon, searchIcon } from "./icons"; import "./SearchMenu.scss"; -import { round } from "@excalidraw/math"; -import { measureText } from "../element/textMeasurements"; + +import type { ExcalidrawTextElement } from "../element/types"; +import type { AppClassProperties } from "../types"; const searchQueryAtom = atom(""); export const searchItemInFocusAtom = atom(null); diff --git a/packages/excalidraw/components/Section.tsx b/packages/excalidraw/components/Section.tsx index 8cd0aaab..e7e357bb 100644 --- a/packages/excalidraw/components/Section.tsx +++ b/packages/excalidraw/components/Section.tsx @@ -1,5 +1,7 @@ import React from "react"; + import { t } from "../i18n"; + import { useExcalidrawContainer } from "./App"; export const Section: React.FC<{ diff --git a/packages/excalidraw/components/ShareableLinkDialog.tsx b/packages/excalidraw/components/ShareableLinkDialog.tsx index 987c7bf6..514a7763 100644 --- a/packages/excalidraw/components/ShareableLinkDialog.tsx +++ b/packages/excalidraw/components/ShareableLinkDialog.tsx @@ -1,12 +1,12 @@ import { useRef, useState } from "react"; import { copyTextToSystemClipboard } from "../clipboard"; +import { useCopyStatus } from "../hooks/useCopiedIndicator"; import { useI18n } from "../i18n"; import { Dialog } from "./Dialog"; -import { TextField } from "./TextField"; import { FilledButton } from "./FilledButton"; -import { useCopyStatus } from "../hooks/useCopiedIndicator"; +import { TextField } from "./TextField"; import { copyIcon } from "./icons"; import "./ShareableLinkDialog.scss"; diff --git a/packages/excalidraw/components/Sidebar/Sidebar.test.tsx b/packages/excalidraw/components/Sidebar/Sidebar.test.tsx index b61529d9..39a1cbc6 100644 --- a/packages/excalidraw/components/Sidebar/Sidebar.test.tsx +++ b/packages/excalidraw/components/Sidebar/Sidebar.test.tsx @@ -1,4 +1,6 @@ import React from "react"; +import { vi } from "vitest"; + import { DEFAULT_SIDEBAR } from "../../constants"; import { Excalidraw, Sidebar } from "../../index"; import { @@ -10,7 +12,7 @@ import { waitFor, withExcalidrawDimensions, } from "../../tests/test-utils"; -import { vi } from "vitest"; + import { assertExcalidrawWithSidebar, assertSidebarDockButton, diff --git a/packages/excalidraw/components/Sidebar/Sidebar.tsx b/packages/excalidraw/components/Sidebar/Sidebar.tsx index 7c747d2f..8a008fd9 100644 --- a/packages/excalidraw/components/Sidebar/Sidebar.tsx +++ b/packages/excalidraw/components/Sidebar/Sidebar.tsx @@ -1,3 +1,4 @@ +import clsx from "clsx"; import React, { useEffect, useLayoutEffect, @@ -7,26 +8,28 @@ import React, { useImperativeHandle, useCallback, } from "react"; -import { Island } from "../Island"; + +import { EVENT } from "../../constants"; +import { useUIAppState } from "../../context/ui-appState"; import { atom, useSetAtom } from "../../editor-jotai"; -import type { SidebarProps, SidebarPropsContextValue } from "./common"; -import { SidebarPropsContext } from "./common"; -import { SidebarHeader } from "./SidebarHeader"; -import clsx from "clsx"; -import { useDevice, useExcalidrawSetAppState } from "../App"; -import { updateObject } from "../../utils"; +import { useOutsideClick } from "../../hooks/useOutsideClick"; import { KEYS } from "../../keys"; -import { EVENT } from "../../constants"; -import { SidebarTrigger } from "./SidebarTrigger"; -import { SidebarTabTriggers } from "./SidebarTabTriggers"; +import { updateObject } from "../../utils"; +import { useDevice, useExcalidrawSetAppState } from "../App"; +import { Island } from "../Island"; + +import { SidebarHeader } from "./SidebarHeader"; import { SidebarTabTrigger } from "./SidebarTabTrigger"; +import { SidebarTabTriggers } from "./SidebarTabTriggers"; +import { SidebarTrigger } from "./SidebarTrigger"; +import { SidebarPropsContext } from "./common"; import { SidebarTabs } from "./SidebarTabs"; import { SidebarTab } from "./SidebarTab"; -import { useUIAppState } from "../../context/ui-appState"; -import { useOutsideClick } from "../../hooks/useOutsideClick"; import "./Sidebar.scss"; +import type { SidebarProps, SidebarPropsContextValue } from "./common"; + /** * Flags whether the currently rendered Sidebar is docked or not, for use * in upstream components that need to act on this (e.g. LayerUI to shift the diff --git a/packages/excalidraw/components/Sidebar/SidebarHeader.tsx b/packages/excalidraw/components/Sidebar/SidebarHeader.tsx index 6d046aba..9c9e51cf 100644 --- a/packages/excalidraw/components/Sidebar/SidebarHeader.tsx +++ b/packages/excalidraw/components/Sidebar/SidebarHeader.tsx @@ -1,11 +1,13 @@ import clsx from "clsx"; import { useContext } from "react"; + import { t } from "../../i18n"; import { useDevice } from "../App"; -import { SidebarPropsContext } from "./common"; -import { CloseIcon, PinIcon } from "../icons"; -import { Tooltip } from "../Tooltip"; import { Button } from "../Button"; +import { Tooltip } from "../Tooltip"; +import { CloseIcon, PinIcon } from "../icons"; + +import { SidebarPropsContext } from "./common"; export const SidebarHeader = ({ children, diff --git a/packages/excalidraw/components/Sidebar/SidebarTab.tsx b/packages/excalidraw/components/Sidebar/SidebarTab.tsx index 6fddab0d..0525662f 100644 --- a/packages/excalidraw/components/Sidebar/SidebarTab.tsx +++ b/packages/excalidraw/components/Sidebar/SidebarTab.tsx @@ -1,4 +1,5 @@ import * as RadixTabs from "@radix-ui/react-tabs"; + import type { SidebarTabName } from "../../types"; export const SidebarTab = ({ diff --git a/packages/excalidraw/components/Sidebar/SidebarTabTrigger.tsx b/packages/excalidraw/components/Sidebar/SidebarTabTrigger.tsx index 8509ef23..9f2c09bc 100644 --- a/packages/excalidraw/components/Sidebar/SidebarTabTrigger.tsx +++ b/packages/excalidraw/components/Sidebar/SidebarTabTrigger.tsx @@ -1,4 +1,5 @@ import * as RadixTabs from "@radix-ui/react-tabs"; + import type { SidebarTabName } from "../../types"; export const SidebarTabTrigger = ({ diff --git a/packages/excalidraw/components/Sidebar/SidebarTabs.tsx b/packages/excalidraw/components/Sidebar/SidebarTabs.tsx index a681b5ee..448840c4 100644 --- a/packages/excalidraw/components/Sidebar/SidebarTabs.tsx +++ b/packages/excalidraw/components/Sidebar/SidebarTabs.tsx @@ -1,4 +1,5 @@ import * as RadixTabs from "@radix-ui/react-tabs"; + import { useUIAppState } from "../../context/ui-appState"; import { useExcalidrawSetAppState } from "../App"; diff --git a/packages/excalidraw/components/Sidebar/SidebarTrigger.tsx b/packages/excalidraw/components/Sidebar/SidebarTrigger.tsx index a26e52d2..6e8bf374 100644 --- a/packages/excalidraw/components/Sidebar/SidebarTrigger.tsx +++ b/packages/excalidraw/components/Sidebar/SidebarTrigger.tsx @@ -1,10 +1,12 @@ -import { useExcalidrawSetAppState } from "../App"; -import type { SidebarTriggerProps } from "./common"; -import { useUIAppState } from "../../context/ui-appState"; import clsx from "clsx"; +import { useUIAppState } from "../../context/ui-appState"; +import { useExcalidrawSetAppState } from "../App"; + import "./SidebarTrigger.scss"; +import type { SidebarTriggerProps } from "./common"; + export const SidebarTrigger = ({ name, tab, diff --git a/packages/excalidraw/components/Sidebar/common.ts b/packages/excalidraw/components/Sidebar/common.ts index 35c0c8bb..239b16fc 100644 --- a/packages/excalidraw/components/Sidebar/common.ts +++ b/packages/excalidraw/components/Sidebar/common.ts @@ -1,6 +1,7 @@ -import type { JSX } from "react"; import React from "react"; + import type { AppState, SidebarName, SidebarTabName } from "../../types"; +import type { JSX } from "react"; export type SidebarTriggerProps = { name: SidebarName; diff --git a/packages/excalidraw/components/Sidebar/siderbar.test.helpers.tsx b/packages/excalidraw/components/Sidebar/siderbar.test.helpers.tsx index c2a37431..650eca6b 100644 --- a/packages/excalidraw/components/Sidebar/siderbar.test.helpers.tsx +++ b/packages/excalidraw/components/Sidebar/siderbar.test.helpers.tsx @@ -1,4 +1,5 @@ import React from "react"; + import { Excalidraw } from "../.."; import { GlobalTestState, diff --git a/packages/excalidraw/components/Stack.tsx b/packages/excalidraw/components/Stack.tsx index f45d4711..75e559aa 100644 --- a/packages/excalidraw/components/Stack.tsx +++ b/packages/excalidraw/components/Stack.tsx @@ -1,8 +1,8 @@ -import "./Stack.scss"; - import React, { forwardRef } from "react"; import clsx from "clsx"; +import "./Stack.scss"; + type StackProps = { children: React.ReactNode; gap?: number; diff --git a/packages/excalidraw/components/Stats/Angle.tsx b/packages/excalidraw/components/Stats/Angle.tsx index 409476ad..10c76d51 100644 --- a/packages/excalidraw/components/Stats/Angle.tsx +++ b/packages/excalidraw/components/Stats/Angle.tsx @@ -1,15 +1,19 @@ +import { degreesToRadians, radiansToDegrees } from "@excalidraw/math"; + +import type { Degrees } from "@excalidraw/math"; + import { mutateElement } from "../../element/mutateElement"; import { getBoundTextElement } from "../../element/textElement"; import { isArrowElement, isElbowArrow } from "../../element/typeChecks"; -import type { ExcalidrawElement } from "../../element/types"; import { angleIcon } from "../icons"; + import DragInput from "./DragInput"; -import type { DragInputCallbackType } from "./DragInput"; import { getStepSizedValue, isPropertyEditable, updateBindings } from "./utils"; + +import type { DragInputCallbackType } from "./DragInput"; +import type { ExcalidrawElement } from "../../element/types"; import type Scene from "../../scene/Scene"; import type { AppState } from "../../types"; -import type { Degrees } from "@excalidraw/math"; -import { degreesToRadians, radiansToDegrees } from "@excalidraw/math"; interface AngleProps { element: ExcalidrawElement; diff --git a/packages/excalidraw/components/Stats/CanvasGrid.tsx b/packages/excalidraw/components/Stats/CanvasGrid.tsx index a08f709a..4611365f 100644 --- a/packages/excalidraw/components/Stats/CanvasGrid.tsx +++ b/packages/excalidraw/components/Stats/CanvasGrid.tsx @@ -1,8 +1,10 @@ +import { getNormalizedGridStep } from "../../scene"; + import StatsDragInput from "./DragInput"; +import { getStepSizedValue } from "./utils"; + import type Scene from "../../scene/Scene"; import type { AppState } from "../../types"; -import { getStepSizedValue } from "./utils"; -import { getNormalizedGridStep } from "../../scene"; interface PositionProps { property: "gridStep"; diff --git a/packages/excalidraw/components/Stats/Dimension.tsx b/packages/excalidraw/components/Stats/Dimension.tsx index ce096d28..f58c06ac 100644 --- a/packages/excalidraw/components/Stats/Dimension.tsx +++ b/packages/excalidraw/components/Stats/Dimension.tsx @@ -1,18 +1,21 @@ -import type { ExcalidrawElement } from "../../element/types"; -import DragInput from "./DragInput"; -import type { DragInputCallbackType } from "./DragInput"; -import { getStepSizedValue, isPropertyEditable } from "./utils"; +import { clamp, round } from "@excalidraw/math"; + import { MIN_WIDTH_OR_HEIGHT } from "../../constants"; -import { resizeSingleElement } from "../../element/resizeElements"; -import type Scene from "../../scene/Scene"; -import type { AppState } from "../../types"; -import { isImageElement } from "../../element/typeChecks"; import { MINIMAL_CROP_SIZE, getUncroppedWidthAndHeight, } from "../../element/cropElement"; import { mutateElement } from "../../element/mutateElement"; -import { clamp, round } from "@excalidraw/math"; +import { resizeSingleElement } from "../../element/resizeElements"; +import { isImageElement } from "../../element/typeChecks"; + +import DragInput from "./DragInput"; +import { getStepSizedValue, isPropertyEditable } from "./utils"; + +import type { DragInputCallbackType } from "./DragInput"; +import type { ExcalidrawElement } from "../../element/types"; +import type Scene from "../../scene/Scene"; +import type { AppState } from "../../types"; interface DimensionDragInputProps { property: "width" | "height"; diff --git a/packages/excalidraw/components/Stats/DragInput.tsx b/packages/excalidraw/components/Stats/DragInput.tsx index 82d6419c..fbea33e5 100644 --- a/packages/excalidraw/components/Stats/DragInput.tsx +++ b/packages/excalidraw/components/Stats/DragInput.tsx @@ -1,19 +1,22 @@ +import clsx from "clsx"; import { useEffect, useRef, useState } from "react"; + import { EVENT } from "../../constants"; -import { KEYS } from "../../keys"; -import type { ElementsMap, ExcalidrawElement } from "../../element/types"; import { deepCopyElement } from "../../element/newElement"; -import clsx from "clsx"; +import { KEYS } from "../../keys"; +import { CaptureUpdateAction } from "../../store"; +import { cloneJSON } from "../../utils"; import { useApp } from "../App"; import { InlineIcon } from "../InlineIcon"; -import type { StatsInputProperty } from "./utils"; + import { SMALLEST_DELTA } from "./utils"; -import { CaptureUpdateAction } from "../../store"; -import type Scene from "../../scene/Scene"; import "./DragInput.scss"; + +import type { StatsInputProperty } from "./utils"; +import type { ElementsMap, ExcalidrawElement } from "../../element/types"; +import type Scene from "../../scene/Scene"; import type { AppState } from "../../types"; -import { cloneJSON } from "../../utils"; export type DragInputCallbackType< P extends StatsInputProperty, diff --git a/packages/excalidraw/components/Stats/FontSize.tsx b/packages/excalidraw/components/Stats/FontSize.tsx index 13dc6dbe..4fbdab83 100644 --- a/packages/excalidraw/components/Stats/FontSize.tsx +++ b/packages/excalidraw/components/Stats/FontSize.tsx @@ -1,17 +1,19 @@ +import { isTextElement, redrawTextBoundingBox } from "../../element"; +import { mutateElement } from "../../element/mutateElement"; +import { getBoundTextElement } from "../../element/textElement"; +import { hasBoundTextElement } from "../../element/typeChecks"; +import { fontSizeIcon } from "../icons"; + +import StatsDragInput from "./DragInput"; +import { getStepSizedValue } from "./utils"; + +import type { DragInputCallbackType } from "./DragInput"; import type { ExcalidrawElement, ExcalidrawTextElement, } from "../../element/types"; -import StatsDragInput from "./DragInput"; -import type { DragInputCallbackType } from "./DragInput"; -import { mutateElement } from "../../element/mutateElement"; -import { getStepSizedValue } from "./utils"; -import { fontSizeIcon } from "../icons"; import type Scene from "../../scene/Scene"; import type { AppState } from "../../types"; -import { isTextElement, redrawTextBoundingBox } from "../../element"; -import { hasBoundTextElement } from "../../element/typeChecks"; -import { getBoundTextElement } from "../../element/textElement"; interface FontSizeProps { element: ExcalidrawElement; diff --git a/packages/excalidraw/components/Stats/MultiAngle.tsx b/packages/excalidraw/components/Stats/MultiAngle.tsx index d9a78825..ec314c18 100644 --- a/packages/excalidraw/components/Stats/MultiAngle.tsx +++ b/packages/excalidraw/components/Stats/MultiAngle.tsx @@ -1,16 +1,20 @@ +import { degreesToRadians, radiansToDegrees } from "@excalidraw/math"; + +import type { Degrees } from "@excalidraw/math"; + import { mutateElement } from "../../element/mutateElement"; import { getBoundTextElement } from "../../element/textElement"; import { isArrowElement } from "../../element/typeChecks"; -import type { ExcalidrawElement } from "../../element/types"; import { isInGroup } from "../../groups"; -import type Scene from "../../scene/Scene"; import { angleIcon } from "../icons"; + import DragInput from "./DragInput"; -import type { DragInputCallbackType } from "./DragInput"; import { getStepSizedValue, isPropertyEditable } from "./utils"; + +import type { DragInputCallbackType } from "./DragInput"; +import type { ExcalidrawElement } from "../../element/types"; +import type Scene from "../../scene/Scene"; import type { AppState } from "../../types"; -import type { Degrees } from "@excalidraw/math"; -import { degreesToRadians, radiansToDegrees } from "@excalidraw/math"; interface MultiAngleProps { elements: readonly ExcalidrawElement[]; diff --git a/packages/excalidraw/components/Stats/MultiDimension.tsx b/packages/excalidraw/components/Stats/MultiDimension.tsx index 04f19374..fb9cea94 100644 --- a/packages/excalidraw/components/Stats/MultiDimension.tsx +++ b/packages/excalidraw/components/Stats/MultiDimension.tsx @@ -1,4 +1,7 @@ +import { pointFrom, type GlobalPoint } from "@excalidraw/math"; import { useMemo } from "react"; + +import { MIN_WIDTH_OR_HEIGHT } from "../../constants"; import { getCommonBounds, isTextElement } from "../../element"; import { updateBoundElements } from "../../element/binding"; import { mutateElement } from "../../element/mutateElement"; @@ -10,6 +13,13 @@ import { getBoundTextElement, handleBindTextResize, } from "../../element/textElement"; + +import DragInput from "./DragInput"; +import { getAtomicUnits, getStepSizedValue, isPropertyEditable } from "./utils"; +import { getElementsInAtomicUnit } from "./utils"; + +import type { DragInputCallbackType } from "./DragInput"; +import type { AtomicUnit } from "./utils"; import type { ElementsMap, ExcalidrawElement, @@ -17,13 +27,6 @@ import type { } from "../../element/types"; import type Scene from "../../scene/Scene"; import type { AppState } from "../../types"; -import DragInput from "./DragInput"; -import type { DragInputCallbackType } from "./DragInput"; -import { getAtomicUnits, getStepSizedValue, isPropertyEditable } from "./utils"; -import { getElementsInAtomicUnit } from "./utils"; -import type { AtomicUnit } from "./utils"; -import { MIN_WIDTH_OR_HEIGHT } from "../../constants"; -import { pointFrom, type GlobalPoint } from "@excalidraw/math"; interface MultiDimensionProps { property: "width" | "height"; diff --git a/packages/excalidraw/components/Stats/MultiFontSize.tsx b/packages/excalidraw/components/Stats/MultiFontSize.tsx index 419bbbc3..8335399e 100644 --- a/packages/excalidraw/components/Stats/MultiFontSize.tsx +++ b/packages/excalidraw/components/Stats/MultiFontSize.tsx @@ -1,19 +1,21 @@ import { isTextElement, redrawTextBoundingBox } from "../../element"; import { mutateElement } from "../../element/mutateElement"; +import { getBoundTextElement } from "../../element/textElement"; import { hasBoundTextElement } from "../../element/typeChecks"; +import { isInGroup } from "../../groups"; +import { fontSizeIcon } from "../icons"; + +import StatsDragInput from "./DragInput"; +import { getStepSizedValue } from "./utils"; + +import type { DragInputCallbackType } from "./DragInput"; import type { ExcalidrawElement, ExcalidrawTextElement, NonDeletedSceneElementsMap, } from "../../element/types"; -import { isInGroup } from "../../groups"; import type Scene from "../../scene/Scene"; -import { fontSizeIcon } from "../icons"; -import StatsDragInput from "./DragInput"; -import type { DragInputCallbackType } from "./DragInput"; -import { getStepSizedValue } from "./utils"; import type { AppState } from "../../types"; -import { getBoundTextElement } from "../../element/textElement"; interface MultiFontSizeProps { elements: readonly ExcalidrawElement[]; diff --git a/packages/excalidraw/components/Stats/MultiPosition.tsx b/packages/excalidraw/components/Stats/MultiPosition.tsx index 8a29aa66..a8fdacf2 100644 --- a/packages/excalidraw/components/Stats/MultiPosition.tsx +++ b/packages/excalidraw/components/Stats/MultiPosition.tsx @@ -1,3 +1,14 @@ +import { pointFrom, pointRotateRads } from "@excalidraw/math"; +import { useMemo } from "react"; + +import { getCommonBounds, isTextElement } from "../../element"; + +import StatsDragInput from "./DragInput"; +import { getAtomicUnits, getStepSizedValue, isPropertyEditable } from "./utils"; +import { getElementsInAtomicUnit, moveElement } from "./utils"; + +import type { DragInputCallbackType } from "./DragInput"; +import type { AtomicUnit } from "./utils"; import type { ElementsMap, ExcalidrawElement, @@ -5,15 +16,7 @@ import type { NonDeletedSceneElementsMap, } from "../../element/types"; import type Scene from "../../scene/Scene"; -import StatsDragInput from "./DragInput"; -import type { DragInputCallbackType } from "./DragInput"; -import { getAtomicUnits, getStepSizedValue, isPropertyEditable } from "./utils"; -import { getCommonBounds, isTextElement } from "../../element"; -import { useMemo } from "react"; -import { getElementsInAtomicUnit, moveElement } from "./utils"; -import type { AtomicUnit } from "./utils"; import type { AppState } from "../../types"; -import { pointFrom, pointRotateRads } from "@excalidraw/math"; interface MultiPositionProps { property: "x" | "y"; diff --git a/packages/excalidraw/components/Stats/Position.tsx b/packages/excalidraw/components/Stats/Position.tsx index 038e58eb..08d0a883 100644 --- a/packages/excalidraw/components/Stats/Position.tsx +++ b/packages/excalidraw/components/Stats/Position.tsx @@ -1,16 +1,19 @@ -import type { ElementsMap, ExcalidrawElement } from "../../element/types"; -import StatsDragInput from "./DragInput"; -import type { DragInputCallbackType } from "./DragInput"; -import { getStepSizedValue, moveElement } from "./utils"; -import type Scene from "../../scene/Scene"; -import type { AppState } from "../../types"; import { clamp, pointFrom, pointRotateRads, round } from "@excalidraw/math"; -import { isImageElement } from "../../element/typeChecks"; + import { getFlipAdjustedCropPosition, getUncroppedWidthAndHeight, } from "../../element/cropElement"; import { mutateElement } from "../../element/mutateElement"; +import { isImageElement } from "../../element/typeChecks"; + +import StatsDragInput from "./DragInput"; +import { getStepSizedValue, moveElement } from "./utils"; + +import type { DragInputCallbackType } from "./DragInput"; +import type { ElementsMap, ExcalidrawElement } from "../../element/types"; +import type Scene from "../../scene/Scene"; +import type { AppState } from "../../types"; interface PositionProps { property: "x" | "y"; diff --git a/packages/excalidraw/components/Stats/index.tsx b/packages/excalidraw/components/Stats/index.tsx index 2ccd93ca..56764fef 100644 --- a/packages/excalidraw/components/Stats/index.tsx +++ b/packages/excalidraw/components/Stats/index.tsx @@ -1,37 +1,40 @@ +import { round } from "@excalidraw/math"; +import clsx from "clsx"; +import throttle from "lodash.throttle"; import { useEffect, useMemo, useState, memo } from "react"; + +import { STATS_PANELS } from "../../constants"; import { getCommonBounds } from "../../element/bounds"; -import type { NonDeletedExcalidrawElement } from "../../element/types"; +import { getUncroppedWidthAndHeight } from "../../element/cropElement"; +import { isElbowArrow, isImageElement } from "../../element/typeChecks"; +import { frameAndChildrenSelectedTogether } from "../../frame"; +import { elementsAreInSameGroup } from "../../groups"; import { t } from "../../i18n"; -import type { - AppClassProperties, - AppState, - ExcalidrawProps, -} from "../../types"; -import { CloseIcon } from "../icons"; +import { isGridModeEnabled } from "../../snapping"; +import { useExcalidrawAppState, useExcalidrawSetAppState } from "../App"; import { Island } from "../Island"; -import throttle from "lodash.throttle"; -import Dimension from "./Dimension"; +import { CloseIcon } from "../icons"; + import Angle from "./Angle"; +import CanvasGrid from "./CanvasGrid"; +import Collapsible from "./Collapsible"; +import Dimension from "./Dimension"; import FontSize from "./FontSize"; -import MultiDimension from "./MultiDimension"; -import { elementsAreInSameGroup } from "../../groups"; import MultiAngle from "./MultiAngle"; +import MultiDimension from "./MultiDimension"; import MultiFontSize from "./MultiFontSize"; -import Position from "./Position"; import MultiPosition from "./MultiPosition"; -import Collapsible from "./Collapsible"; -import { useExcalidrawAppState, useExcalidrawSetAppState } from "../App"; +import Position from "./Position"; import { getAtomicUnits } from "./utils"; -import { STATS_PANELS } from "../../constants"; -import { isElbowArrow, isImageElement } from "../../element/typeChecks"; -import CanvasGrid from "./CanvasGrid"; -import clsx from "clsx"; import "./Stats.scss"; -import { isGridModeEnabled } from "../../snapping"; -import { getUncroppedWidthAndHeight } from "../../element/cropElement"; -import { round } from "@excalidraw/math"; -import { frameAndChildrenSelectedTogether } from "../../frame"; + +import type { NonDeletedExcalidrawElement } from "../../element/types"; +import type { + AppClassProperties, + AppState, + ExcalidrawProps, +} from "../../types"; interface StatsProps { app: AppClassProperties; diff --git a/packages/excalidraw/components/Stats/stats.test.tsx b/packages/excalidraw/components/Stats/stats.test.tsx index 49d6a625..b1fe0d68 100644 --- a/packages/excalidraw/components/Stats/stats.test.tsx +++ b/packages/excalidraw/components/Stats/stats.test.tsx @@ -1,31 +1,35 @@ -import React from "react"; +import { degreesToRadians, pointFrom, pointRotateRads } from "@excalidraw/math"; import { act, fireEvent, queryByTestId } from "@testing-library/react"; +import React from "react"; +import { vi } from "vitest"; + +import type { Degrees } from "@excalidraw/math"; + +import { Excalidraw, mutateElement } from "../.."; +import { actionGroup } from "../../actions"; +import { getCommonBounds, isTextElement } from "../../element"; +import { isInGroup } from "../../groups"; +import { t } from "../../i18n"; +import { reseed } from "../../random"; +import * as StaticScene from "../../renderer/staticScene"; +import { API } from "../../tests/helpers/api"; import { Keyboard, Pointer, UI } from "../../tests/helpers/ui"; -import { getStepSizedValue } from "./utils"; +import { getTextEditor, updateTextEditor } from "../../tests/queries/dom"; import { GlobalTestState, mockBoundingClientRect, render, restoreOriginalGetBoundingClientRect, } from "../../tests/test-utils"; -import * as StaticScene from "../../renderer/staticScene"; -import { vi } from "vitest"; -import { reseed } from "../../random"; import { setDateTimeForTests } from "../../utils"; -import { Excalidraw, mutateElement } from "../.."; -import { t } from "../../i18n"; + +import { getStepSizedValue } from "./utils"; + import type { ExcalidrawElement, ExcalidrawLinearElement, ExcalidrawTextElement, } from "../../element/types"; -import { getTextEditor, updateTextEditor } from "../../tests/queries/dom"; -import { getCommonBounds, isTextElement } from "../../element"; -import { API } from "../../tests/helpers/api"; -import { actionGroup } from "../../actions"; -import { isInGroup } from "../../groups"; -import type { Degrees } from "@excalidraw/math"; -import { degreesToRadians, pointFrom, pointRotateRads } from "@excalidraw/math"; const { h } = window; const mouse = new Pointer("mouse"); diff --git a/packages/excalidraw/components/Stats/utils.ts b/packages/excalidraw/components/Stats/utils.ts index 61555bae..219e02fa 100644 --- a/packages/excalidraw/components/Stats/utils.ts +++ b/packages/excalidraw/components/Stats/utils.ts @@ -1,5 +1,7 @@ -import type { Radians } from "@excalidraw/math"; import { pointFrom, pointRotateRads } from "@excalidraw/math"; + +import type { Radians } from "@excalidraw/math"; + import { bindOrUnbindLinearElements, updateBoundElements, @@ -11,17 +13,18 @@ import { isLinearElement, isTextElement, } from "../../element/typeChecks"; +import { + getSelectedGroupIds, + getElementsInGroup, + isInGroup, +} from "../../groups"; + import type { ElementsMap, ExcalidrawElement, NonDeletedExcalidrawElement, NonDeletedSceneElementsMap, } from "../../element/types"; -import { - getSelectedGroupIds, - getElementsInGroup, - isInGroup, -} from "../../groups"; import type Scene from "../../scene/Scene"; import type { AppState } from "../../types"; diff --git a/packages/excalidraw/components/TTDDialog/MermaidToExcalidraw.tsx b/packages/excalidraw/components/TTDDialog/MermaidToExcalidraw.tsx index 83fb91d0..b8cd48df 100644 --- a/packages/excalidraw/components/TTDDialog/MermaidToExcalidraw.tsx +++ b/packages/excalidraw/components/TTDDialog/MermaidToExcalidraw.tsx @@ -1,25 +1,29 @@ import { useState, useRef, useEffect, useDeferredValue } from "react"; -import type { BinaryFiles } from "../../types"; + import { useApp } from "../App"; -import type { NonDeletedExcalidrawElement } from "../../element/types"; import { ArrowRightIcon } from "../icons"; -import "./MermaidToExcalidraw.scss"; +import { EDITOR_LS_KEYS } from "../../constants"; +import { EditorLocalStorage } from "../../data/EditorLocalStorage"; import { t } from "../../i18n"; +import { debounce, isDevEnv } from "../../utils"; import Trans from "../Trans"; -import type { MermaidToExcalidrawLibProps } from "./common"; + +import { TTDDialogInput } from "./TTDDialogInput"; +import { TTDDialogOutput } from "./TTDDialogOutput"; +import { TTDDialogPanel } from "./TTDDialogPanel"; +import { TTDDialogPanels } from "./TTDDialogPanels"; +import { TTDDialogSubmitShortcut } from "./TTDDialogSubmitShortcut"; import { convertMermaidToExcalidraw, insertToEditor, saveMermaidDataToStorage, } from "./common"; -import { TTDDialogPanels } from "./TTDDialogPanels"; -import { TTDDialogPanel } from "./TTDDialogPanel"; -import { TTDDialogInput } from "./TTDDialogInput"; -import { TTDDialogOutput } from "./TTDDialogOutput"; -import { EditorLocalStorage } from "../../data/EditorLocalStorage"; -import { EDITOR_LS_KEYS } from "../../constants"; -import { debounce, isDevEnv } from "../../utils"; -import { TTDDialogSubmitShortcut } from "./TTDDialogSubmitShortcut"; + +import "./MermaidToExcalidraw.scss"; + +import type { BinaryFiles } from "../../types"; +import type { MermaidToExcalidrawLibProps } from "./common"; +import type { NonDeletedExcalidrawElement } from "../../element/types"; const MERMAID_EXAMPLE = "flowchart TD\n A[Christmas] -->|Get money| B(Go shopping)\n B --> C{Let me think}\n C -->|One| D[Laptop]\n C -->|Two| E[iPhone]\n C -->|Three| F[Car]"; diff --git a/packages/excalidraw/components/TTDDialog/TTDDialog.tsx b/packages/excalidraw/components/TTDDialog/TTDDialog.tsx index c77dfbf6..3b9b868f 100644 --- a/packages/excalidraw/components/TTDDialog/TTDDialog.tsx +++ b/packages/excalidraw/components/TTDDialog/TTDDialog.tsx @@ -1,35 +1,39 @@ -import { Dialog } from "../Dialog"; -import { useApp, useExcalidrawSetAppState } from "../App"; -import MermaidToExcalidraw from "./MermaidToExcalidraw"; -import TTDDialogTabs from "./TTDDialogTabs"; -import type { ChangeEventHandler } from "react"; +import { isFiniteNumber } from "@excalidraw/math"; import { useEffect, useRef, useState } from "react"; + +import { trackEvent } from "../../analytics"; import { useUIAppState } from "../../context/ui-appState"; +import { atom, useAtom } from "../../editor-jotai"; +import { t } from "../../i18n"; +import { useApp, useExcalidrawSetAppState } from "../App"; +import { Dialog } from "../Dialog"; +import { InlineIcon } from "../InlineIcon"; import { withInternalFallback } from "../hoc/withInternalFallback"; +import { ArrowRightIcon } from "../icons"; + +import MermaidToExcalidraw from "./MermaidToExcalidraw"; +import TTDDialogTabs from "./TTDDialogTabs"; import { TTDDialogTabTriggers } from "./TTDDialogTabTriggers"; import { TTDDialogTabTrigger } from "./TTDDialogTabTrigger"; import { TTDDialogTab } from "./TTDDialogTab"; -import { t } from "../../i18n"; import { TTDDialogInput } from "./TTDDialogInput"; import { TTDDialogOutput } from "./TTDDialogOutput"; import { TTDDialogPanel } from "./TTDDialogPanel"; import { TTDDialogPanels } from "./TTDDialogPanels"; -import type { MermaidToExcalidrawLibProps } from "./common"; + import { convertMermaidToExcalidraw, insertToEditor, saveMermaidDataToStorage, } from "./common"; -import type { NonDeletedExcalidrawElement } from "../../element/types"; -import type { BinaryFiles } from "../../types"; -import { ArrowRightIcon } from "../icons"; +import { TTDDialogSubmitShortcut } from "./TTDDialogSubmitShortcut"; import "./TTDDialog.scss"; -import { atom, useAtom } from "../../editor-jotai"; -import { trackEvent } from "../../analytics"; -import { InlineIcon } from "../InlineIcon"; -import { TTDDialogSubmitShortcut } from "./TTDDialogSubmitShortcut"; -import { isFiniteNumber } from "@excalidraw/math"; + +import type { ChangeEventHandler } from "react"; +import type { MermaidToExcalidrawLibProps } from "./common"; +import type { NonDeletedExcalidrawElement } from "../../element/types"; +import type { BinaryFiles } from "../../types"; const MIN_PROMPT_LENGTH = 3; const MAX_PROMPT_LENGTH = 1000; diff --git a/packages/excalidraw/components/TTDDialog/TTDDialogInput.tsx b/packages/excalidraw/components/TTDDialog/TTDDialogInput.tsx index e11d0dc3..8e349643 100644 --- a/packages/excalidraw/components/TTDDialog/TTDDialogInput.tsx +++ b/packages/excalidraw/components/TTDDialog/TTDDialogInput.tsx @@ -1,8 +1,10 @@ -import type { ChangeEventHandler } from "react"; import { useEffect, useRef } from "react"; + import { EVENT } from "../../constants"; import { KEYS } from "../../keys"; +import type { ChangeEventHandler } from "react"; + interface TTDDialogInputProps { input: string; placeholder: string; diff --git a/packages/excalidraw/components/TTDDialog/TTDDialogPanel.tsx b/packages/excalidraw/components/TTDDialog/TTDDialogPanel.tsx index 0a78e496..82aede8a 100644 --- a/packages/excalidraw/components/TTDDialog/TTDDialogPanel.tsx +++ b/packages/excalidraw/components/TTDDialog/TTDDialogPanel.tsx @@ -1,8 +1,10 @@ -import type { ReactNode } from "react"; -import { Button } from "../Button"; import clsx from "clsx"; + +import { Button } from "../Button"; import Spinner from "../Spinner"; +import type { ReactNode } from "react"; + interface TTDDialogPanelProps { label: string; children: ReactNode; diff --git a/packages/excalidraw/components/TTDDialog/TTDDialogTabs.tsx b/packages/excalidraw/components/TTDDialog/TTDDialogTabs.tsx index 439f9284..1c9075e7 100644 --- a/packages/excalidraw/components/TTDDialog/TTDDialogTabs.tsx +++ b/packages/excalidraw/components/TTDDialog/TTDDialogTabs.tsx @@ -1,8 +1,10 @@ import * as RadixTabs from "@radix-ui/react-tabs"; -import type { ReactNode } from "react"; import { useRef } from "react"; -import { useExcalidrawSetAppState } from "../App"; + import { isMemberOf } from "../../utils"; +import { useExcalidrawSetAppState } from "../App"; + +import type { ReactNode } from "react"; const TTDDialogTabs = ( props: { diff --git a/packages/excalidraw/components/TTDDialog/TTDDialogTrigger.tsx b/packages/excalidraw/components/TTDDialog/TTDDialogTrigger.tsx index a73f31a6..833b659f 100644 --- a/packages/excalidraw/components/TTDDialog/TTDDialogTrigger.tsx +++ b/packages/excalidraw/components/TTDDialog/TTDDialogTrigger.tsx @@ -1,11 +1,12 @@ -import type { JSX } from "react"; -import type { ReactNode } from "react"; +import { trackEvent } from "../../analytics"; import { useTunnels } from "../../context/tunnels"; -import DropdownMenu from "../dropdownMenu/DropdownMenu"; +import { t } from "../../i18n"; import { useExcalidrawSetAppState } from "../App"; +import DropdownMenu from "../dropdownMenu/DropdownMenu"; import { brainIcon } from "../icons"; -import { t } from "../../i18n"; -import { trackEvent } from "../../analytics"; + +import type { ReactNode } from "react"; +import type { JSX } from "react"; export const TTDDialogTrigger = ({ children, diff --git a/packages/excalidraw/components/TTDDialog/common.ts b/packages/excalidraw/components/TTDDialog/common.ts index 4191126a..89c342c6 100644 --- a/packages/excalidraw/components/TTDDialog/common.ts +++ b/packages/excalidraw/components/TTDDialog/common.ts @@ -1,12 +1,14 @@ import type { MermaidConfig } from "@excalidraw/mermaid-to-excalidraw"; import type { MermaidToExcalidrawResult } from "@excalidraw/mermaid-to-excalidraw/dist/interfaces"; + import { DEFAULT_EXPORT_PADDING, EDITOR_LS_KEYS } from "../../constants"; +import { EditorLocalStorage } from "../../data/EditorLocalStorage"; +import { canvasToBlob } from "../../data/blob"; +import { t } from "../../i18n"; import { convertToExcalidrawElements, exportToCanvas } from "../../index"; + import type { NonDeletedExcalidrawElement } from "../../element/types"; import type { AppClassProperties, BinaryFiles } from "../../types"; -import { canvasToBlob } from "../../data/blob"; -import { EditorLocalStorage } from "../../data/EditorLocalStorage"; -import { t } from "../../i18n"; const resetPreview = ({ canvasRef, diff --git a/packages/excalidraw/components/TextField.tsx b/packages/excalidraw/components/TextField.tsx index c5bdc826..d6bc315b 100644 --- a/packages/excalidraw/components/TextField.tsx +++ b/packages/excalidraw/components/TextField.tsx @@ -1,4 +1,4 @@ -import type { KeyboardEvent } from "react"; +import clsx from "clsx"; import { forwardRef, useRef, @@ -6,12 +6,14 @@ import { useLayoutEffect, useState, } from "react"; -import clsx from "clsx"; -import "./TextField.scss"; import { Button } from "./Button"; import { eyeIcon, eyeClosedIcon } from "./icons"; +import "./TextField.scss"; + +import type { KeyboardEvent } from "react"; + type TextFieldProps = { onChange?: (value: string) => void; onClick?: () => void; diff --git a/packages/excalidraw/components/Toast.tsx b/packages/excalidraw/components/Toast.tsx index d99c9f64..a7167c00 100644 --- a/packages/excalidraw/components/Toast.tsx +++ b/packages/excalidraw/components/Toast.tsx @@ -1,9 +1,12 @@ -import type { CSSProperties } from "react"; import { useCallback, useEffect, useRef } from "react"; + import { CloseIcon } from "./icons"; -import "./Toast.scss"; import { ToolButton } from "./ToolButton"; +import "./Toast.scss"; + +import type { CSSProperties } from "react"; + const DEFAULT_TOAST_TIMEOUT = 5000; export const Toast = ({ diff --git a/packages/excalidraw/components/ToolButton.tsx b/packages/excalidraw/components/ToolButton.tsx index 09b0b6cf..fb76731b 100644 --- a/packages/excalidraw/components/ToolButton.tsx +++ b/packages/excalidraw/components/ToolButton.tsx @@ -1,13 +1,16 @@ -import "./ToolIcon.scss"; - -import type { CSSProperties } from "react"; -import React, { useEffect, useRef, useState } from "react"; import clsx from "clsx"; -import { useExcalidrawContainer } from "./App"; +import React, { useEffect, useRef, useState } from "react"; + import { AbortError } from "../errors"; +import { isPromiseLike } from "../utils"; + +import "./ToolIcon.scss"; + import Spinner from "./Spinner"; +import { useExcalidrawContainer } from "./App"; + import type { PointerType } from "../element/types"; -import { isPromiseLike } from "../utils"; +import type { CSSProperties } from "react"; export type ToolButtonSize = "small" | "medium"; diff --git a/packages/excalidraw/components/Tooltip.tsx b/packages/excalidraw/components/Tooltip.tsx index 38c04ef2..9c7c7ea0 100644 --- a/packages/excalidraw/components/Tooltip.tsx +++ b/packages/excalidraw/components/Tooltip.tsx @@ -1,7 +1,7 @@ -import "./Tooltip.scss"; - import React, { useEffect } from "react"; +import "./Tooltip.scss"; + export const getTooltipDiv = () => { const existingDiv = document.querySelector( ".excalidraw-tooltip", diff --git a/packages/excalidraw/components/Trans.test.tsx b/packages/excalidraw/components/Trans.test.tsx index c331796b..077fcb88 100644 --- a/packages/excalidraw/components/Trans.test.tsx +++ b/packages/excalidraw/components/Trans.test.tsx @@ -1,10 +1,11 @@ import { render } from "@testing-library/react"; +import { EditorJotaiProvider } from "../editor-jotai"; import fallbackLangData from "../locales/en.json"; import Trans from "./Trans"; + import type { TranslationKeys } from "../i18n"; -import { EditorJotaiProvider } from "../editor-jotai"; describe("Test ", () => { it("should translate the the strings correctly", () => { diff --git a/packages/excalidraw/components/Trans.tsx b/packages/excalidraw/components/Trans.tsx index 0cb0f78c..7a6215c8 100644 --- a/packages/excalidraw/components/Trans.tsx +++ b/packages/excalidraw/components/Trans.tsx @@ -1,8 +1,9 @@ import React from "react"; -import type { TranslationKeys } from "../i18n"; import { useI18n } from "../i18n"; +import type { TranslationKeys } from "../i18n"; + // Used for splitting i18nKey into tokens in Trans component // Example: // "Please click {{location}} to continue.".split(SPLIT_REGEX).filter(Boolean) diff --git a/packages/excalidraw/components/UserList.tsx b/packages/excalidraw/components/UserList.tsx index 9fbfc1ae..6c74411a 100644 --- a/packages/excalidraw/components/UserList.tsx +++ b/packages/excalidraw/components/UserList.tsx @@ -1,20 +1,22 @@ -import "./UserList.scss"; - -import React, { useLayoutEffect } from "react"; +import * as Popover from "@radix-ui/react-popover"; import clsx from "clsx"; -import type { Collaborator, SocketId } from "../types"; -import { Tooltip } from "./Tooltip"; -import { useExcalidrawActionManager } from "./App"; -import type { ActionManager } from "../actions/manager"; +import React, { useLayoutEffect } from "react"; -import * as Popover from "@radix-ui/react-popover"; -import { Island } from "./Island"; -import { QuickSearch } from "./QuickSearch"; +import { supportsResizeObserver } from "../constants"; import { t } from "../i18n"; import { isShallowEqual } from "../utils"; -import { supportsResizeObserver } from "../constants"; -import type { MarkRequired } from "../utility-types"; + +import { useExcalidrawActionManager } from "./App"; +import { Island } from "./Island"; +import { QuickSearch } from "./QuickSearch"; import { ScrollableList } from "./ScrollableList"; +import { Tooltip } from "./Tooltip"; + +import "./UserList.scss"; + +import type { ActionManager } from "../actions/manager"; +import type { Collaborator, SocketId } from "../types"; +import type { MarkRequired } from "../utility-types"; export type GoToCollaboratorComponentProps = { socketId: SocketId; diff --git a/packages/excalidraw/components/canvases/InteractiveCanvas.tsx b/packages/excalidraw/components/canvases/InteractiveCanvas.tsx index 03ae0f6b..8388e5e6 100644 --- a/packages/excalidraw/components/canvases/InteractiveCanvas.tsx +++ b/packages/excalidraw/components/canvases/InteractiveCanvas.tsx @@ -1,20 +1,22 @@ import React, { useEffect, useRef } from "react"; -import { isShallowEqual, sceneCoordsToViewportCoords } from "../../utils"; + import { CURSOR_TYPE } from "../../constants"; import { t } from "../../i18n"; -import type { DOMAttributes } from "react"; -import type { AppState, Device, InteractiveCanvasAppState } from "../../types"; +import { isRenderThrottlingEnabled } from "../../reactUtils"; +import { renderInteractiveScene } from "../../renderer/interactiveScene"; +import { isShallowEqual, sceneCoordsToViewportCoords } from "../../utils"; + +import type { + NonDeletedExcalidrawElement, + NonDeletedSceneElementsMap, +} from "../../element/types"; import type { InteractiveCanvasRenderConfig, RenderableElementsMap, RenderInteractiveSceneCallback, } from "../../scene/types"; -import type { - NonDeletedExcalidrawElement, - NonDeletedSceneElementsMap, -} from "../../element/types"; -import { isRenderThrottlingEnabled } from "../../reactUtils"; -import { renderInteractiveScene } from "../../renderer/interactiveScene"; +import type { AppState, Device, InteractiveCanvasAppState } from "../../types"; +import type { DOMAttributes } from "react"; type InteractiveCanvasProps = { containerRef: React.RefObject; diff --git a/packages/excalidraw/components/canvases/NewElementCanvas.tsx b/packages/excalidraw/components/canvases/NewElementCanvas.tsx index 18156711..524d6af3 100644 --- a/packages/excalidraw/components/canvases/NewElementCanvas.tsx +++ b/packages/excalidraw/components/canvases/NewElementCanvas.tsx @@ -1,13 +1,15 @@ import { useEffect, useRef } from "react"; + +import { isRenderThrottlingEnabled } from "../../reactUtils"; +import { renderNewElementScene } from "../../renderer/renderNewElementScene"; + import type { NonDeletedSceneElementsMap } from "../../element/types"; -import type { AppState } from "../../types"; import type { RenderableElementsMap, StaticCanvasRenderConfig, } from "../../scene/types"; +import type { AppState } from "../../types"; import type { RoughCanvas } from "roughjs/bin/canvas"; -import { renderNewElementScene } from "../../renderer/renderNewElementScene"; -import { isRenderThrottlingEnabled } from "../../reactUtils"; interface NewElementCanvasProps { appState: AppState; diff --git a/packages/excalidraw/components/canvases/StaticCanvas.tsx b/packages/excalidraw/components/canvases/StaticCanvas.tsx index 9185bdd5..6e2df953 100644 --- a/packages/excalidraw/components/canvases/StaticCanvas.tsx +++ b/packages/excalidraw/components/canvases/StaticCanvas.tsx @@ -1,17 +1,19 @@ import React, { useEffect, useRef } from "react"; -import type { RoughCanvas } from "roughjs/bin/canvas"; + +import { isRenderThrottlingEnabled } from "../../reactUtils"; import { renderStaticScene } from "../../renderer/staticScene"; import { isShallowEqual } from "../../utils"; -import type { AppState, StaticCanvasAppState } from "../../types"; -import type { - RenderableElementsMap, - StaticCanvasRenderConfig, -} from "../../scene/types"; + import type { NonDeletedExcalidrawElement, NonDeletedSceneElementsMap, } from "../../element/types"; -import { isRenderThrottlingEnabled } from "../../reactUtils"; +import type { + RenderableElementsMap, + StaticCanvasRenderConfig, +} from "../../scene/types"; +import type { AppState, StaticCanvasAppState } from "../../types"; +import type { RoughCanvas } from "roughjs/bin/canvas"; type StaticCanvasProps = { canvas: HTMLCanvasElement; diff --git a/packages/excalidraw/components/dropdownMenu/DropdownMenu.test.tsx b/packages/excalidraw/components/dropdownMenu/DropdownMenu.test.tsx index 0c8deec8..d4c0b7a8 100644 --- a/packages/excalidraw/components/dropdownMenu/DropdownMenu.test.tsx +++ b/packages/excalidraw/components/dropdownMenu/DropdownMenu.test.tsx @@ -1,4 +1,5 @@ import React from "react"; + import { Excalidraw } from "../../index"; import { KEYS } from "../../keys"; import { Keyboard } from "../../tests/helpers/ui"; diff --git a/packages/excalidraw/components/dropdownMenu/DropdownMenu.tsx b/packages/excalidraw/components/dropdownMenu/DropdownMenu.tsx index 8f4ce435..e1412e20 100644 --- a/packages/excalidraw/components/dropdownMenu/DropdownMenu.tsx +++ b/packages/excalidraw/components/dropdownMenu/DropdownMenu.tsx @@ -1,11 +1,12 @@ import React from "react"; -import DropdownMenuTrigger from "./DropdownMenuTrigger"; -import DropdownMenuItem from "./DropdownMenuItem"; -import MenuSeparator from "./DropdownMenuSeparator"; -import DropdownMenuGroup from "./DropdownMenuGroup"; + import DropdownMenuContent from "./DropdownMenuContent"; -import DropdownMenuItemLink from "./DropdownMenuItemLink"; +import DropdownMenuGroup from "./DropdownMenuGroup"; +import DropdownMenuItem from "./DropdownMenuItem"; import DropdownMenuItemCustom from "./DropdownMenuItemCustom"; +import DropdownMenuItemLink from "./DropdownMenuItemLink"; +import MenuSeparator from "./DropdownMenuSeparator"; +import DropdownMenuTrigger from "./DropdownMenuTrigger"; import { getMenuContentComponent, getMenuTriggerComponent, diff --git a/packages/excalidraw/components/dropdownMenu/DropdownMenuContent.tsx b/packages/excalidraw/components/dropdownMenu/DropdownMenuContent.tsx index a203124d..24a0a4d2 100644 --- a/packages/excalidraw/components/dropdownMenu/DropdownMenuContent.tsx +++ b/packages/excalidraw/components/dropdownMenu/DropdownMenuContent.tsx @@ -1,13 +1,15 @@ -import { Island } from "../Island"; -import { useDevice } from "../App"; import clsx from "clsx"; -import Stack from "../Stack"; import React, { useEffect, useRef } from "react"; -import { DropdownMenuContentPropsContext } from "./common"; -import { useOutsideClick } from "../../hooks/useOutsideClick"; -import { KEYS } from "../../keys"; + import { EVENT } from "../../constants"; +import { useOutsideClick } from "../../hooks/useOutsideClick"; import { useStable } from "../../hooks/useStable"; +import { KEYS } from "../../keys"; +import { useDevice } from "../App"; +import { Island } from "../Island"; +import Stack from "../Stack"; + +import { DropdownMenuContentPropsContext } from "./common"; const MenuContent = ({ children, diff --git a/packages/excalidraw/components/dropdownMenu/DropdownMenuItem.tsx b/packages/excalidraw/components/dropdownMenu/DropdownMenuItem.tsx index 1ff53f8a..fc19bd1b 100644 --- a/packages/excalidraw/components/dropdownMenu/DropdownMenuItem.tsx +++ b/packages/excalidraw/components/dropdownMenu/DropdownMenuItem.tsx @@ -1,13 +1,16 @@ -import type { JSX } from "react"; import React, { useEffect, useRef } from "react"; + +import { THEME } from "../../constants"; +import { useExcalidrawAppState } from "../App"; + +import MenuItemContent from "./DropdownMenuItemContent"; import { getDropdownMenuItemClassName, useHandleDropdownMenuItemClick, } from "./common"; -import MenuItemContent from "./DropdownMenuItemContent"; -import { useExcalidrawAppState } from "../App"; -import { THEME } from "../../constants"; + import type { ValueOf } from "../../utility-types"; +import type { JSX } from "react"; const DropdownMenuItem = ({ icon, diff --git a/packages/excalidraw/components/dropdownMenu/DropdownMenuItemContent.tsx b/packages/excalidraw/components/dropdownMenu/DropdownMenuItemContent.tsx index 000b8c34..b2f9e7e0 100644 --- a/packages/excalidraw/components/dropdownMenu/DropdownMenuItemContent.tsx +++ b/packages/excalidraw/components/dropdownMenu/DropdownMenuItemContent.tsx @@ -1,6 +1,7 @@ -import type { JSX } from "react"; import { useDevice } from "../App"; +import type { JSX } from "react"; + const MenuItemContent = ({ textStyle, icon, diff --git a/packages/excalidraw/components/dropdownMenu/DropdownMenuItemLink.tsx b/packages/excalidraw/components/dropdownMenu/DropdownMenuItemLink.tsx index 2dbee758..1457f5ae 100644 --- a/packages/excalidraw/components/dropdownMenu/DropdownMenuItemLink.tsx +++ b/packages/excalidraw/components/dropdownMenu/DropdownMenuItemLink.tsx @@ -1,11 +1,13 @@ -import MenuItemContent from "./DropdownMenuItemContent"; -import type { JSX } from "react"; import React from "react"; + +import MenuItemContent from "./DropdownMenuItemContent"; import { getDropdownMenuItemClassName, useHandleDropdownMenuItemClick, } from "./common"; +import type { JSX } from "react"; + const DropdownMenuItemLink = ({ icon, shortcut, diff --git a/packages/excalidraw/components/dropdownMenu/DropdownMenuTrigger.tsx b/packages/excalidraw/components/dropdownMenu/DropdownMenuTrigger.tsx index e7369ba5..a7301fb4 100644 --- a/packages/excalidraw/components/dropdownMenu/DropdownMenuTrigger.tsx +++ b/packages/excalidraw/components/dropdownMenu/DropdownMenuTrigger.tsx @@ -1,4 +1,5 @@ import clsx from "clsx"; + import { useDevice } from "../App"; const MenuTrigger = ({ diff --git a/packages/excalidraw/components/dropdownMenu/common.ts b/packages/excalidraw/components/dropdownMenu/common.ts index a2a46fc9..312b78aa 100644 --- a/packages/excalidraw/components/dropdownMenu/common.ts +++ b/packages/excalidraw/components/dropdownMenu/common.ts @@ -1,4 +1,5 @@ import React, { useContext } from "react"; + import { EVENT } from "../../constants"; import { composeEventHandlers } from "../../utils"; diff --git a/packages/excalidraw/components/footer/Footer.tsx b/packages/excalidraw/components/footer/Footer.tsx index ccbe9eae..427628e7 100644 --- a/packages/excalidraw/components/footer/Footer.tsx +++ b/packages/excalidraw/components/footer/Footer.tsx @@ -1,6 +1,7 @@ import clsx from "clsx"; + import { actionShortcuts } from "../../actions"; -import type { ActionManager } from "../../actions/manager"; +import { useTunnels } from "../../context/tunnels"; import { ExitZenModeAction, FinalizeAction, @@ -8,10 +9,11 @@ import { ZoomActions, } from "../Actions"; import { useDevice } from "../App"; -import { useTunnels } from "../../context/tunnels"; import { HelpButton } from "../HelpButton"; import { Section } from "../Section"; import Stack from "../Stack"; + +import type { ActionManager } from "../../actions/manager"; import type { UIAppState } from "../../types"; const Footer = ({ diff --git a/packages/excalidraw/components/footer/FooterCenter.tsx b/packages/excalidraw/components/footer/FooterCenter.tsx index 55a0fb99..6a44581d 100644 --- a/packages/excalidraw/components/footer/FooterCenter.tsx +++ b/packages/excalidraw/components/footer/FooterCenter.tsx @@ -1,8 +1,10 @@ import clsx from "clsx"; + import { useTunnels } from "../../context/tunnels"; -import "./FooterCenter.scss"; import { useUIAppState } from "../../context/ui-appState"; +import "./FooterCenter.scss"; + const FooterCenter = ({ children }: { children?: React.ReactNode }) => { const { FooterCenterTunnel } = useTunnels(); const appState = useUIAppState(); diff --git a/packages/excalidraw/components/hoc/withInternalFallback.test.tsx b/packages/excalidraw/components/hoc/withInternalFallback.test.tsx index 55431337..1f30a64c 100644 --- a/packages/excalidraw/components/hoc/withInternalFallback.test.tsx +++ b/packages/excalidraw/components/hoc/withInternalFallback.test.tsx @@ -1,6 +1,7 @@ import React from "react"; -import { render, queryAllByTestId } from "../../tests/test-utils"; + import { Excalidraw, MainMenu } from "../../index"; +import { render, queryAllByTestId } from "../../tests/test-utils"; describe("Test internal component fallback rendering", () => { it("should render only one menu per excalidraw instance (custom menu first scenario)", async () => { diff --git a/packages/excalidraw/components/hoc/withInternalFallback.tsx b/packages/excalidraw/components/hoc/withInternalFallback.tsx index 5906b30f..298f58dd 100644 --- a/packages/excalidraw/components/hoc/withInternalFallback.tsx +++ b/packages/excalidraw/components/hoc/withInternalFallback.tsx @@ -1,4 +1,5 @@ import React, { useLayoutEffect, useRef } from "react"; + import { useTunnels } from "../../context/tunnels"; import { atom } from "../../editor-jotai"; diff --git a/packages/excalidraw/components/hyperlink/Hyperlink.tsx b/packages/excalidraw/components/hyperlink/Hyperlink.tsx index 4d3dce64..88983aea 100644 --- a/packages/excalidraw/components/hyperlink/Hyperlink.tsx +++ b/packages/excalidraw/components/hyperlink/Hyperlink.tsx @@ -1,20 +1,5 @@ -import type { AppState, ExcalidrawProps, UIAppState } from "../../types"; -import { - sceneCoordsToViewportCoords, - viewportCoordsToSceneCoords, - wrapEvent, -} from "../../utils"; -import { getEmbedLink, embeddableURLValidator } from "../../element/embeddable"; -import { mutateElement } from "../../element/mutateElement"; -import type { - ElementsMap, - ExcalidrawEmbeddableElement, - NonDeletedExcalidrawElement, -} from "../../element/types"; - -import { ToolButton } from "../ToolButton"; -import { FreedrawIcon, TrashIcon, elementLinkIcon } from "../icons"; -import { t } from "../../i18n"; +import { pointFrom, type GlobalPoint } from "@excalidraw/math"; +import clsx from "clsx"; import { useCallback, useEffect, @@ -22,23 +7,40 @@ import { useRef, useState, } from "react"; -import clsx from "clsx"; -import { KEYS } from "../../keys"; + +import { trackEvent } from "../../analytics"; +import { getTooltipDiv, updateTooltipPosition } from "../../components/Tooltip"; import { EVENT, HYPERLINK_TOOLTIP_DELAY } from "../../constants"; +import { isLocalLink, normalizeLink } from "../../data/url"; import { getElementAbsoluteCoords } from "../../element/bounds"; -import { getTooltipDiv, updateTooltipPosition } from "../../components/Tooltip"; -import { getSelectedElements } from "../../scene"; import { hitElementBoundingBox } from "../../element/collision"; -import { isLocalLink, normalizeLink } from "../../data/url"; -import { trackEvent } from "../../analytics"; +import { isElementLink } from "../../element/elementLink"; +import { getEmbedLink, embeddableURLValidator } from "../../element/embeddable"; +import { mutateElement } from "../../element/mutateElement"; +import { t } from "../../i18n"; +import { + sceneCoordsToViewportCoords, + viewportCoordsToSceneCoords, + wrapEvent, +} from "../../utils"; import { useAppProps, useDevice, useExcalidrawAppState } from "../App"; +import { ToolButton } from "../ToolButton"; +import { FreedrawIcon, TrashIcon, elementLinkIcon } from "../icons"; +import { KEYS } from "../../keys"; +import { getSelectedElements } from "../../scene"; import { isEmbeddableElement } from "../../element/typeChecks"; + import { getLinkHandleFromCoords } from "./helpers"; -import { pointFrom, type GlobalPoint } from "@excalidraw/math"; -import { isElementLink } from "../../element/elementLink"; import "./Hyperlink.scss"; +import type { + ElementsMap, + ExcalidrawEmbeddableElement, + NonDeletedExcalidrawElement, +} from "../../element/types"; +import type { AppState, ExcalidrawProps, UIAppState } from "../../types"; + const POPUP_WIDTH = 380; const POPUP_HEIGHT = 42; const POPUP_PADDING = 5; diff --git a/packages/excalidraw/components/hyperlink/helpers.ts b/packages/excalidraw/components/hyperlink/helpers.ts index 75c5dad9..3d39e2eb 100644 --- a/packages/excalidraw/components/hyperlink/helpers.ts +++ b/packages/excalidraw/components/hyperlink/helpers.ts @@ -1,14 +1,17 @@ -import type { GlobalPoint, Radians } from "@excalidraw/math"; import { pointFrom, pointRotateRads } from "@excalidraw/math"; + +import type { GlobalPoint, Radians } from "@excalidraw/math"; + import { MIME_TYPES } from "../../constants"; -import type { Bounds } from "../../element/bounds"; import { getElementAbsoluteCoords } from "../../element/bounds"; import { hitElementBoundingBox } from "../../element/collision"; +import { DEFAULT_LINK_SIZE } from "../../renderer/renderElement"; + +import type { Bounds } from "../../element/bounds"; import type { ElementsMap, NonDeletedExcalidrawElement, } from "../../element/types"; -import { DEFAULT_LINK_SIZE } from "../../renderer/renderElement"; import type { AppState, UIAppState } from "../../types"; export const EXTERNAL_LINK_IMG = document.createElement("img"); diff --git a/packages/excalidraw/components/icons.tsx b/packages/excalidraw/components/icons.tsx index 073d7a9f..03e6ca2b 100644 --- a/packages/excalidraw/components/icons.tsx +++ b/packages/excalidraw/components/icons.tsx @@ -6,13 +6,14 @@ // Note: when adding new icons, review https://developer.mozilla.org/en-US/docs/Mozilla/Developer_guide/RTL_Guidelines // to determine whether or not the icons should be mirrored in right-to-left languages. +import clsx from "clsx"; +import oc from "open-color"; import React from "react"; -import oc from "open-color"; -import clsx from "clsx"; -import type { Theme } from "../element/types"; import { THEME } from "../constants"; +import type { Theme } from "../element/types"; + export const iconFillColor = (theme: Theme) => "var(--icon-fill-color)"; const handlerColor = (theme: Theme) => diff --git a/packages/excalidraw/components/live-collaboration/LiveCollaborationTrigger.tsx b/packages/excalidraw/components/live-collaboration/LiveCollaborationTrigger.tsx index a22bc523..1aa18716 100644 --- a/packages/excalidraw/components/live-collaboration/LiveCollaborationTrigger.tsx +++ b/packages/excalidraw/components/live-collaboration/LiveCollaborationTrigger.tsx @@ -1,11 +1,11 @@ +import clsx from "clsx"; + import { t } from "../../i18n"; -import { share } from "../icons"; import { Button } from "../Button"; - -import clsx from "clsx"; +import { share } from "../icons"; +import { useUIAppState } from "../../context/ui-appState"; import "./LiveCollaborationTrigger.scss"; -import { useUIAppState } from "../../context/ui-appState"; const LiveCollaborationTrigger = ({ isCollaborating, diff --git a/packages/excalidraw/components/main-menu/DefaultItems.tsx b/packages/excalidraw/components/main-menu/DefaultItems.tsx index 632ea4ff..c2307d52 100644 --- a/packages/excalidraw/components/main-menu/DefaultItems.tsx +++ b/packages/excalidraw/components/main-menu/DefaultItems.tsx @@ -1,11 +1,32 @@ +import clsx from "clsx"; + +import { + actionClearCanvas, + actionLoadScene, + actionSaveToActiveFile, + actionShortcuts, + actionToggleSearchMenu, + actionToggleTheme, +} from "../../actions"; import { getShortcutFromShortcutName } from "../../actions/shortcuts"; +import { trackEvent } from "../../analytics"; +import { THEME } from "../../constants"; +import { useUIAppState } from "../../context/ui-appState"; +import { useSetAtom } from "../../editor-jotai"; import { useI18n } from "../../i18n"; +import { activeConfirmDialogAtom } from "../ActiveConfirmDialog"; import { useExcalidrawSetAppState, useExcalidrawActionManager, useExcalidrawElements, useAppProps, } from "../App"; +import { openConfirmModal } from "../OverwriteConfirm/OverwriteConfirmState"; +import Trans from "../Trans"; +import DropdownMenuItem from "../dropdownMenu/DropdownMenuItem"; +import DropdownMenuItemContentRadio from "../dropdownMenu/DropdownMenuItemContentRadio"; +import DropdownMenuItemLink from "../dropdownMenu/DropdownMenuItemLink"; +import { GithubIcon, DiscordIcon, XBrandIcon } from "../icons"; import { boltIcon, DeviceDesktopIcon, @@ -20,29 +41,11 @@ import { TrashIcon, usersIcon, } from "../icons"; -import { GithubIcon, DiscordIcon, XBrandIcon } from "../icons"; -import DropdownMenuItem from "../dropdownMenu/DropdownMenuItem"; -import DropdownMenuItemLink from "../dropdownMenu/DropdownMenuItemLink"; -import { - actionClearCanvas, - actionLoadScene, - actionSaveToActiveFile, - actionShortcuts, - actionToggleSearchMenu, - actionToggleTheme, -} from "../../actions"; -import clsx from "clsx"; -import { activeConfirmDialogAtom } from "../ActiveConfirmDialog"; -import { useSetAtom } from "../../editor-jotai"; -import { useUIAppState } from "../../context/ui-appState"; -import { openConfirmModal } from "../OverwriteConfirm/OverwriteConfirmState"; -import Trans from "../Trans"; -import DropdownMenuItemContentRadio from "../dropdownMenu/DropdownMenuItemContentRadio"; -import { THEME } from "../../constants"; -import type { Theme } from "../../element/types"; -import { trackEvent } from "../../analytics"; + import "./DefaultItems.scss"; +import type { Theme } from "../../element/types"; + export const LoadScene = () => { const { t } = useI18n(); const actionManager = useExcalidrawActionManager(); diff --git a/packages/excalidraw/components/main-menu/MainMenu.tsx b/packages/excalidraw/components/main-menu/MainMenu.tsx index 07afd3c1..54f60a36 100644 --- a/packages/excalidraw/components/main-menu/MainMenu.tsx +++ b/packages/excalidraw/components/main-menu/MainMenu.tsx @@ -1,17 +1,17 @@ import React from "react"; + +import { useTunnels } from "../../context/tunnels"; +import { useUIAppState } from "../../context/ui-appState"; +import { t } from "../../i18n"; +import { composeEventHandlers } from "../../utils"; import { useDevice, useExcalidrawSetAppState } from "../App"; +import { UserList } from "../UserList"; import DropdownMenu from "../dropdownMenu/DropdownMenu"; +import { withInternalFallback } from "../hoc/withInternalFallback"; +import { HamburgerMenuIcon } from "../icons"; import * as DefaultItems from "./DefaultItems"; -import { UserList } from "../UserList"; -import { t } from "../../i18n"; -import { HamburgerMenuIcon } from "../icons"; -import { withInternalFallback } from "../hoc/withInternalFallback"; -import { composeEventHandlers } from "../../utils"; -import { useTunnels } from "../../context/tunnels"; -import { useUIAppState } from "../../context/ui-appState"; - const MainMenu = Object.assign( withInternalFallback( "MainMenu", diff --git a/packages/excalidraw/components/welcome-screen/WelcomeScreen.Center.tsx b/packages/excalidraw/components/welcome-screen/WelcomeScreen.Center.tsx index 4faa41bf..bd9b9e55 100644 --- a/packages/excalidraw/components/welcome-screen/WelcomeScreen.Center.tsx +++ b/packages/excalidraw/components/welcome-screen/WelcomeScreen.Center.tsx @@ -1,12 +1,13 @@ -import type { JSX } from "react"; import { actionLoadScene, actionShortcuts } from "../../actions"; import { getShortcutFromShortcutName } from "../../actions/shortcuts"; -import { t, useI18n } from "../../i18n"; -import { useDevice, useExcalidrawActionManager } from "../App"; import { useTunnels } from "../../context/tunnels"; -import { HelpIcon, LoadIcon, usersIcon } from "../icons"; import { useUIAppState } from "../../context/ui-appState"; +import { t, useI18n } from "../../i18n"; +import { useDevice, useExcalidrawActionManager } from "../App"; import { ExcalidrawLogo } from "../ExcalidrawLogo"; +import { HelpIcon, LoadIcon, usersIcon } from "../icons"; + +import type { JSX } from "react"; const WelcomeScreenMenuItemContent = ({ icon, diff --git a/packages/excalidraw/components/welcome-screen/WelcomeScreen.Hints.tsx b/packages/excalidraw/components/welcome-screen/WelcomeScreen.Hints.tsx index 896f4014..e47a5a1d 100644 --- a/packages/excalidraw/components/welcome-screen/WelcomeScreen.Hints.tsx +++ b/packages/excalidraw/components/welcome-screen/WelcomeScreen.Hints.tsx @@ -1,5 +1,5 @@ -import { t } from "../../i18n"; import { useTunnels } from "../../context/tunnels"; +import { t } from "../../i18n"; import { WelcomeScreenHelpArrow, WelcomeScreenMenuArrow, diff --git a/packages/excalidraw/constants.ts b/packages/excalidraw/constants.ts index 616ced1a..88cddd5c 100644 --- a/packages/excalidraw/constants.ts +++ b/packages/excalidraw/constants.ts @@ -1,7 +1,8 @@ -import type { AppProps, AppState } from "./types"; -import type { ExcalidrawElement, FontFamilyValues } from "./element/types"; import { COLOR_PALETTE } from "./colors"; +import type { ExcalidrawElement, FontFamilyValues } from "./element/types"; +import type { AppProps, AppState } from "./types"; + export const isDarwin = /Mac|iPod|iPhone|iPad/.test(navigator.platform); export const isWindows = /^Win/.test(navigator.platform); export const isAndroid = /\b(android)\b/i.test(navigator.userAgent); diff --git a/packages/excalidraw/context/tunnels.ts b/packages/excalidraw/context/tunnels.ts index 73b85ba6..370a0f2b 100644 --- a/packages/excalidraw/context/tunnels.ts +++ b/packages/excalidraw/context/tunnels.ts @@ -1,6 +1,6 @@ +import { createIsolation } from "jotai-scope"; import React from "react"; import tunnel from "tunnel-rat"; -import { createIsolation } from "jotai-scope"; export type Tunnel = ReturnType; diff --git a/packages/excalidraw/context/ui-appState.ts b/packages/excalidraw/context/ui-appState.ts index f94ce28c..174b6e89 100644 --- a/packages/excalidraw/context/ui-appState.ts +++ b/packages/excalidraw/context/ui-appState.ts @@ -1,4 +1,5 @@ import React from "react"; + import type { UIAppState } from "../types"; export const UIAppStateContext = React.createContext(null!); diff --git a/packages/excalidraw/cursor.ts b/packages/excalidraw/cursor.ts index 759b7a4a..1aa6e52d 100644 --- a/packages/excalidraw/cursor.ts +++ b/packages/excalidraw/cursor.ts @@ -1,7 +1,9 @@ -import { CURSOR_TYPE, MIME_TYPES, THEME } from "./constants"; import OpenColor from "open-color"; -import type { AppState, DataURL } from "./types"; + import { isHandToolActive, isEraserActive } from "./appState"; +import { CURSOR_TYPE, MIME_TYPES, THEME } from "./constants"; + +import type { AppState, DataURL } from "./types"; const laserPointerCursorSVG_tag = ``; const laserPointerCursorBackgroundSVG = ``; diff --git a/packages/excalidraw/data/blob.ts b/packages/excalidraw/data/blob.ts index 2293f860..54505068 100644 --- a/packages/excalidraw/data/blob.ts +++ b/packages/excalidraw/data/blob.ts @@ -1,19 +1,22 @@ import { nanoid } from "nanoid"; + import { cleanAppStateForExport } from "../appState"; import { IMAGE_MIME_TYPES, MIME_TYPES } from "../constants"; import { clearElementsForExport } from "../element"; -import type { ExcalidrawElement, FileId } from "../element/types"; import { CanvasError, ImageSceneDataError } from "../errors"; import { calculateScrollCenter } from "../scene"; import { decodeSvgBase64Payload } from "../scene/export"; -import type { AppState, DataURL, LibraryItem } from "../types"; -import type { ValueOf } from "../utility-types"; import { bytesToHexString, isPromiseLike } from "../utils"; + import { base64ToString, stringToBase64, toByteString } from "./encode"; -import type { FileSystemHandle } from "./filesystem"; import { nativeFileSystemSupported } from "./filesystem"; import { isValidExcalidrawData, isValidLibrary } from "./json"; import { restore, restoreLibraryItems } from "./restore"; + +import type { FileSystemHandle } from "./filesystem"; +import type { ExcalidrawElement, FileId } from "../element/types"; +import type { AppState, DataURL, LibraryItem } from "../types"; +import type { ValueOf } from "../utility-types"; import type { ImportedLibraryData } from "./types"; const parseFileContents = async (blob: Blob | File): Promise => { diff --git a/packages/excalidraw/data/encode.ts b/packages/excalidraw/data/encode.ts index 15dfdb2c..31d7a5bc 100644 --- a/packages/excalidraw/data/encode.ts +++ b/packages/excalidraw/data/encode.ts @@ -1,4 +1,5 @@ import { deflate, inflate } from "pako"; + import { encryptData, decryptData } from "./encryption"; // ----------------------------------------------------------------------------- diff --git a/packages/excalidraw/data/encryption.ts b/packages/excalidraw/data/encryption.ts index 33e68997..a796d05b 100644 --- a/packages/excalidraw/data/encryption.ts +++ b/packages/excalidraw/data/encryption.ts @@ -1,4 +1,5 @@ import { ENCRYPTION_KEY_BITS } from "../constants"; + import { blobToArrayBuffer } from "./blob"; export const IV_LENGTH_BYTES = 12; diff --git a/packages/excalidraw/data/filesystem.ts b/packages/excalidraw/data/filesystem.ts index 186d5873..0bdab68f 100644 --- a/packages/excalidraw/data/filesystem.ts +++ b/packages/excalidraw/data/filesystem.ts @@ -1,13 +1,15 @@ -import type { FileSystemHandle } from "browser-fs-access"; import { fileOpen as _fileOpen, fileSave as _fileSave, supported as nativeFileSystemSupported, } from "browser-fs-access"; + import { EVENT, MIME_TYPES } from "../constants"; import { AbortError } from "../errors"; import { debounce } from "../utils"; +import type { FileSystemHandle } from "browser-fs-access"; + type FILE_EXTENSION = Exclude; const INPUT_CHANGE_INTERVAL_MS = 500; diff --git a/packages/excalidraw/data/image.ts b/packages/excalidraw/data/image.ts index 0359a9c3..e54f7bab 100644 --- a/packages/excalidraw/data/image.ts +++ b/packages/excalidraw/data/image.ts @@ -1,9 +1,11 @@ -import decodePng from "png-chunks-extract"; import tEXt from "png-chunk-text"; import encodePng from "png-chunks-encode"; -import { encode, decode } from "./encode"; +import decodePng from "png-chunks-extract"; + import { EXPORT_DATA_TYPES, MIME_TYPES } from "../constants"; + import { blobToArrayBuffer } from "./blob"; +import { encode, decode } from "./encode"; // ----------------------------------------------------------------------------- // PNG diff --git a/packages/excalidraw/data/index.ts b/packages/excalidraw/data/index.ts index 04cdcaf9..013ac5b7 100644 --- a/packages/excalidraw/data/index.ts +++ b/packages/excalidraw/data/index.ts @@ -11,23 +11,25 @@ import { } from "../constants"; import { getNonDeletedElements } from "../element"; import { isFrameLikeElement } from "../element/typeChecks"; -import type { - ExcalidrawElement, - ExcalidrawFrameLikeElement, - NonDeletedExcalidrawElement, -} from "../element/types"; import { getElementsOverlappingFrame } from "../frame"; import { t } from "../i18n"; import { getSelectedElements, isSomeElementSelected } from "../scene"; import { exportToCanvas, exportToSvg } from "../scene/export"; -import type { ExportType } from "../scene/types"; -import type { AppState, BinaryFiles } from "../types"; import { cloneJSON } from "../utils"; + import { canvasToBlob } from "./blob"; -import type { FileSystemHandle } from "./filesystem"; import { fileSave } from "./filesystem"; import { serializeAsJSON } from "./json"; +import type { FileSystemHandle } from "./filesystem"; +import type { + ExcalidrawElement, + ExcalidrawFrameLikeElement, + NonDeletedExcalidrawElement, +} from "../element/types"; +import type { ExportType } from "../scene/types"; +import type { AppState, BinaryFiles } from "../types"; + export { loadFromBlob } from "./blob"; export { loadFromJSON, saveAsJSON } from "./json"; diff --git a/packages/excalidraw/data/json.ts b/packages/excalidraw/data/json.ts index 1270fd1b..c1cdd4f9 100644 --- a/packages/excalidraw/data/json.ts +++ b/packages/excalidraw/data/json.ts @@ -1,4 +1,3 @@ -import { fileOpen, fileSave } from "./filesystem"; import { cleanAppStateForExport, clearAppStateForDatabase } from "../appState"; import { DEFAULT_FILENAME, @@ -8,10 +7,12 @@ import { VERSIONS, } from "../constants"; import { clearElementsForDatabase, clearElementsForExport } from "../element"; -import type { ExcalidrawElement } from "../element/types"; -import type { AppState, BinaryFiles, LibraryItems } from "../types"; + import { isImageFileHandle, loadFromBlob, normalizeFile } from "./blob"; +import { fileOpen, fileSave } from "./filesystem"; +import type { ExcalidrawElement } from "../element/types"; +import type { AppState, BinaryFiles, LibraryItems } from "../types"; import type { ExportedDataState, ImportedDataState, diff --git a/packages/excalidraw/data/library.ts b/packages/excalidraw/data/library.ts index 1c23edcf..76424f54 100644 --- a/packages/excalidraw/data/library.ts +++ b/packages/excalidraw/data/library.ts @@ -1,19 +1,5 @@ -import { loadLibraryFromBlob } from "./blob"; -import type { - LibraryItems, - LibraryItem, - ExcalidrawImperativeAPI, - LibraryItemsSource, - LibraryItems_anyVersion, -} from "../types"; -import { restoreLibraryItems } from "./restore"; -import type App from "../components/App"; -import { atom, editorJotaiStore } from "../editor-jotai"; -import type { ExcalidrawElement } from "../element/types"; -import { getCommonBoundingBox } from "../element/bounds"; -import { AbortError } from "../errors"; -import { t } from "../i18n"; import { useEffect, useRef } from "react"; + import { URL_HASH_KEYS, URL_QUERY_KEYS, @@ -22,7 +8,14 @@ import { DEFAULT_SIDEBAR, LIBRARY_SIDEBAR_TAB, } from "../constants"; +import { atom, editorJotaiStore } from "../editor-jotai"; +import { hashElementsVersion, hashString } from "../element"; +import { getCommonBoundingBox } from "../element/bounds"; +import { Emitter } from "../emitter"; +import { AbortError } from "../errors"; import { libraryItemSvgsCache } from "../hooks/useLibraryItemSvg"; +import { t } from "../i18n"; +import { Queue } from "../queue"; import { arrayToMap, cloneJSON, @@ -30,12 +23,22 @@ import { promiseTry, resolvablePromise, } from "../utils"; -import type { MaybePromise } from "../utility-types"; -import { Emitter } from "../emitter"; -import { Queue } from "../queue"; -import { hashElementsVersion, hashString } from "../element"; + +import { loadLibraryFromBlob } from "./blob"; +import { restoreLibraryItems } from "./restore"; import { toValidURL } from "./url"; +import type App from "../components/App"; +import type { ExcalidrawElement } from "../element/types"; +import type { + LibraryItems, + LibraryItem, + ExcalidrawImperativeAPI, + LibraryItemsSource, + LibraryItems_anyVersion, +} from "../types"; +import type { MaybePromise } from "../utility-types"; + /** * format: hostname or hostname/pathname * diff --git a/packages/excalidraw/data/reconcile.ts b/packages/excalidraw/data/reconcile.ts index fa4cff8d..ef644c3a 100644 --- a/packages/excalidraw/data/reconcile.ts +++ b/packages/excalidraw/data/reconcile.ts @@ -1,14 +1,16 @@ import throttle from "lodash.throttle"; + import { ENV } from "../constants"; -import type { OrderedExcalidrawElement } from "../element/types"; import { orderByFractionalIndex, syncInvalidIndices, validateFractionalIndices, } from "../fractionalIndex"; +import { arrayToMap } from "../utils"; + +import type { OrderedExcalidrawElement } from "../element/types"; import type { AppState } from "../types"; import type { MakeBrand } from "../utility-types"; -import { arrayToMap } from "../utils"; export type ReconciledExcalidrawElement = OrderedExcalidrawElement & MakeBrand<"ReconciledElement">; diff --git a/packages/excalidraw/data/resave.ts b/packages/excalidraw/data/resave.ts index 62491842..2c448429 100644 --- a/packages/excalidraw/data/resave.ts +++ b/packages/excalidraw/data/resave.ts @@ -1,7 +1,9 @@ +import { getFileHandleType, isImageFileHandleType } from "./blob"; + +import { exportCanvas, prepareElementsForExport } from "."; + import type { ExcalidrawElement } from "../element/types"; import type { AppState, BinaryFiles } from "../types"; -import { exportCanvas, prepareElementsForExport } from "."; -import { getFileHandleType, isImageFileHandleType } from "./blob"; export const resaveAsImageWithScene = async ( elements: readonly ExcalidrawElement[], diff --git a/packages/excalidraw/data/restore.ts b/packages/excalidraw/data/restore.ts index c4e45b02..df1a6462 100644 --- a/packages/excalidraw/data/restore.ts +++ b/packages/excalidraw/data/restore.ts @@ -1,35 +1,8 @@ -import type { - ExcalidrawArrowElement, - ExcalidrawElbowArrowElement, - ExcalidrawElement, - ExcalidrawElementType, - ExcalidrawLinearElement, - ExcalidrawSelectionElement, - ExcalidrawTextElement, - FixedPointBinding, - FontFamilyValues, - NonDeletedSceneElementsMap, - OrderedExcalidrawElement, - PointBinding, - StrokeRoundness, -} from "../element/types"; -import type { AppState, BinaryFiles, LibraryItem } from "../types"; -import type { ImportedDataState, LegacyAppState } from "./types"; -import { - getNonDeletedElements, - getNormalizedDimensions, - isInvisiblySmallElement, - refreshTextDimensions, -} from "../element"; -import { - isArrowElement, - isElbowArrow, - isFixedPointBinding, - isLinearElement, - isTextElement, - isUsingAdaptiveRadius, -} from "../element/typeChecks"; -import { randomId } from "../random"; +import { isFiniteNumber, pointFrom } from "@excalidraw/math"; + +import type { LocalPoint, Radians } from "@excalidraw/math"; + +import { getDefaultAppState } from "../appState"; import { DEFAULT_FONT_FAMILY, DEFAULT_TEXT_ALIGN, @@ -41,30 +14,61 @@ import { DEFAULT_GRID_SIZE, DEFAULT_GRID_STEP, } from "../constants"; -import { getDefaultAppState } from "../appState"; +import { + getNonDeletedElements, + getNormalizedDimensions, + isInvisiblySmallElement, + refreshTextDimensions, +} from "../element"; +import { normalizeFixedPoint } from "../element/binding"; +import { + updateElbowArrowPoints, + validateElbowPoints, +} from "../element/elbowArrow"; import { LinearElementEditor } from "../element/linearElementEditor"; import { bumpVersion } from "../element/mutateElement"; -import { getUpdatedTimestamp, updateActiveTool } from "../utils"; -import { arrayToMap } from "../utils"; -import type { MarkOptional, Mutable } from "../utility-types"; import { getContainerElement } from "../element/textElement"; -import { normalizeLink } from "./url"; -import { syncInvalidIndices } from "../fractionalIndex"; -import { getSizeFromPoints } from "../points"; +import { detectLineHeight } from "../element/textMeasurements"; +import { + isArrowElement, + isElbowArrow, + isFixedPointBinding, + isLinearElement, + isTextElement, + isUsingAdaptiveRadius, +} from "../element/typeChecks"; import { getLineHeight } from "../fonts"; -import { normalizeFixedPoint } from "../element/binding"; +import { syncInvalidIndices } from "../fractionalIndex"; +import { randomId } from "../random"; import { getNormalizedGridSize, getNormalizedGridStep, getNormalizedZoom, } from "../scene"; -import type { LocalPoint, Radians } from "@excalidraw/math"; -import { isFiniteNumber, pointFrom } from "@excalidraw/math"; -import { detectLineHeight } from "../element/textMeasurements"; -import { - updateElbowArrowPoints, - validateElbowPoints, -} from "../element/elbowArrow"; +import { getUpdatedTimestamp, updateActiveTool } from "../utils"; +import { arrayToMap } from "../utils"; +import { getSizeFromPoints } from "../points"; + +import { normalizeLink } from "./url"; + +import type { + ExcalidrawArrowElement, + ExcalidrawElbowArrowElement, + ExcalidrawElement, + ExcalidrawElementType, + ExcalidrawLinearElement, + ExcalidrawSelectionElement, + ExcalidrawTextElement, + FixedPointBinding, + FontFamilyValues, + NonDeletedSceneElementsMap, + OrderedExcalidrawElement, + PointBinding, + StrokeRoundness, +} from "../element/types"; +import type { AppState, BinaryFiles, LibraryItem } from "../types"; +import type { MarkOptional, Mutable } from "../utility-types"; +import type { ImportedDataState, LegacyAppState } from "./types"; type RestoredAppState = Omit< AppState, diff --git a/packages/excalidraw/data/transform.test.ts b/packages/excalidraw/data/transform.test.ts index a36af0c3..94f7b6c8 100644 --- a/packages/excalidraw/data/transform.test.ts +++ b/packages/excalidraw/data/transform.test.ts @@ -1,8 +1,10 @@ +import { pointFrom } from "@excalidraw/math"; import { vi } from "vitest"; -import type { ExcalidrawElementSkeleton } from "./transform"; + import { convertToExcalidrawElements } from "./transform"; + +import type { ExcalidrawElementSkeleton } from "./transform"; import type { ExcalidrawArrowElement } from "../element/types"; -import { pointFrom } from "@excalidraw/math"; const opts = { regenerateIds: false }; diff --git a/packages/excalidraw/data/transform.ts b/packages/excalidraw/data/transform.ts index 023740cf..704b63cb 100644 --- a/packages/excalidraw/data/transform.ts +++ b/packages/excalidraw/data/transform.ts @@ -1,3 +1,5 @@ +import { pointFrom, type LocalPoint } from "@excalidraw/math"; + import { DEFAULT_FONT_FAMILY, DEFAULT_FONT_SIZE, @@ -11,7 +13,6 @@ import { redrawTextBoundingBox, } from "../element"; import { bindLinearElement } from "../element/binding"; -import type { ElementConstructorOpts } from "../element/newElement"; import { newArrowElement, newFrameElement, @@ -19,6 +20,22 @@ import { newMagicFrameElement, newTextElement, } from "../element/newElement"; +import { measureText, normalizeText } from "../element/textMeasurements"; +import { isArrowElement } from "../element/typeChecks"; +import { getLineHeight } from "../fonts"; +import { syncInvalidIndices } from "../fractionalIndex"; +import { getSizeFromPoints } from "../points"; +import { randomId } from "../random"; +import { + arrayToMap, + assertNever, + cloneJSON, + getFontString, + isDevEnv, + toBrandedType, +} from "../utils"; + +import type { ElementConstructorOpts } from "../element/newElement"; import type { ElementsMap, ExcalidrawArrowElement, @@ -40,21 +57,6 @@ import type { VerticalAlign, } from "../element/types"; import type { MarkOptional } from "../utility-types"; -import { - arrayToMap, - assertNever, - cloneJSON, - getFontString, - isDevEnv, - toBrandedType, -} from "../utils"; -import { getSizeFromPoints } from "../points"; -import { randomId } from "../random"; -import { syncInvalidIndices } from "../fractionalIndex"; -import { getLineHeight } from "../fonts"; -import { isArrowElement } from "../element/typeChecks"; -import { pointFrom, type LocalPoint } from "@excalidraw/math"; -import { measureText, normalizeText } from "../element/textMeasurements"; export type ValidLinearElement = { type: "arrow" | "line"; diff --git a/packages/excalidraw/data/types.ts b/packages/excalidraw/data/types.ts index f5f5535a..de343613 100644 --- a/packages/excalidraw/data/types.ts +++ b/packages/excalidraw/data/types.ts @@ -1,3 +1,5 @@ +import type { cleanAppStateForExport } from "../appState"; +import type { VERSIONS } from "../constants"; import type { ExcalidrawElement } from "../element/types"; import type { AppState, @@ -5,8 +7,6 @@ import type { LibraryItems, LibraryItems_anyVersion, } from "../types"; -import type { cleanAppStateForExport } from "../appState"; -import type { VERSIONS } from "../constants"; export interface ExportedDataState { type: string; diff --git a/packages/excalidraw/data/url.ts b/packages/excalidraw/data/url.ts index 2ab553bb..a758d233 100644 --- a/packages/excalidraw/data/url.ts +++ b/packages/excalidraw/data/url.ts @@ -1,4 +1,5 @@ import { sanitizeUrl } from "@braintree/sanitize-url"; + import { escapeDoubleQuotes } from "../utils"; export const normalizeLink = (link: string) => { diff --git a/packages/excalidraw/distribute.ts b/packages/excalidraw/distribute.ts index 368b2f24..767d3802 100644 --- a/packages/excalidraw/distribute.ts +++ b/packages/excalidraw/distribute.ts @@ -1,6 +1,7 @@ +import { getCommonBoundingBox } from "./element/bounds"; import { newElementWith } from "./element/mutateElement"; import { getMaximumGroups } from "./groups"; -import { getCommonBoundingBox } from "./element/bounds"; + import type { ElementsMap, ExcalidrawElement } from "./element/types"; export interface Distribution { diff --git a/packages/excalidraw/element/ElementCanvasButtons.tsx b/packages/excalidraw/element/ElementCanvasButtons.tsx index 1bcad97b..e67e8d5b 100644 --- a/packages/excalidraw/element/ElementCanvasButtons.tsx +++ b/packages/excalidraw/element/ElementCanvasButtons.tsx @@ -1,11 +1,14 @@ -import type { AppState } from "../types"; -import { sceneCoordsToViewportCoords } from "../utils"; -import type { ElementsMap, NonDeletedExcalidrawElement } from "./types"; -import { getElementAbsoluteCoords } from "."; import { useExcalidrawAppState } from "../components/App"; +import { sceneCoordsToViewportCoords } from "../utils"; import "./ElementCanvasButtons.scss"; +import { getElementAbsoluteCoords } from "."; + +import type { AppState } from "../types"; + +import type { ElementsMap, NonDeletedExcalidrawElement } from "./types"; + const CONTAINER_PADDING = 5; const getContainerCoords = ( diff --git a/packages/excalidraw/element/binding.ts b/packages/excalidraw/element/binding.ts index e716b860..fa472d21 100644 --- a/packages/excalidraw/element/binding.ts +++ b/packages/excalidraw/element/binding.ts @@ -1,63 +1,3 @@ -import type { - ExcalidrawBindableElement, - ExcalidrawElement, - NonDeleted, - ExcalidrawLinearElement, - PointBinding, - NonDeletedExcalidrawElement, - ElementsMap, - NonDeletedSceneElementsMap, - ExcalidrawTextElement, - ExcalidrawArrowElement, - OrderedExcalidrawElement, - ExcalidrawElbowArrowElement, - FixedPoint, - SceneElementsMap, - FixedPointBinding, -} from "./types"; - -import type { Bounds } from "./bounds"; -import { - getCenterForBounds, - getElementBounds, - doBoundsIntersect, -} from "./bounds"; -import type { AppState } from "../types"; -import { isPointOnShape } from "@excalidraw/utils/collision"; -import { - isArrowElement, - isBindableElement, - isBindingElement, - isBoundToContainer, - isElbowArrow, - isFixedPointBinding, - isFrameLikeElement, - isLinearElement, - isRectanguloidElement, - isTextElement, -} from "./typeChecks"; -import type { ElementUpdate } from "./mutateElement"; -import { mutateElement } from "./mutateElement"; -import type Scene from "../scene/Scene"; -import { LinearElementEditor } from "./linearElementEditor"; -import { - arrayToMap, - isBindingFallthroughEnabled, - tupleToCoors, -} from "../utils"; -import { KEYS } from "../keys"; -import { getBoundTextElement, handleBindTextResize } from "./textElement"; -import { aabbForElement, getElementShape, pointInsideBounds } from "../shapes"; -import { - compareHeading, - HEADING_DOWN, - HEADING_RIGHT, - HEADING_UP, - headingForPointFromElement, - vectorToHeading, - type Heading, -} from "./heading"; -import type { LocalPoint, Radians } from "@excalidraw/math"; import { lineSegment, pointFrom, @@ -76,8 +16,71 @@ import { round, PRECISION, } from "@excalidraw/math"; +import { isPointOnShape } from "@excalidraw/utils/collision"; + +import type { LocalPoint, Radians } from "@excalidraw/math"; + +import { KEYS } from "../keys"; +import { aabbForElement, getElementShape, pointInsideBounds } from "../shapes"; +import { + arrayToMap, + isBindingFallthroughEnabled, + tupleToCoors, +} from "../utils"; + +import { + getCenterForBounds, + getElementBounds, + doBoundsIntersect, +} from "./bounds"; import { intersectElementWithLineSegment } from "./collision"; import { distanceToBindableElement } from "./distance"; +import { + compareHeading, + HEADING_DOWN, + HEADING_RIGHT, + HEADING_UP, + headingForPointFromElement, + vectorToHeading, + type Heading, +} from "./heading"; +import { LinearElementEditor } from "./linearElementEditor"; +import { mutateElement } from "./mutateElement"; +import { getBoundTextElement, handleBindTextResize } from "./textElement"; +import { + isArrowElement, + isBindableElement, + isBindingElement, + isBoundToContainer, + isElbowArrow, + isFixedPointBinding, + isFrameLikeElement, + isLinearElement, + isRectanguloidElement, + isTextElement, +} from "./typeChecks"; + +import type { Bounds } from "./bounds"; +import type { ElementUpdate } from "./mutateElement"; +import type { + ExcalidrawBindableElement, + ExcalidrawElement, + NonDeleted, + ExcalidrawLinearElement, + PointBinding, + NonDeletedExcalidrawElement, + ElementsMap, + NonDeletedSceneElementsMap, + ExcalidrawTextElement, + ExcalidrawArrowElement, + OrderedExcalidrawElement, + ExcalidrawElbowArrowElement, + FixedPoint, + SceneElementsMap, + FixedPointBinding, +} from "./types"; +import type Scene from "../scene/Scene"; +import type { AppState } from "../types"; export type SuggestedBinding = | NonDeleted diff --git a/packages/excalidraw/element/bounds.test.ts b/packages/excalidraw/element/bounds.test.ts index 9d91d092..936ebf79 100644 --- a/packages/excalidraw/element/bounds.test.ts +++ b/packages/excalidraw/element/bounds.test.ts @@ -1,8 +1,12 @@ -import type { LocalPoint } from "@excalidraw/math"; import { pointFrom } from "@excalidraw/math"; + +import type { LocalPoint } from "@excalidraw/math"; + import { ROUNDNESS } from "../constants"; import { arrayToMap } from "../utils"; + import { getElementAbsoluteCoords, getElementBounds } from "./bounds"; + import type { ExcalidrawElement, ExcalidrawLinearElement } from "./types"; const _ce = ({ diff --git a/packages/excalidraw/element/bounds.ts b/packages/excalidraw/element/bounds.ts index 06f97702..9d8fd22d 100644 --- a/packages/excalidraw/element/bounds.ts +++ b/packages/excalidraw/element/bounds.ts @@ -1,29 +1,14 @@ -import type { - ExcalidrawElement, - ExcalidrawLinearElement, - Arrowhead, - ExcalidrawFreeDrawElement, - NonDeleted, - ExcalidrawTextElementWithContainer, - ElementsMap, -} from "./types"; -import rough from "roughjs/bin/rough"; -import type { Point as RoughPoint } from "roughjs/bin/geometry"; -import type { Drawable, Op } from "roughjs/bin/core"; -import type { AppState } from "../types"; -import { generateRoughOptions } from "../scene/Shape"; import { - isArrowElement, - isBoundToContainer, - isFreeDrawElement, - isLinearElement, - isTextElement, -} from "./typeChecks"; -import { rescalePoints } from "../points"; -import { getBoundTextElement, getContainerElement } from "./textElement"; -import { LinearElementEditor } from "./linearElementEditor"; -import { ShapeCache } from "../scene/ShapeCache"; -import { arrayToMap, invariant } from "../utils"; + degreesToRadians, + lineSegment, + pointFrom, + pointDistance, + pointFromArray, + pointRotateRads, +} from "@excalidraw/math"; +import { getCurvePathOps } from "@excalidraw/utils/geometry/shape"; +import rough from "roughjs/bin/rough"; + import type { Degrees, GlobalPoint, @@ -31,16 +16,35 @@ import type { LocalPoint, Radians, } from "@excalidraw/math"; + +import { rescalePoints } from "../points"; +import { generateRoughOptions } from "../scene/Shape"; +import { ShapeCache } from "../scene/ShapeCache"; +import { arrayToMap, invariant } from "../utils"; + +import { LinearElementEditor } from "./linearElementEditor"; +import { getBoundTextElement, getContainerElement } from "./textElement"; import { - degreesToRadians, - lineSegment, - pointFrom, - pointDistance, - pointFromArray, - pointRotateRads, -} from "@excalidraw/math"; + isArrowElement, + isBoundToContainer, + isFreeDrawElement, + isLinearElement, + isTextElement, +} from "./typeChecks"; + +import type { AppState } from "../types"; import type { Mutable } from "../utility-types"; -import { getCurvePathOps } from "@excalidraw/utils/geometry/shape"; +import type { + ExcalidrawElement, + ExcalidrawLinearElement, + Arrowhead, + ExcalidrawFreeDrawElement, + NonDeleted, + ExcalidrawTextElementWithContainer, + ElementsMap, +} from "./types"; +import type { Drawable, Op } from "roughjs/bin/core"; +import type { Point as RoughPoint } from "roughjs/bin/geometry"; export type RectangleBox = { x: number; diff --git a/packages/excalidraw/element/collision.ts b/packages/excalidraw/element/collision.ts index b0a2ce9a..a86cbd62 100644 --- a/packages/excalidraw/element/collision.ts +++ b/packages/excalidraw/element/collision.ts @@ -1,31 +1,3 @@ -import type { - ElementsMap, - ExcalidrawDiamondElement, - ExcalidrawElement, - ExcalidrawEllipseElement, - ExcalidrawRectangleElement, - ExcalidrawRectanguloidElement, -} from "./types"; -import { getElementBounds } from "./bounds"; -import type { FrameNameBounds } from "../types"; -import type { GeometricShape } from "@excalidraw/utils/geometry/shape"; -import { getPolygonShape } from "@excalidraw/utils/geometry/shape"; -import { isPointInShape, isPointOnShape } from "@excalidraw/utils/collision"; -import { isTransparent } from "../utils"; -import { - hasBoundTextElement, - isIframeLikeElement, - isImageElement, - isTextElement, -} from "./typeChecks"; -import { getBoundTextShape, isPathALoop } from "../shapes"; -import type { - GlobalPoint, - LineSegment, - LocalPoint, - Polygon, - Radians, -} from "@excalidraw/math"; import { curveIntersectLineSegment, isPointWithinBounds, @@ -40,11 +12,43 @@ import { ellipse, ellipseLineIntersectionPoints, } from "@excalidraw/math/ellipse"; +import { isPointInShape, isPointOnShape } from "@excalidraw/utils/collision"; +import { getPolygonShape } from "@excalidraw/utils/geometry/shape"; + +import type { + GlobalPoint, + LineSegment, + LocalPoint, + Polygon, + Radians, +} from "@excalidraw/math"; +import type { GeometricShape } from "@excalidraw/utils/geometry/shape"; + +import { getBoundTextShape, isPathALoop } from "../shapes"; +import { isTransparent } from "../utils"; + +import { getElementBounds } from "./bounds"; +import { + hasBoundTextElement, + isIframeLikeElement, + isImageElement, + isTextElement, +} from "./typeChecks"; import { deconstructDiamondElement, deconstructRectanguloidElement, } from "./utils"; +import type { + ElementsMap, + ExcalidrawDiamondElement, + ExcalidrawElement, + ExcalidrawEllipseElement, + ExcalidrawRectangleElement, + ExcalidrawRectanguloidElement, +} from "./types"; +import type { FrameNameBounds } from "../types"; + export const shouldTestInside = (element: ExcalidrawElement) => { if (element.type === "arrow") { return false; diff --git a/packages/excalidraw/element/cropElement.ts b/packages/excalidraw/element/cropElement.ts index b1098020..dd75f936 100644 --- a/packages/excalidraw/element/cropElement.ts +++ b/packages/excalidraw/element/cropElement.ts @@ -1,4 +1,3 @@ -import { type Point } from "points-on-curve"; import { type Radians, pointFrom, @@ -13,6 +12,13 @@ import { clamp, isCloseTo, } from "@excalidraw/math"; +import { type Point } from "points-on-curve"; + +import { + getElementAbsoluteCoords, + getResizedElementAbsoluteCoords, +} from "./bounds"; + import type { TransformHandleType } from "./transformHandles"; import type { ElementsMap, @@ -21,10 +27,6 @@ import type { ImageCrop, NonDeleted, } from "./types"; -import { - getElementAbsoluteCoords, - getResizedElementAbsoluteCoords, -} from "./bounds"; export const MINIMAL_CROP_SIZE = 10; diff --git a/packages/excalidraw/element/distance.ts b/packages/excalidraw/element/distance.ts index 0010ab95..03823355 100644 --- a/packages/excalidraw/element/distance.ts +++ b/packages/excalidraw/element/distance.ts @@ -1,4 +1,3 @@ -import type { GlobalPoint, Radians } from "@excalidraw/math"; import { curvePointDistance, distanceToLineSegment, @@ -6,16 +5,20 @@ import { pointRotateRads, } from "@excalidraw/math"; import { ellipse, ellipseDistanceFromPoint } from "@excalidraw/math/ellipse"; + +import type { GlobalPoint, Radians } from "@excalidraw/math"; + +import { + deconstructDiamondElement, + deconstructRectanguloidElement, +} from "./utils"; + import type { ExcalidrawBindableElement, ExcalidrawDiamondElement, ExcalidrawEllipseElement, ExcalidrawRectanguloidElement, } from "./types"; -import { - deconstructDiamondElement, - deconstructRectanguloidElement, -} from "./utils"; export const distanceToBindableElement = ( element: ExcalidrawBindableElement, diff --git a/packages/excalidraw/element/dragElements.ts b/packages/excalidraw/element/dragElements.ts index bb8fd237..4cc408b2 100644 --- a/packages/excalidraw/element/dragElements.ts +++ b/packages/excalidraw/element/dragElements.ts @@ -1,17 +1,13 @@ +import { TEXT_AUTOWRAP_THRESHOLD } from "../constants"; +import { getGridPoint } from "../snapping"; +import { getFontString } from "../utils"; + import { updateBoundElements } from "./binding"; -import type { Bounds } from "./bounds"; import { getCommonBounds } from "./bounds"; import { mutateElement } from "./mutateElement"; import { getPerfectElementSize } from "./sizeHelpers"; -import type { NonDeletedExcalidrawElement } from "./types"; -import type { - AppState, - NormalizedZoomValue, - NullableGridSize, - PointerDownState, -} from "../types"; import { getBoundTextElement } from "./textElement"; -import type Scene from "../scene/Scene"; +import { getMinTextElementWidth } from "./textMeasurements"; import { isArrowElement, isElbowArrow, @@ -19,10 +15,16 @@ import { isImageElement, isTextElement, } from "./typeChecks"; -import { getFontString } from "../utils"; -import { TEXT_AUTOWRAP_THRESHOLD } from "../constants"; -import { getGridPoint } from "../snapping"; -import { getMinTextElementWidth } from "./textMeasurements"; + +import type { Bounds } from "./bounds"; +import type { NonDeletedExcalidrawElement } from "./types"; +import type Scene from "../scene/Scene"; +import type { + AppState, + NormalizedZoomValue, + NullableGridSize, + PointerDownState, +} from "../types"; export const dragSelectedElements = ( pointerDownState: PointerDownState, diff --git a/packages/excalidraw/element/elbowArrow.test.tsx b/packages/excalidraw/element/elbowArrow.test.tsx index c00eae98..91e280d3 100644 --- a/packages/excalidraw/element/elbowArrow.test.tsx +++ b/packages/excalidraw/element/elbowArrow.test.tsx @@ -1,4 +1,13 @@ +import { pointFrom } from "@excalidraw/math"; import React from "react"; + +import type { LocalPoint } from "@excalidraw/math"; + +import "../../utils/test-utils"; +import { actionSelectAll } from "../actions"; +import { actionDuplicateSelection } from "../actions/actionDuplicateSelection"; +import { ARROW_TYPE } from "../constants"; +import { Excalidraw, mutateElement } from "../index"; import Scene from "../scene/Scene"; import { API } from "../tests/helpers/api"; import { Pointer, UI } from "../tests/helpers/ui"; @@ -9,19 +18,14 @@ import { queryByTestId, render, } from "../tests/test-utils"; + import { bindLinearElement } from "./binding"; -import { Excalidraw, mutateElement } from "../index"; + import type { ExcalidrawArrowElement, ExcalidrawBindableElement, ExcalidrawElbowArrowElement, } from "./types"; -import { ARROW_TYPE } from "../constants"; -import "../../utils/test-utils"; -import type { LocalPoint } from "@excalidraw/math"; -import { pointFrom } from "@excalidraw/math"; -import { actionDuplicateSelection } from "../actions/actionDuplicateSelection"; -import { actionSelectAll } from "../actions"; const { h } = window; diff --git a/packages/excalidraw/element/elbowArrow.ts b/packages/excalidraw/element/elbowArrow.ts index ce8c3d5a..5b8dc381 100644 --- a/packages/excalidraw/element/elbowArrow.ts +++ b/packages/excalidraw/element/elbowArrow.ts @@ -12,11 +12,12 @@ import { type GlobalPoint, type LocalPoint, } from "@excalidraw/math"; + import BinaryHeap from "../binaryheap"; import { getSizeFromPoints } from "../points"; import { aabbForElement, pointInsideBounds } from "../shapes"; import { invariant, isAnyTrue, tupleToCoors } from "../utils"; -import type { AppState } from "../types"; + import { bindPointToSnapToElementOutline, FIXED_BINDING_DISTANCE, @@ -25,8 +26,7 @@ import { snapToMid, getHoveredElementForBinding, } from "./binding"; -import type { Bounds } from "./bounds"; -import type { Heading } from "./heading"; +import { distanceToBindableElement } from "./distance"; import { compareHeading, flipHeading, @@ -46,6 +46,9 @@ import { type NonDeletedSceneElementsMap, type SceneElementsMap, } from "./types"; + +import type { Bounds } from "./bounds"; +import type { Heading } from "./heading"; import type { Arrowhead, ElementsMap, @@ -54,7 +57,7 @@ import type { FixedSegment, NonDeletedExcalidrawElement, } from "./types"; -import { distanceToBindableElement } from "./distance"; +import type { AppState } from "../types"; type GridAddress = [number, number] & { _brand: "gridaddress" }; diff --git a/packages/excalidraw/element/elementLink.ts b/packages/excalidraw/element/elementLink.ts index 991f9cae..79b689c9 100644 --- a/packages/excalidraw/element/elementLink.ts +++ b/packages/excalidraw/element/elementLink.ts @@ -5,6 +5,7 @@ import { ELEMENT_LINK_KEY } from "../constants"; import { normalizeLink } from "../data/url"; import { elementsAreInSameGroup } from "../groups"; + import type { AppProps, AppState } from "../types"; import type { ExcalidrawElement } from "./types"; diff --git a/packages/excalidraw/element/embeddable.ts b/packages/excalidraw/element/embeddable.ts index 8265a0b1..1dc1968a 100644 --- a/packages/excalidraw/element/embeddable.ts +++ b/packages/excalidraw/element/embeddable.ts @@ -1,18 +1,20 @@ import { register } from "../actions/register"; import { FONT_FAMILY, VERTICAL_ALIGN } from "../constants"; -import type { ExcalidrawProps } from "../types"; -import { escapeDoubleQuotes, getFontString, updateActiveTool } from "../utils"; import { setCursorForShape } from "../cursor"; +import { CaptureUpdateAction } from "../store"; +import { escapeDoubleQuotes, getFontString, updateActiveTool } from "../utils"; + import { newTextElement } from "./newElement"; import { wrapText } from "./textWrapping"; import { isIframeElement } from "./typeChecks"; + +import type { ExcalidrawProps } from "../types"; +import type { MarkRequired } from "../utility-types"; import type { ExcalidrawElement, ExcalidrawIframeLikeElement, IframeData, } from "./types"; -import type { MarkRequired } from "../utility-types"; -import { CaptureUpdateAction } from "../store"; type IframeDataWithSandbox = MarkRequired; diff --git a/packages/excalidraw/element/flowchart.test.tsx b/packages/excalidraw/element/flowchart.test.tsx index d47c850b..bc026e7d 100644 --- a/packages/excalidraw/element/flowchart.test.tsx +++ b/packages/excalidraw/element/flowchart.test.tsx @@ -1,9 +1,9 @@ -import { render, unmountComponent } from "../tests/test-utils"; -import { reseed } from "../random"; -import { UI, Keyboard, Pointer } from "../tests/helpers/ui"; import { Excalidraw } from "../index"; -import { API } from "../tests/helpers/api"; import { KEYS } from "../keys"; +import { reseed } from "../random"; +import { API } from "../tests/helpers/api"; +import { UI, Keyboard, Pointer } from "../tests/helpers/ui"; +import { render, unmountComponent } from "../tests/test-utils"; unmountComponent(); diff --git a/packages/excalidraw/element/flowchart.ts b/packages/excalidraw/element/flowchart.ts index 09f006dd..9880f27a 100644 --- a/packages/excalidraw/element/flowchart.ts +++ b/packages/excalidraw/element/flowchart.ts @@ -1,3 +1,12 @@ +import { pointFrom, type LocalPoint } from "@excalidraw/math"; + +import { elementOverlapsWithFrame, elementsAreInFrameBounds } from "../frame"; +import { KEYS } from "../keys"; +import { aabbForElement } from "../shapes"; +import { invariant, toBrandedType } from "../utils"; + +import { bindLinearElement } from "./binding"; +import { updateElbowArrowPoints } from "./elbowArrow"; import { HEADING_DOWN, HEADING_LEFT, @@ -7,9 +16,15 @@ import { headingForPointFromElement, type Heading, } from "./heading"; -import { bindLinearElement } from "./binding"; import { LinearElementEditor } from "./linearElementEditor"; +import { mutateElement } from "./mutateElement"; import { newArrowElement, newElement } from "./newElement"; +import { + isBindableElement, + isElbowArrow, + isFrameElement, + isFlowchartNodeElement, +} from "./typeChecks"; import { type ElementsMap, type ExcalidrawBindableElement, @@ -19,20 +34,8 @@ import { type Ordered, type OrderedExcalidrawElement, } from "./types"; -import { KEYS } from "../keys"; + import type { AppState, PendingExcalidrawElements } from "../types"; -import { mutateElement } from "./mutateElement"; -import { elementOverlapsWithFrame, elementsAreInFrameBounds } from "../frame"; -import { - isBindableElement, - isElbowArrow, - isFrameElement, - isFlowchartNodeElement, -} from "./typeChecks"; -import { invariant, toBrandedType } from "../utils"; -import { pointFrom, type LocalPoint } from "@excalidraw/math"; -import { aabbForElement } from "../shapes"; -import { updateElbowArrowPoints } from "./elbowArrow"; type LinkDirection = "up" | "right" | "down" | "left"; diff --git a/packages/excalidraw/element/heading.ts b/packages/excalidraw/element/heading.ts index 94e86339..ddebeca5 100644 --- a/packages/excalidraw/element/heading.ts +++ b/packages/excalidraw/element/heading.ts @@ -1,10 +1,3 @@ -import type { - LocalPoint, - GlobalPoint, - Triangle, - Vector, - Radians, -} from "@excalidraw/math"; import { pointFrom, pointRotateRads, @@ -13,7 +6,17 @@ import { triangleIncludesPoint, vectorFromPoint, } from "@excalidraw/math"; + +import type { + LocalPoint, + GlobalPoint, + Triangle, + Vector, + Radians, +} from "@excalidraw/math"; + import { getCenterForBounds, type Bounds } from "./bounds"; + import type { ExcalidrawBindableElement } from "./types"; export const HEADING_RIGHT = [1, 0] as Heading; diff --git a/packages/excalidraw/element/image.ts b/packages/excalidraw/element/image.ts index 32644b64..0d5f9fb5 100644 --- a/packages/excalidraw/element/image.ts +++ b/packages/excalidraw/element/image.ts @@ -3,8 +3,10 @@ // ----------------------------------------------------------------------------- import { MIME_TYPES, SVG_NS } from "../constants"; -import type { AppClassProperties, DataURL, BinaryFiles } from "../types"; + import { isInitializedImageElement } from "./typeChecks"; + +import type { AppClassProperties, DataURL, BinaryFiles } from "../types"; import type { ExcalidrawElement, FileId, diff --git a/packages/excalidraw/element/index.ts b/packages/excalidraw/element/index.ts index a9b74768..abe84e03 100644 --- a/packages/excalidraw/element/index.ts +++ b/packages/excalidraw/element/index.ts @@ -1,10 +1,11 @@ +import { isInvisiblySmallElement } from "./sizeHelpers"; +import { isLinearElementType } from "./typeChecks"; + import type { ExcalidrawElement, NonDeletedExcalidrawElement, NonDeleted, } from "./types"; -import { isInvisiblySmallElement } from "./sizeHelpers"; -import { isLinearElementType } from "./typeChecks"; export { newElement, diff --git a/packages/excalidraw/element/linearElementEditor.ts b/packages/excalidraw/element/linearElementEditor.ts index b616268a..f9b23f04 100644 --- a/packages/excalidraw/element/linearElementEditor.ts +++ b/packages/excalidraw/element/linearElementEditor.ts @@ -1,3 +1,48 @@ +import { + pointCenter, + pointFrom, + pointRotateRads, + pointsEqual, + type GlobalPoint, + type LocalPoint, + pointDistance, + vectorFromPoint, +} from "@excalidraw/math"; +import { getCurvePathOps } from "@excalidraw/utils/geometry/shape"; + +import type { Radians } from "@excalidraw/math"; + +import { DRAGGING_THRESHOLD } from "../constants"; +import { KEYS, shouldRotateWithDiscreteAngle } from "../keys"; +import { ShapeCache } from "../scene/ShapeCache"; +import { + getBezierCurveLength, + getBezierXY, + getControlPointsForBezierCurve, + isPathALoop, + mapIntervalToBezierT, +} from "../shapes"; +import { getGridPoint } from "../snapping"; +import { invariant, tupleToCoors } from "../utils"; + +import { + bindOrUnbindLinearElement, + getHoveredElementForBinding, + isBindingEnabled, +} from "./binding"; +import { getElementPointsCoords, getMinMaxXYFromCurvePathOps } from "./bounds"; +import { headingIsHorizontal, vectorToHeading } from "./heading"; +import { mutateElement } from "./mutateElement"; +import { getBoundTextElement, handleBindTextResize } from "./textElement"; +import { + isBindingElement, + isElbowArrow, + isFixedPointBinding, +} from "./typeChecks"; + +import { getElementAbsoluteCoords, getLockedLinearCursorAlignSize } from "."; + +import type { Bounds } from "./bounds"; import type { NonDeleted, ExcalidrawLinearElement, @@ -12,9 +57,8 @@ import type { FixedSegment, ExcalidrawElbowArrowElement, } from "./types"; -import { getElementAbsoluteCoords, getLockedLinearCursorAlignSize } from "."; -import type { Bounds } from "./bounds"; -import { getElementPointsCoords, getMinMaxXYFromCurvePathOps } from "./bounds"; +import type Scene from "../scene/Scene"; +import type { Store } from "../store"; import type { AppState, PointerCoords, @@ -23,47 +67,7 @@ import type { NullableGridSize, Zoom, } from "../types"; -import { mutateElement } from "./mutateElement"; - -import { - bindOrUnbindLinearElement, - getHoveredElementForBinding, - isBindingEnabled, -} from "./binding"; -import { invariant, tupleToCoors } from "../utils"; -import { - isBindingElement, - isElbowArrow, - isFixedPointBinding, -} from "./typeChecks"; -import { KEYS, shouldRotateWithDiscreteAngle } from "../keys"; -import { getBoundTextElement, handleBindTextResize } from "./textElement"; -import { DRAGGING_THRESHOLD } from "../constants"; import type { Mutable } from "../utility-types"; -import { ShapeCache } from "../scene/ShapeCache"; -import type { Store } from "../store"; -import type Scene from "../scene/Scene"; -import type { Radians } from "@excalidraw/math"; -import { - pointCenter, - pointFrom, - pointRotateRads, - pointsEqual, - type GlobalPoint, - type LocalPoint, - pointDistance, - vectorFromPoint, -} from "@excalidraw/math"; -import { - getBezierCurveLength, - getBezierXY, - getControlPointsForBezierCurve, - isPathALoop, - mapIntervalToBezierT, -} from "../shapes"; -import { getGridPoint } from "../snapping"; -import { headingIsHorizontal, vectorToHeading } from "./heading"; -import { getCurvePathOps } from "@excalidraw/utils/geometry/shape"; const editorMidPointsCache: { version: number | null; diff --git a/packages/excalidraw/element/mutateElement.ts b/packages/excalidraw/element/mutateElement.ts index cfff5c82..fc96ec31 100644 --- a/packages/excalidraw/element/mutateElement.ts +++ b/packages/excalidraw/element/mutateElement.ts @@ -1,13 +1,16 @@ -import type { ExcalidrawElement, NonDeletedSceneElementsMap } from "./types"; -import Scene from "../scene/Scene"; +import type { Radians } from "@excalidraw/math"; + import { getSizeFromPoints } from "../points"; import { randomInteger } from "../random"; -import { getUpdatedTimestamp, toBrandedType } from "../utils"; -import type { Mutable } from "../utility-types"; +import Scene from "../scene/Scene"; import { ShapeCache } from "../scene/ShapeCache"; -import { isElbowArrow } from "./typeChecks"; +import { getUpdatedTimestamp, toBrandedType } from "../utils"; + import { updateElbowArrowPoints } from "./elbowArrow"; -import type { Radians } from "@excalidraw/math"; +import { isElbowArrow } from "./typeChecks"; + +import type { ExcalidrawElement, NonDeletedSceneElementsMap } from "./types"; +import type { Mutable } from "../utility-types"; export type ElementUpdate = Omit< Partial, diff --git a/packages/excalidraw/element/newElement.test.ts b/packages/excalidraw/element/newElement.test.ts index 9c9006b6..418ede1b 100644 --- a/packages/excalidraw/element/newElement.test.ts +++ b/packages/excalidraw/element/newElement.test.ts @@ -1,11 +1,15 @@ -import { duplicateElement, duplicateElements } from "./newElement"; -import { mutateElement } from "./mutateElement"; -import { API } from "../tests/helpers/api"; +import { pointFrom } from "@excalidraw/math"; + +import type { LocalPoint } from "@excalidraw/math"; + import { FONT_FAMILY, ROUNDNESS } from "../constants"; +import { API } from "../tests/helpers/api"; import { isPrimitive } from "../utils"; + +import { mutateElement } from "./mutateElement"; +import { duplicateElement, duplicateElements } from "./newElement"; + import type { ExcalidrawLinearElement } from "./types"; -import type { LocalPoint } from "@excalidraw/math"; -import { pointFrom } from "@excalidraw/math"; const assertCloneObjects = (source: any, clone: any) => { for (const key in clone) { diff --git a/packages/excalidraw/element/newElement.ts b/packages/excalidraw/element/newElement.ts index 7d1f1491..d11c4c20 100644 --- a/packages/excalidraw/element/newElement.ts +++ b/packages/excalidraw/element/newElement.ts @@ -1,3 +1,32 @@ +import type { Radians } from "@excalidraw/math"; + +import { + DEFAULT_ELEMENT_PROPS, + DEFAULT_FONT_FAMILY, + DEFAULT_FONT_SIZE, + DEFAULT_TEXT_ALIGN, + DEFAULT_VERTICAL_ALIGN, + ORIG_ID, + VERTICAL_ALIGN, +} from "../constants"; +import { getLineHeight } from "../fonts"; +import { getNewGroupIdsForDuplication } from "../groups"; +import { randomInteger, randomId } from "../random"; +import { + arrayToMap, + getFontString, + getUpdatedTimestamp, + isTestEnv, +} from "../utils"; + +import { getResizedElementAbsoluteCoords } from "./bounds"; +import { bumpVersion, newElementWith } from "./mutateElement"; +import { getBoundTextMaxWidth } from "./textElement"; +import { normalizeText, measureText } from "./textMeasurements"; +import { wrapText } from "./textWrapping"; + +import { getElementAbsoluteCoords } from "."; + import type { ExcalidrawElement, ExcalidrawImageElement, @@ -21,33 +50,8 @@ import type { FixedSegment, ExcalidrawElbowArrowElement, } from "./types"; -import { - arrayToMap, - getFontString, - getUpdatedTimestamp, - isTestEnv, -} from "../utils"; -import { randomInteger, randomId } from "../random"; -import { bumpVersion, newElementWith } from "./mutateElement"; -import { getNewGroupIdsForDuplication } from "../groups"; import type { AppState } from "../types"; -import { getElementAbsoluteCoords } from "."; -import { getResizedElementAbsoluteCoords } from "./bounds"; -import { getBoundTextMaxWidth } from "./textElement"; -import { wrapText } from "./textWrapping"; -import { - DEFAULT_ELEMENT_PROPS, - DEFAULT_FONT_FAMILY, - DEFAULT_FONT_SIZE, - DEFAULT_TEXT_ALIGN, - DEFAULT_VERTICAL_ALIGN, - ORIG_ID, - VERTICAL_ALIGN, -} from "../constants"; import type { MarkOptional, Merge, Mutable } from "../utility-types"; -import { getLineHeight } from "../fonts"; -import type { Radians } from "@excalidraw/math"; -import { normalizeText, measureText } from "./textMeasurements"; export type ElementConstructorOpts = MarkOptional< Omit, diff --git a/packages/excalidraw/element/resizeElements.ts b/packages/excalidraw/element/resizeElements.ts index b86ba027..cd51b8bd 100644 --- a/packages/excalidraw/element/resizeElements.ts +++ b/packages/excalidraw/element/resizeElements.ts @@ -1,18 +1,21 @@ +import { + pointCenter, + normalizeRadians, + pointFrom, + pointFromPair, + pointRotateRads, + type Radians, + type LocalPoint, +} from "@excalidraw/math"; + +import type { GlobalPoint } from "@excalidraw/math"; + import { MIN_FONT_SIZE, SHIFT_LOCKING_ANGLE } from "../constants"; +import { isInGroup } from "../groups"; import { rescalePoints } from "../points"; -import type { - ExcalidrawLinearElement, - ExcalidrawTextElement, - NonDeletedExcalidrawElement, - NonDeleted, - ExcalidrawElement, - ExcalidrawTextElementWithContainer, - ExcalidrawImageElement, - ElementsMap, - SceneElementsMap, - ExcalidrawElbowArrowElement, -} from "./types"; -import type { Mutable } from "../utility-types"; +import { getFontString } from "../utils"; + +import { getArrowLocalFixedPoints, updateBoundElements } from "./binding"; import { getElementAbsoluteCoords, getCommonBounds, @@ -20,7 +23,22 @@ import { getCommonBoundingBox, getElementBounds, } from "./bounds"; -import type { BoundingBox } from "./bounds"; +import { LinearElementEditor } from "./linearElementEditor"; +import { mutateElement } from "./mutateElement"; +import { + getBoundTextElement, + getBoundTextElementId, + getContainerElement, + handleBindTextResize, + getBoundTextMaxWidth, +} from "./textElement"; +import { + getMinTextElementWidth, + measureText, + getApproxMinLineWidth, + getApproxMinLineHeight, +} from "./textMeasurements"; +import { wrapText } from "./textWrapping"; import { isArrowElement, isBoundToContainer, @@ -31,41 +49,27 @@ import { isLinearElement, isTextElement, } from "./typeChecks"; -import { mutateElement } from "./mutateElement"; -import { getFontString } from "../utils"; -import { getArrowLocalFixedPoints, updateBoundElements } from "./binding"; + +import type { BoundingBox } from "./bounds"; import type { MaybeTransformHandleType, TransformHandleDirection, } from "./transformHandles"; -import type { PointerDownState } from "../types"; +import type { + ExcalidrawLinearElement, + ExcalidrawTextElement, + NonDeletedExcalidrawElement, + NonDeleted, + ExcalidrawElement, + ExcalidrawTextElementWithContainer, + ExcalidrawImageElement, + ElementsMap, + SceneElementsMap, + ExcalidrawElbowArrowElement, +} from "./types"; import type Scene from "../scene/Scene"; -import { - getBoundTextElement, - getBoundTextElementId, - getContainerElement, - handleBindTextResize, - getBoundTextMaxWidth, -} from "./textElement"; -import { wrapText } from "./textWrapping"; -import { LinearElementEditor } from "./linearElementEditor"; -import { isInGroup } from "../groups"; -import type { GlobalPoint } from "@excalidraw/math"; -import { - pointCenter, - normalizeRadians, - pointFrom, - pointFromPair, - pointRotateRads, - type Radians, - type LocalPoint, -} from "@excalidraw/math"; -import { - getMinTextElementWidth, - measureText, - getApproxMinLineWidth, - getApproxMinLineHeight, -} from "./textMeasurements"; +import type { PointerDownState } from "../types"; +import type { Mutable } from "../utility-types"; // Returns true when transform (resizing/rotation) happened export const transformElements = ( diff --git a/packages/excalidraw/element/resizeTest.ts b/packages/excalidraw/element/resizeTest.ts index 375ff980..1eb36d0b 100644 --- a/packages/excalidraw/element/resizeTest.ts +++ b/packages/excalidraw/element/resizeTest.ts @@ -1,33 +1,36 @@ -import type { - ExcalidrawElement, - PointerType, - NonDeletedExcalidrawElement, - ElementsMap, -} from "./types"; +import { + pointFrom, + pointOnLineSegment, + pointRotateRads, + type Radians, +} from "@excalidraw/math"; -import type { - TransformHandleType, - TransformHandle, - MaybeTransformHandleType, -} from "./transformHandles"; +import type { GlobalPoint, LineSegment, LocalPoint } from "@excalidraw/math"; + +import { SIDE_RESIZING_THRESHOLD } from "../constants"; + +import { getElementAbsoluteCoords } from "./bounds"; import { getTransformHandlesFromCoords, getTransformHandles, getOmitSidesForDevice, canResizeFromSides, } from "./transformHandles"; +import { isImageElement, isLinearElement } from "./typeChecks"; + import type { AppState, Device, Zoom } from "../types"; import type { Bounds } from "./bounds"; -import { getElementAbsoluteCoords } from "./bounds"; -import { SIDE_RESIZING_THRESHOLD } from "../constants"; -import { isImageElement, isLinearElement } from "./typeChecks"; -import type { GlobalPoint, LineSegment, LocalPoint } from "@excalidraw/math"; -import { - pointFrom, - pointOnLineSegment, - pointRotateRads, - type Radians, -} from "@excalidraw/math"; +import type { + TransformHandleType, + TransformHandle, + MaybeTransformHandleType, +} from "./transformHandles"; +import type { + ExcalidrawElement, + PointerType, + NonDeletedExcalidrawElement, + ElementsMap, +} from "./types"; const isInsideTransformHandle = ( transformHandle: TransformHandle, diff --git a/packages/excalidraw/element/showSelectedShapeActions.ts b/packages/excalidraw/element/showSelectedShapeActions.ts index bbf313d0..44c2e75c 100644 --- a/packages/excalidraw/element/showSelectedShapeActions.ts +++ b/packages/excalidraw/element/showSelectedShapeActions.ts @@ -1,6 +1,7 @@ -import type { NonDeletedExcalidrawElement } from "./types"; import { getSelectedElements } from "../scene"; + import type { UIAppState } from "../types"; +import type { NonDeletedExcalidrawElement } from "./types"; export const showSelectedShapeActions = ( appState: UIAppState, diff --git a/packages/excalidraw/element/sizeHelpers.test.ts b/packages/excalidraw/element/sizeHelpers.test.ts index 8e63dd9d..c882e1f3 100644 --- a/packages/excalidraw/element/sizeHelpers.test.ts +++ b/packages/excalidraw/element/sizeHelpers.test.ts @@ -1,7 +1,9 @@ import { vi } from "vitest"; -import { getPerfectElementSize } from "./sizeHelpers"; + import * as constants from "../constants"; +import { getPerfectElementSize } from "./sizeHelpers"; + const EPSILON_DIGITS = 3; // Needed so that we can mock the value of constants which is done in // below tests. In Jest this wasn't needed as global override was possible diff --git a/packages/excalidraw/element/sizeHelpers.ts b/packages/excalidraw/element/sizeHelpers.ts index f633789a..33b13e18 100644 --- a/packages/excalidraw/element/sizeHelpers.ts +++ b/packages/excalidraw/element/sizeHelpers.ts @@ -1,10 +1,12 @@ -import type { ElementsMap, ExcalidrawElement } from "./types"; +import { SHIFT_LOCKING_ANGLE } from "../constants"; +import { viewportCoordsToSceneCoords } from "../utils"; + +import { getCommonBounds, getElementBounds } from "./bounds"; import { mutateElement } from "./mutateElement"; import { isFreeDrawElement, isLinearElement } from "./typeChecks"; -import { SHIFT_LOCKING_ANGLE } from "../constants"; + +import type { ElementsMap, ExcalidrawElement } from "./types"; import type { AppState, Offsets, Zoom } from "../types"; -import { getCommonBounds, getElementBounds } from "./bounds"; -import { viewportCoordsToSceneCoords } from "../utils"; // TODO: remove invisible elements consistently actions, so that invisible elements are not recorded by the store, exported, broadcasted or persisted // - perhaps could be as part of a standalone 'cleanup' action, in addition to 'finalize' diff --git a/packages/excalidraw/element/sortElements.test.ts b/packages/excalidraw/element/sortElements.test.ts index a7b78e8e..5f7c4b2e 100644 --- a/packages/excalidraw/element/sortElements.test.ts +++ b/packages/excalidraw/element/sortElements.test.ts @@ -1,6 +1,8 @@ import { API } from "../tests/helpers/api"; + import { mutateElement } from "./mutateElement"; import { normalizeElementOrder } from "./sortElements"; + import type { ExcalidrawElement } from "./types"; const assertOrder = ( diff --git a/packages/excalidraw/element/sortElements.ts b/packages/excalidraw/element/sortElements.ts index 3078a682..d395adf2 100644 --- a/packages/excalidraw/element/sortElements.ts +++ b/packages/excalidraw/element/sortElements.ts @@ -1,4 +1,5 @@ import { arrayToMapWithIndex } from "../utils"; + import type { ExcalidrawElement } from "./types"; const normalizeGroupElementOrder = (elements: readonly ExcalidrawElement[]) => { diff --git a/packages/excalidraw/element/textElement.test.ts b/packages/excalidraw/element/textElement.test.ts index 2c23c2b0..41531a73 100644 --- a/packages/excalidraw/element/textElement.test.ts +++ b/packages/excalidraw/element/textElement.test.ts @@ -1,6 +1,7 @@ import { FONT_FAMILY } from "../constants"; import { getLineHeight } from "../fonts"; import { API } from "../tests/helpers/api"; + import { computeContainerDimensionForBoundText, getContainerCoords, @@ -8,6 +9,7 @@ import { getBoundTextMaxHeight, } from "./textElement"; import { detectLineHeight, getLineHeightInPx } from "./textMeasurements"; + import type { ExcalidrawTextElementWithContainer } from "./types"; describe("Test measureText", () => { diff --git a/packages/excalidraw/element/textElement.ts b/packages/excalidraw/element/textElement.ts index de948d9c..9893ba5d 100644 --- a/packages/excalidraw/element/textElement.ts +++ b/packages/excalidraw/element/textElement.ts @@ -1,14 +1,3 @@ -import { getFontString, arrayToMap } from "../utils"; -import type { - ElementsMap, - ExcalidrawElement, - ExcalidrawElementType, - ExcalidrawTextContainer, - ExcalidrawTextElement, - ExcalidrawTextElementWithContainer, - NonDeletedExcalidrawElement, -} from "./types"; -import { mutateElement } from "./mutateElement"; import { ARROW_LABEL_FONT_SIZE_TO_MIN_WIDTH_RATIO, ARROW_LABEL_WIDTH_FRACTION, @@ -17,18 +6,32 @@ import { TEXT_ALIGN, VERTICAL_ALIGN, } from "../constants"; -import type { MaybeTransformHandleType } from "./transformHandles"; -import { isTextElement } from "."; -import { wrapText } from "./textWrapping"; -import { isBoundToContainer, isArrowElement } from "./typeChecks"; -import { LinearElementEditor } from "./linearElementEditor"; -import type { AppState } from "../types"; +import { getFontString, arrayToMap } from "../utils"; + import { resetOriginalContainerCache, updateOriginalContainerCache, } from "./containerCache"; -import type { ExtractSetType } from "../utility-types"; +import { LinearElementEditor } from "./linearElementEditor"; +import { mutateElement } from "./mutateElement"; import { measureText } from "./textMeasurements"; +import { wrapText } from "./textWrapping"; +import { isBoundToContainer, isArrowElement } from "./typeChecks"; + +import { isTextElement } from "."; + +import type { MaybeTransformHandleType } from "./transformHandles"; +import type { + ElementsMap, + ExcalidrawElement, + ExcalidrawElementType, + ExcalidrawTextContainer, + ExcalidrawTextElement, + ExcalidrawTextElementWithContainer, + NonDeletedExcalidrawElement, +} from "./types"; +import type { AppState } from "../types"; +import type { ExtractSetType } from "../utility-types"; export const redrawTextBoundingBox = ( textElement: ExcalidrawTextElement, diff --git a/packages/excalidraw/element/textMeasurements.ts b/packages/excalidraw/element/textMeasurements.ts index f2a132a3..840896cf 100644 --- a/packages/excalidraw/element/textMeasurements.ts +++ b/packages/excalidraw/element/textMeasurements.ts @@ -4,6 +4,7 @@ import { DEFAULT_FONT_FAMILY, } from "../constants"; import { getFontString, isTestEnv, normalizeEOL } from "../utils"; + import type { FontString, ExcalidrawTextElement } from "./types"; export const measureText = ( diff --git a/packages/excalidraw/element/textWrapping.test.ts b/packages/excalidraw/element/textWrapping.test.ts index 6c7bcb81..357736a2 100644 --- a/packages/excalidraw/element/textWrapping.test.ts +++ b/packages/excalidraw/element/textWrapping.test.ts @@ -1,4 +1,5 @@ import { wrapText, parseTokens } from "./textWrapping"; + import type { FontString } from "./types"; describe("Test wrapText", () => { diff --git a/packages/excalidraw/element/textWrapping.ts b/packages/excalidraw/element/textWrapping.ts index 1913f6ed..5df7051c 100644 --- a/packages/excalidraw/element/textWrapping.ts +++ b/packages/excalidraw/element/textWrapping.ts @@ -1,5 +1,7 @@ import { ENV } from "../constants"; + import { charWidth, getLineWidth } from "./textMeasurements"; + import type { FontString } from "./types"; let cachedCjkRegex: RegExp | undefined; diff --git a/packages/excalidraw/element/textWysiwyg.test.tsx b/packages/excalidraw/element/textWysiwyg.test.tsx index 0842e30f..11c700e3 100644 --- a/packages/excalidraw/element/textWysiwyg.test.tsx +++ b/packages/excalidraw/element/textWysiwyg.test.tsx @@ -1,29 +1,31 @@ +import { pointFrom } from "@excalidraw/math"; +import { queryByText } from "@testing-library/react"; import React from "react"; + +import { FONT_FAMILY, TEXT_ALIGN, VERTICAL_ALIGN } from "../constants"; import { Excalidraw } from "../index"; +import { CODES, KEYS } from "../keys"; +import { API } from "../tests/helpers/api"; +import { Keyboard, Pointer, UI } from "../tests/helpers/ui"; +import { getTextEditor, updateTextEditor } from "../tests/queries/dom"; import { GlobalTestState, render, screen, unmountComponent, } from "../tests/test-utils"; -import { Keyboard, Pointer, UI } from "../tests/helpers/ui"; -import { CODES, KEYS } from "../keys"; import { fireEvent, mockBoundingClientRect, restoreOriginalGetBoundingClientRect, } from "../tests/test-utils"; -import { queryByText } from "@testing-library/react"; -import { FONT_FAMILY, TEXT_ALIGN, VERTICAL_ALIGN } from "../constants"; +import { getOriginalContainerHeightFromCache } from "./containerCache"; + import type { ExcalidrawTextElement, ExcalidrawTextElementWithContainer, } from "./types"; -import { API } from "../tests/helpers/api"; -import { getOriginalContainerHeightFromCache } from "./containerCache"; -import { getTextEditor, updateTextEditor } from "../tests/queries/dom"; -import { pointFrom } from "@excalidraw/math"; unmountComponent(); diff --git a/packages/excalidraw/element/textWysiwyg.tsx b/packages/excalidraw/element/textWysiwyg.tsx index a7570862..1d0c19de 100644 --- a/packages/excalidraw/element/textWysiwyg.tsx +++ b/packages/excalidraw/element/textWysiwyg.tsx @@ -1,24 +1,28 @@ +import { + actionResetZoom, + actionZoomIn, + actionZoomOut, +} from "../actions/actionCanvas"; +import { + actionDecreaseFontSize, + actionIncreaseFontSize, +} from "../actions/actionProperties"; +import { parseClipboard } from "../clipboard"; +import { CLASSES, POINTER_BUTTON } from "../constants"; import { CODES, KEYS } from "../keys"; +import Scene from "../scene/Scene"; import { isWritableElement, getFontString, getFontFamilyString, isTestEnv, } from "../utils"; -import Scene from "../scene/Scene"; + import { - isArrowElement, - isBoundToContainer, - isTextElement, -} from "./typeChecks"; -import { CLASSES, POINTER_BUTTON } from "../constants"; -import type { - ExcalidrawElement, - ExcalidrawLinearElement, - ExcalidrawTextElementWithContainer, - ExcalidrawTextElement, -} from "./types"; -import type { AppState } from "../types"; + originalContainerCache, + updateOriginalContainerCache, +} from "./containerCache"; +import { LinearElementEditor } from "./linearElementEditor"; import { bumpVersion, mutateElement } from "./mutateElement"; import { getBoundTextElementId, @@ -31,25 +35,23 @@ import { computeBoundTextPosition, getBoundTextElement, } from "./textElement"; +import { getTextWidth } from "./textMeasurements"; +import { normalizeText } from "./textMeasurements"; import { wrapText } from "./textWrapping"; import { - actionDecreaseFontSize, - actionIncreaseFontSize, -} from "../actions/actionProperties"; -import { - actionResetZoom, - actionZoomIn, - actionZoomOut, -} from "../actions/actionCanvas"; + isArrowElement, + isBoundToContainer, + isTextElement, +} from "./typeChecks"; + +import type { + ExcalidrawElement, + ExcalidrawLinearElement, + ExcalidrawTextElementWithContainer, + ExcalidrawTextElement, +} from "./types"; import type App from "../components/App"; -import { LinearElementEditor } from "./linearElementEditor"; -import { parseClipboard } from "../clipboard"; -import { - originalContainerCache, - updateOriginalContainerCache, -} from "./containerCache"; -import { getTextWidth } from "./textMeasurements"; -import { normalizeText } from "./textMeasurements"; +import type { AppState } from "../types"; const getTransform = ( width: number, diff --git a/packages/excalidraw/element/transformHandles.ts b/packages/excalidraw/element/transformHandles.ts index d34eb327..ab5691df 100644 --- a/packages/excalidraw/element/transformHandles.ts +++ b/packages/excalidraw/element/transformHandles.ts @@ -1,26 +1,29 @@ -import type { - ElementsMap, - ExcalidrawElement, - NonDeletedExcalidrawElement, - PointerType, -} from "./types"; +import { pointFrom, pointRotateRads } from "@excalidraw/math"; + +import type { Radians } from "@excalidraw/math"; + +import { + DEFAULT_TRANSFORM_HANDLE_SPACING, + isAndroid, + isIOS, +} from "../constants"; -import type { Bounds } from "./bounds"; import { getElementAbsoluteCoords } from "./bounds"; -import type { Device, InteractiveCanvasAppState, Zoom } from "../types"; import { isElbowArrow, isFrameLikeElement, isImageElement, isLinearElement, } from "./typeChecks"; -import { - DEFAULT_TRANSFORM_HANDLE_SPACING, - isAndroid, - isIOS, -} from "../constants"; -import type { Radians } from "@excalidraw/math"; -import { pointFrom, pointRotateRads } from "@excalidraw/math"; + +import type { Device, InteractiveCanvasAppState, Zoom } from "../types"; +import type { Bounds } from "./bounds"; +import type { + ElementsMap, + ExcalidrawElement, + NonDeletedExcalidrawElement, + PointerType, +} from "./types"; export type TransformHandleDirection = | "n" diff --git a/packages/excalidraw/element/typeChecks.test.ts b/packages/excalidraw/element/typeChecks.test.ts index 60eb9e27..44e4dd75 100644 --- a/packages/excalidraw/element/typeChecks.test.ts +++ b/packages/excalidraw/element/typeChecks.test.ts @@ -1,4 +1,5 @@ import { API } from "../tests/helpers/api"; + import { hasBoundTextElement } from "./typeChecks"; describe("Test TypeChecks", () => { diff --git a/packages/excalidraw/element/typeChecks.ts b/packages/excalidraw/element/typeChecks.ts index 6bb4269f..77ac38f9 100644 --- a/packages/excalidraw/element/typeChecks.ts +++ b/packages/excalidraw/element/typeChecks.ts @@ -1,7 +1,8 @@ import { ROUNDNESS } from "../constants"; +import { assertNever } from "../utils"; + import type { ElementOrToolType } from "../types"; import type { MarkNonNullable } from "../utility-types"; -import { assertNever } from "../utils"; import type { Bounds } from "./bounds"; import type { ExcalidrawElement, diff --git a/packages/excalidraw/element/types.ts b/packages/excalidraw/element/types.ts index 59658674..49ad800a 100644 --- a/packages/excalidraw/element/types.ts +++ b/packages/excalidraw/element/types.ts @@ -1,4 +1,5 @@ import type { LocalPoint, Radians } from "@excalidraw/math"; + import type { FONT_FAMILY, ROUNDNESS, diff --git a/packages/excalidraw/element/utils.ts b/packages/excalidraw/element/utils.ts index d85cd78c..8992850d 100644 --- a/packages/excalidraw/element/utils.ts +++ b/packages/excalidraw/element/utils.ts @@ -1,5 +1,3 @@ -import { getDiamondPoints } from "."; -import type { Curve, LineSegment } from "@excalidraw/math"; import { curve, lineSegment, @@ -11,7 +9,13 @@ import { vectorScale, type GlobalPoint, } from "@excalidraw/math"; + +import type { Curve, LineSegment } from "@excalidraw/math"; + import { getCornerRadius } from "../shapes"; + +import { getDiamondPoints } from "."; + import type { ExcalidrawDiamondElement, ExcalidrawRectanguloidElement, diff --git a/packages/excalidraw/fonts/Cascadia/index.ts b/packages/excalidraw/fonts/Cascadia/index.ts index ecd11164..aad91ff0 100644 --- a/packages/excalidraw/fonts/Cascadia/index.ts +++ b/packages/excalidraw/fonts/Cascadia/index.ts @@ -1,7 +1,7 @@ -import CascadiaCodeRegular from "./CascadiaCode-Regular.woff2"; - import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; +import CascadiaCodeRegular from "./CascadiaCode-Regular.woff2"; + export const CascadiaFontFaces: ExcalidrawFontFaceDescriptor[] = [ { uri: CascadiaCodeRegular, diff --git a/packages/excalidraw/fonts/ComicShanns/index.ts b/packages/excalidraw/fonts/ComicShanns/index.ts index bf78650b..20d23c28 100644 --- a/packages/excalidraw/fonts/ComicShanns/index.ts +++ b/packages/excalidraw/fonts/ComicShanns/index.ts @@ -1,12 +1,12 @@ // The following file content was generated with https://chinese-font.netlify.app/online-split, // but has been manully rewritten from `@font-face` rules into TS while leveraging FontFace API. +import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; + import _0 from "./ComicShanns-Regular-279a7b317d12eb88de06167bd672b4b4.woff2"; -import _1 from "./ComicShanns-Regular-fcb0fc02dcbee4c9846b3e2508668039.woff2"; -import _2 from "./ComicShanns-Regular-dc6a8806fa96795d7b3be5026f989a17.woff2"; import _3 from "./ComicShanns-Regular-6e066e8de2ac57ea9283adb9c24d7f0c.woff2"; - -import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; +import _2 from "./ComicShanns-Regular-dc6a8806fa96795d7b3be5026f989a17.woff2"; +import _1 from "./ComicShanns-Regular-fcb0fc02dcbee4c9846b3e2508668039.woff2"; /* Generated By cn-font-split@5.2.2 https://www.npmjs.com/package/cn-font-split CreateTime: Thu, 17 Oct 2024 09:57:51 GMT; diff --git a/packages/excalidraw/fonts/Emoji/index.ts b/packages/excalidraw/fonts/Emoji/index.ts index 491c7b8c..323d075c 100644 --- a/packages/excalidraw/fonts/Emoji/index.ts +++ b/packages/excalidraw/fonts/Emoji/index.ts @@ -1,5 +1,4 @@ import { LOCAL_FONT_PROTOCOL } from "../FontMetadata"; - import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; export const EmojiFontFaces: ExcalidrawFontFaceDescriptor[] = [ diff --git a/packages/excalidraw/fonts/ExcalidrawFontFace.ts b/packages/excalidraw/fonts/ExcalidrawFontFace.ts index 9d8b9f78..615fef20 100644 --- a/packages/excalidraw/fonts/ExcalidrawFontFace.ts +++ b/packages/excalidraw/fonts/ExcalidrawFontFace.ts @@ -1,6 +1,7 @@ +import { subsetWoff2GlyphsByCodepoints } from "../subset/subset-main"; import { promiseTry } from "../utils"; + import { LOCAL_FONT_PROTOCOL } from "./FontMetadata"; -import { subsetWoff2GlyphsByCodepoints } from "../subset/subset-main"; type DataURL = string; diff --git a/packages/excalidraw/fonts/Excalifont/index.ts b/packages/excalidraw/fonts/Excalifont/index.ts index 7e11af6c..bcd384be 100644 --- a/packages/excalidraw/fonts/Excalifont/index.ts +++ b/packages/excalidraw/fonts/Excalifont/index.ts @@ -1,12 +1,12 @@ -import _0 from "./Excalifont-Regular-a88b72a24fb54c9f94e3b5fdaa7481c9.woff2"; -import _1 from "./Excalifont-Regular-be310b9bcd4f1a43f571c46df7809174.woff2"; -import _2 from "./Excalifont-Regular-b9dcf9d2e50a1eaf42fc664b50a3fd0d.woff2"; -import _3 from "./Excalifont-Regular-41b173a47b57366892116a575a43e2b6.woff2"; -import _4 from "./Excalifont-Regular-3f2c5db56cc93c5a6873b1361d730c16.woff2"; +import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; + import _5 from "./Excalifont-Regular-349fac6ca4700ffec595a7150a0d1e1d.woff2"; +import _4 from "./Excalifont-Regular-3f2c5db56cc93c5a6873b1361d730c16.woff2"; +import _3 from "./Excalifont-Regular-41b173a47b57366892116a575a43e2b6.woff2"; import _6 from "./Excalifont-Regular-623ccf21b21ef6b3a0d87738f77eb071.woff2"; - -import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; +import _0 from "./Excalifont-Regular-a88b72a24fb54c9f94e3b5fdaa7481c9.woff2"; +import _2 from "./Excalifont-Regular-b9dcf9d2e50a1eaf42fc664b50a3fd0d.woff2"; +import _1 from "./Excalifont-Regular-be310b9bcd4f1a43f571c46df7809174.woff2"; /* Generated By cn-font-split@5.2.2 https://www.npmjs.com/package/cn-font-split CreateTime: Mon, 14 Oct 2024 18:59:19 GMT; diff --git a/packages/excalidraw/fonts/FontMetadata.ts b/packages/excalidraw/fonts/FontMetadata.ts index e93380e8..e8b46205 100644 --- a/packages/excalidraw/fonts/FontMetadata.ts +++ b/packages/excalidraw/fonts/FontMetadata.ts @@ -1,4 +1,3 @@ -import type { JSX } from "react"; import { FreedrawIcon, FontFamilyNormalIcon, @@ -7,6 +6,8 @@ import { } from "../components/icons"; import { FONT_FAMILY, FONT_FAMILY_FALLBACKS } from "../constants"; +import type { JSX } from "react"; + /** * Encapsulates font metrics with additional font metadata. * */ diff --git a/packages/excalidraw/fonts/Fonts.ts b/packages/excalidraw/fonts/Fonts.ts index 4b8ba782..c1b94bde 100644 --- a/packages/excalidraw/fonts/Fonts.ts +++ b/packages/excalidraw/fonts/Fonts.ts @@ -7,15 +7,17 @@ import { } from "../constants"; import { isTextElement } from "../element"; import { getContainerElement } from "../element/textElement"; +import { charWidth } from "../element/textMeasurements"; import { containsCJK } from "../element/textWrapping"; import { ShapeCache } from "../scene/ShapeCache"; import { getFontString, PromisePool, promiseTry } from "../utils"; -import { ExcalidrawFontFace } from "./ExcalidrawFontFace"; import { CascadiaFontFaces } from "./Cascadia"; import { ComicShannsFontFaces } from "./ComicShanns"; import { EmojiFontFaces } from "./Emoji"; +import { ExcalidrawFontFace } from "./ExcalidrawFontFace"; import { ExcalifontFontFaces } from "./Excalifont"; +import { FONT_METADATA, type FontMetadata } from "./FontMetadata"; import { HelveticaFontFaces } from "./Helvetica"; import { LiberationFontFaces } from "./Liberation"; import { LilitaFontFaces } from "./Lilita"; @@ -23,7 +25,6 @@ import { NunitoFontFaces } from "./Nunito"; import { VirgilFontFaces } from "./Virgil"; import { XiaolaiFontFaces } from "./Xiaolai"; -import { FONT_METADATA, type FontMetadata } from "./FontMetadata"; import type { ExcalidrawElement, ExcalidrawTextElement, @@ -31,7 +32,6 @@ import type { } from "../element/types"; import type Scene from "../scene/Scene"; import type { ValueOf } from "../utility-types"; -import { charWidth } from "../element/textMeasurements"; export class Fonts { // it's ok to track fonts across multiple instances only once, so let's use diff --git a/packages/excalidraw/fonts/Helvetica/index.ts b/packages/excalidraw/fonts/Helvetica/index.ts index a0e7ecb6..f13d1511 100644 --- a/packages/excalidraw/fonts/Helvetica/index.ts +++ b/packages/excalidraw/fonts/Helvetica/index.ts @@ -1,5 +1,4 @@ import { LOCAL_FONT_PROTOCOL } from "../FontMetadata"; - import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; export const HelveticaFontFaces: ExcalidrawFontFaceDescriptor[] = [ diff --git a/packages/excalidraw/fonts/Liberation/index.ts b/packages/excalidraw/fonts/Liberation/index.ts index 5bc96481..86b3e72e 100644 --- a/packages/excalidraw/fonts/Liberation/index.ts +++ b/packages/excalidraw/fonts/Liberation/index.ts @@ -1,7 +1,7 @@ -import LiberationSansRegular from "./LiberationSans-Regular.woff2"; - import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; +import LiberationSansRegular from "./LiberationSans-Regular.woff2"; + export const LiberationFontFaces: ExcalidrawFontFaceDescriptor[] = [ { uri: LiberationSansRegular, diff --git a/packages/excalidraw/fonts/Lilita/index.ts b/packages/excalidraw/fonts/Lilita/index.ts index d5ea82e5..37a5d6a5 100644 --- a/packages/excalidraw/fonts/Lilita/index.ts +++ b/packages/excalidraw/fonts/Lilita/index.ts @@ -1,10 +1,9 @@ -import LilitaLatin from "./Lilita-Regular-i7dPIFZ9Zz-WBtRtedDbYEF8RXi4EwQ.woff2"; -import LilitaLatinExt from "./Lilita-Regular-i7dPIFZ9Zz-WBtRtedDbYE98RXi4EwSsbg.woff2"; - import { GOOGLE_FONTS_RANGES } from "../FontMetadata"; - import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; +import LilitaLatinExt from "./Lilita-Regular-i7dPIFZ9Zz-WBtRtedDbYE98RXi4EwSsbg.woff2"; +import LilitaLatin from "./Lilita-Regular-i7dPIFZ9Zz-WBtRtedDbYEF8RXi4EwQ.woff2"; + export const LilitaFontFaces: ExcalidrawFontFaceDescriptor[] = [ { uri: LilitaLatinExt, diff --git a/packages/excalidraw/fonts/Nunito/index.ts b/packages/excalidraw/fonts/Nunito/index.ts index 4db432d0..3b092b0d 100644 --- a/packages/excalidraw/fonts/Nunito/index.ts +++ b/packages/excalidraw/fonts/Nunito/index.ts @@ -1,13 +1,12 @@ -import Latin from "./Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTQ3j6zbXWjgeg.woff2"; -import LatinExt from "./Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTo3j6zbXWjgevT5.woff2"; +import { GOOGLE_FONTS_RANGES } from "../FontMetadata"; +import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; + import Cyrilic from "./Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTA3j6zbXWjgevT5.woff2"; +import Latin from "./Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTQ3j6zbXWjgeg.woff2"; import CyrilicExt from "./Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTk3j6zbXWjgevT5.woff2"; +import LatinExt from "./Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTo3j6zbXWjgevT5.woff2"; import Vietnamese from "./Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTs3j6zbXWjgevT5.woff2"; -import { GOOGLE_FONTS_RANGES } from "../FontMetadata"; - -import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; - export const NunitoFontFaces: ExcalidrawFontFaceDescriptor[] = [ { uri: CyrilicExt, diff --git a/packages/excalidraw/fonts/Virgil/index.ts b/packages/excalidraw/fonts/Virgil/index.ts index fdd5ffcf..b9ce7ee7 100644 --- a/packages/excalidraw/fonts/Virgil/index.ts +++ b/packages/excalidraw/fonts/Virgil/index.ts @@ -1,7 +1,7 @@ -import Virgil from "./Virgil-Regular.woff2"; - import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; +import Virgil from "./Virgil-Regular.woff2"; + export const VirgilFontFaces: ExcalidrawFontFaceDescriptor[] = [ { uri: Virgil, diff --git a/packages/excalidraw/fonts/Xiaolai/index.ts b/packages/excalidraw/fonts/Xiaolai/index.ts index 17fd7183..67476b91 100644 --- a/packages/excalidraw/fonts/Xiaolai/index.ts +++ b/packages/excalidraw/fonts/Xiaolai/index.ts @@ -1,23 +1,31 @@ // The following file content was generated with https://chinese-font.netlify.app/online-split, // but has been manully rewritten from `@font-face` rules into TS while leveraging FontFace API. +import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; + +import _80 from "./Xiaolai-Regular-019d66dcad46dc156b162d267f981c20.woff2"; +import _16 from "./Xiaolai-Regular-04b718e5623574919c8b0dea5f301444.woff2"; +import _13 from "./Xiaolai-Regular-069e77aac84590e2e991d0a0176d34f2.woff2"; +import _166 from "./Xiaolai-Regular-06c77b8c66e51ed6c63ccb502dd8b8af.woff2"; +import _71 from "./Xiaolai-Regular-08e0dc436ad0ad61ba5558db0674d762.woff2"; +import _161 from "./Xiaolai-Regular-093b9ef39a46ceae95a1df18a0a3a326.woff2"; +import _183 from "./Xiaolai-Regular-095c169f3314805276f603a362766abd.woff2"; import _0 from "./Xiaolai-Regular-09850c4077f3fffe707905872e0e2460.woff2"; -import _1 from "./Xiaolai-Regular-7eb9fffd1aa890d07d0f88cc82e6cfe4.woff2"; +import _14 from "./Xiaolai-Regular-41521fade99856108931b4768b1b2648.woff2"; +import _10 from "./Xiaolai-Regular-544fc28abe2c5c30e62383fd4dac255f.woff2"; import _2 from "./Xiaolai-Regular-60a3089806700d379f11827ee9843b6b.woff2"; +import _1 from "./Xiaolai-Regular-7eb9fffd1aa890d07d0f88cc82e6cfe4.woff2"; import _3 from "./Xiaolai-Regular-6fe5c5973cc06f74b2387a631ea36b88.woff2"; +import _6 from "./Xiaolai-Regular-a4c34be6d42152e64b0df90bc4607f64.woff2"; import _4 from "./Xiaolai-Regular-b96d9226ce77ec94ceca043d712182e6.woff2"; import _5 from "./Xiaolai-Regular-6ae5b42180ad70b971c91e7eefb8eba2.woff2"; -import _6 from "./Xiaolai-Regular-a4c34be6d42152e64b0df90bc4607f64.woff2"; import _7 from "./Xiaolai-Regular-c69f61a4ab18d0488c8d1fc12e7028e8.woff2"; +import _30 from "./Xiaolai-Regular-cb17fc3db95f6d139afc9d31a8e93293.woff2"; import _8 from "./Xiaolai-Regular-e3fcf5180fd466c8915c4e8069491054.woff2"; import _9 from "./Xiaolai-Regular-c1f94158256bb1f3bf665b053d895af9.woff2"; -import _10 from "./Xiaolai-Regular-544fc28abe2c5c30e62383fd4dac255f.woff2"; import _11 from "./Xiaolai-Regular-7197d6fda6cba7c3874c53d6381ca239.woff2"; import _12 from "./Xiaolai-Regular-70c2eb8d64e71a42a834eb857ea9df51.woff2"; -import _13 from "./Xiaolai-Regular-069e77aac84590e2e991d0a0176d34f2.woff2"; -import _14 from "./Xiaolai-Regular-41521fade99856108931b4768b1b2648.woff2"; import _15 from "./Xiaolai-Regular-a004ddfcb26e67bd6e678c8ed19e25ce.woff2"; -import _16 from "./Xiaolai-Regular-04b718e5623574919c8b0dea5f301444.woff2"; import _17 from "./Xiaolai-Regular-7e4bde7e9c7f84cd34d8a845e384c746.woff2"; import _18 from "./Xiaolai-Regular-23686f7f29da6e8008c36dd3a80c83d6.woff2"; import _19 from "./Xiaolai-Regular-69c09cc5fa3e55c74fc4821f76909cc3.woff2"; @@ -31,7 +39,6 @@ import _26 from "./Xiaolai-Regular-7e929f262f30c8ee78bf398150b1a7cd.woff2"; import _27 from "./Xiaolai-Regular-73e309718fd16cea44b4d54a33581811.woff2"; import _28 from "./Xiaolai-Regular-9eb5a99df4e76ac3363453ac9ca288b1.woff2"; import _29 from "./Xiaolai-Regular-3e63ed8162808a9e425ed80a8bc79114.woff2"; -import _30 from "./Xiaolai-Regular-cb17fc3db95f6d139afc9d31a8e93293.woff2"; import _31 from "./Xiaolai-Regular-c8b71798409ccc126ee264a00aadcf21.woff2"; import _32 from "./Xiaolai-Regular-11c345711937f0ba4b8f7b6b919c8440.woff2"; import _33 from "./Xiaolai-Regular-e480d9c614742d05f0e78f274f1e69e6.woff2"; @@ -40,15 +47,17 @@ import _35 from "./Xiaolai-Regular-2cf96d082d35ea3d8106851223ad0d16.woff2"; import _36 from "./Xiaolai-Regular-2d43040e86ff03ba677f6f9c04cd0805.woff2"; import _37 from "./Xiaolai-Regular-2a26d20a23b00898ce82f09d2ee47c3f.woff2"; import _38 from "./Xiaolai-Regular-a365e82ed54697a52f27adcea1315fe8.woff2"; +import _41 from "./Xiaolai-Regular-e4bca6cfa53e499cae0a6be4894a90e9.woff2"; +import _105 from "./Xiaolai-Regular-e51ef413167c6e14e0c0fdcc585f2fc9.woff2"; +import _82 from "./Xiaolai-Regular-e5f453bb04da18eed01675eeebd88bf8.woff2"; +import _45 from "./Xiaolai-Regular-e656f091b9dc4709722c9f4b84d3c797.woff2"; +import _47 from "./Xiaolai-Regular-f0f13b5c60e0af5553bd359f5513be1b.woff2"; import _39 from "./Xiaolai-Regular-f5d079153c99a25b9be5b8583c4cc8a7.woff2"; import _40 from "./Xiaolai-Regular-10a7ae9a371830a80c3d844acf1c02d7.woff2"; -import _41 from "./Xiaolai-Regular-e4bca6cfa53e499cae0a6be4894a90e9.woff2"; import _42 from "./Xiaolai-Regular-60a41c7e1c68f22424e6d22df544bc82.woff2"; import _43 from "./Xiaolai-Regular-7ab2bed91166a9dca83a5ebfbe2a7f38.woff2"; import _44 from "./Xiaolai-Regular-670ba603758d94268e8606f240a42e12.woff2"; -import _45 from "./Xiaolai-Regular-e656f091b9dc4709722c9f4b84d3c797.woff2"; import _46 from "./Xiaolai-Regular-15dc6d811c9cd078f9086a740d5a1038.woff2"; -import _47 from "./Xiaolai-Regular-f0f13b5c60e0af5553bd359f5513be1b.woff2"; import _48 from "./Xiaolai-Regular-8c2f33cee3993174f7e87c28e4bf42ee.woff2"; import _49 from "./Xiaolai-Regular-761d05e3cd968cf574166867998ef06a.woff2"; import _50 from "./Xiaolai-Regular-642b26e2e5f5fb780b51b593dbc8c851.woff2"; @@ -72,7 +81,6 @@ import _67 from "./Xiaolai-Regular-0b5d723fdc4e249c140f0909e87d03b4.woff2"; import _68 from "./Xiaolai-Regular-cdbce89e82cc1ab53a2decbf5819278f.woff2"; import _69 from "./Xiaolai-Regular-739bc1a567439c7cffcd1614644593d2.woff2"; import _70 from "./Xiaolai-Regular-72252d73220fa3cd856677888cee1635.woff2"; -import _71 from "./Xiaolai-Regular-08e0dc436ad0ad61ba5558db0674d762.woff2"; import _72 from "./Xiaolai-Regular-cf6ff4e0f491ca0cf3038187a997b9b4.woff2"; import _73 from "./Xiaolai-Regular-9cfb2a77a4e45025105ad29a1748b90d.woff2"; import _74 from "./Xiaolai-Regular-450da755d5bcb70906e1295e559b9602.woff2"; @@ -81,9 +89,7 @@ import _76 from "./Xiaolai-Regular-1ee544f0f1dac422545c505baa788992.woff2"; import _77 from "./Xiaolai-Regular-4806e761d750087c2d734fc64596eaff.woff2"; import _78 from "./Xiaolai-Regular-33432927cd87d40cfe393c7482bf221f.woff2"; import _79 from "./Xiaolai-Regular-be549ab72f0719d606a5c01e2c0219b6.woff2"; -import _80 from "./Xiaolai-Regular-019d66dcad46dc156b162d267f981c20.woff2"; import _81 from "./Xiaolai-Regular-b5c1596551c256e0e9cf02028595b092.woff2"; -import _82 from "./Xiaolai-Regular-e5f453bb04da18eed01675eeebd88bf8.woff2"; import _83 from "./Xiaolai-Regular-cf2cc71752631e579e35b0e423bf2638.woff2"; import _84 from "./Xiaolai-Regular-6f3256af8454371776bc46670d33cc65.woff2"; import _85 from "./Xiaolai-Regular-23f228f3999c01983860012330e4be08.woff2"; @@ -106,7 +112,6 @@ import _101 from "./Xiaolai-Regular-4a0fdb40036e87b40aa08dd30584cb85.woff2"; import _102 from "./Xiaolai-Regular-0f626226ba1272e832aea87bafd9720e.woff2"; import _103 from "./Xiaolai-Regular-938d90c10ff8c20386af7f242c05d6b0.woff2"; import _104 from "./Xiaolai-Regular-b6d128682ee29e471486354d486a1b90.woff2"; -import _105 from "./Xiaolai-Regular-e51ef413167c6e14e0c0fdcc585f2fc9.woff2"; import _106 from "./Xiaolai-Regular-9d81066dd2b337c938df6e90380a00dc.woff2"; import _107 from "./Xiaolai-Regular-20e7bf72fa05de9adf7dbcc7bf51dde6.woff2"; import _108 from "./Xiaolai-Regular-4095eb84ef3874e2600247bee0b04026.woff2"; @@ -162,15 +167,14 @@ import _157 from "./Xiaolai-Regular-774d4f764a1299da5d28ec2f2ffe0d69.woff2"; import _158 from "./Xiaolai-Regular-7718fe60986d8b42b1be9c5ace5ccf25.woff2"; import _159 from "./Xiaolai-Regular-aa5c9ca6cf4fba00433b7aa3fa10671a.woff2"; import _160 from "./Xiaolai-Regular-4f50e5136e136527280bc902c5817561.woff2"; -import _161 from "./Xiaolai-Regular-093b9ef39a46ceae95a1df18a0a3a326.woff2"; import _162 from "./Xiaolai-Regular-a0ca5df4258213d7fc9fce80f65ce760.woff2"; import _163 from "./Xiaolai-Regular-d2666cbed13462c5dc36fa2f15c202ca.woff2"; import _164 from "./Xiaolai-Regular-1e6fd68f1f3902ce48ce8c69df385622.woff2"; import _165 from "./Xiaolai-Regular-87599f94b6cc129d505b375798d0d751.woff2"; -import _166 from "./Xiaolai-Regular-06c77b8c66e51ed6c63ccb502dd8b8af.woff2"; import _167 from "./Xiaolai-Regular-13ae07ed2e272d26d59bc0691cd7117a.woff2"; import _168 from "./Xiaolai-Regular-353f33792a8f60dc69323ddf635a269e.woff2"; import _169 from "./Xiaolai-Regular-0facdf1ea213ba40261022f5d5ed4493.woff2"; +import _202 from "./Xiaolai-Regular-f6032fc06eb20480f096199713f70885.woff2"; import _170 from "./Xiaolai-Regular-f8ee5d36068a42b51d0e4a1116cfcec1.woff2"; import _171 from "./Xiaolai-Regular-79d494361ae093b69e74ee9dbe65bfd4.woff2"; import _172 from "./Xiaolai-Regular-74e2263a91439c25b91d5132ce9f4d62.woff2"; @@ -184,7 +188,6 @@ import _179 from "./Xiaolai-Regular-8e9f97f01034820170065b2921b4fb5e.woff2"; import _180 from "./Xiaolai-Regular-13d2887ec8ee73c43acdabc52a05af7b.woff2"; import _181 from "./Xiaolai-Regular-72536a3d71b694a0d53dd90ddceae41e.woff2"; import _182 from "./Xiaolai-Regular-603aefd23e350ba7eb124273e3c9bcf1.woff2"; -import _183 from "./Xiaolai-Regular-095c169f3314805276f603a362766abd.woff2"; import _184 from "./Xiaolai-Regular-9544732d2e62d1a429674f8ee41b5d3a.woff2"; import _185 from "./Xiaolai-Regular-d3716376641d615e2995605b29bca7b6.woff2"; import _186 from "./Xiaolai-Regular-5a1ce3117cfe90c48e8fb4a9a00f694d.woff2"; @@ -203,7 +206,6 @@ import _198 from "./Xiaolai-Regular-24476a126f129212beb33f66853ea151.woff2"; import _199 from "./Xiaolai-Regular-1b611157cd46bb184d4fa4dae2d6a2b8.woff2"; import _200 from "./Xiaolai-Regular-56a32a7689abd0326e57c10c6c069bb4.woff2"; import _201 from "./Xiaolai-Regular-3cc70dbb64df5b21f1326cc24dee2195.woff2"; -import _202 from "./Xiaolai-Regular-f6032fc06eb20480f096199713f70885.woff2"; import _203 from "./Xiaolai-Regular-e2ead7ea7da0437f085f42ffc05f8d13.woff2"; import _204 from "./Xiaolai-Regular-97f7f48ce90c9429bf32ae51469db74d.woff2"; import _205 from "./Xiaolai-Regular-24a21c1e4449222e8d1898d69ff3a404.woff2"; @@ -211,8 +213,6 @@ import _206 from "./Xiaolai-Regular-726303e0774b4e678bff8c2deb6ca603.woff2"; import _207 from "./Xiaolai-Regular-5a7fac4b8b23a6e4e5ba0c9bf1756c91.woff2"; import _208 from "./Xiaolai-Regular-2b7441d46298788ac94e610ffcc709b6.woff2"; -import { type ExcalidrawFontFaceDescriptor } from "../Fonts"; - /* Generated By cn-font-split@5.2.2 https://www.npmjs.com/package/cn-font-split CreateTime: Tue, 08 Oct 2024 18:34:44 GMT; Origin File Name Table: diff --git a/packages/excalidraw/fractionalIndex.ts b/packages/excalidraw/fractionalIndex.ts index dfb8a467..8a1459dd 100644 --- a/packages/excalidraw/fractionalIndex.ts +++ b/packages/excalidraw/fractionalIndex.ts @@ -1,14 +1,16 @@ import { generateNKeysBetween } from "fractional-indexing"; + import { mutateElement } from "./element/mutateElement"; +import { getBoundTextElement } from "./element/textElement"; +import { hasBoundTextElement } from "./element/typeChecks"; +import { InvalidFractionalIndexError } from "./errors"; +import { arrayToMap } from "./utils"; + import type { ExcalidrawElement, FractionalIndex, OrderedExcalidrawElement, } from "./element/types"; -import { InvalidFractionalIndexError } from "./errors"; -import { hasBoundTextElement } from "./element/typeChecks"; -import { getBoundTextElement } from "./element/textElement"; -import { arrayToMap } from "./utils"; /** * Envisioned relation between array order and fractional indices: diff --git a/packages/excalidraw/frame.test.tsx b/packages/excalidraw/frame.test.tsx index 6a5045b2..fce420c0 100644 --- a/packages/excalidraw/frame.test.tsx +++ b/packages/excalidraw/frame.test.tsx @@ -1,9 +1,11 @@ -import type { ExcalidrawElement } from "./element/types"; -import { convertToExcalidrawElements, Excalidraw } from "./index"; import { API } from "./tests/helpers/api"; import { Keyboard, Pointer } from "./tests/helpers/ui"; import { getCloneByOrigId, render } from "./tests/test-utils"; +import { convertToExcalidrawElements, Excalidraw } from "./index"; + +import type { ExcalidrawElement } from "./element/types"; + const { h } = window; const mouse = new Pointer("mouse"); diff --git a/packages/excalidraw/frame.ts b/packages/excalidraw/frame.ts index 4659a34a..758bc273 100644 --- a/packages/excalidraw/frame.ts +++ b/packages/excalidraw/frame.ts @@ -1,8 +1,25 @@ +import { isPointWithinBounds, pointFrom } from "@excalidraw/math"; +import { + doLineSegmentsIntersect, + elementsOverlappingBBox, +} from "@excalidraw/utils"; + import { getCommonBounds, getElementAbsoluteCoords, isTextElement, } from "./element"; +import { getElementLineSegments } from "./element/bounds"; +import { mutateElement } from "./element/mutateElement"; +import { + getBoundTextElement, + getContainerElement, +} from "./element/textElement"; +import { isFrameElement, isFrameLikeElement } from "./element/typeChecks"; +import { getElementsInGroup, selectGroupsFromGivenElements } from "./groups"; +import { getElementsWithinSelection, getSelectedElements } from "./scene"; +import { arrayToMap } from "./utils"; + import type { ElementsMap, ElementsMapOrArray, @@ -11,28 +28,13 @@ import type { NonDeleted, NonDeletedExcalidrawElement, } from "./element/types"; -import { - getBoundTextElement, - getContainerElement, -} from "./element/textElement"; -import { arrayToMap } from "./utils"; -import { mutateElement } from "./element/mutateElement"; +import type { ExcalidrawElementsIncludingDeleted } from "./scene/Scene"; import type { AppClassProperties, AppState, StaticCanvasAppState, } from "./types"; -import { getElementsWithinSelection, getSelectedElements } from "./scene"; -import { getElementsInGroup, selectGroupsFromGivenElements } from "./groups"; -import type { ExcalidrawElementsIncludingDeleted } from "./scene/Scene"; -import { getElementLineSegments } from "./element/bounds"; -import { - doLineSegmentsIntersect, - elementsOverlappingBBox, -} from "@excalidraw/utils"; -import { isFrameElement, isFrameLikeElement } from "./element/typeChecks"; import type { ReadonlySetLike } from "./utility-types"; -import { isPointWithinBounds, pointFrom } from "@excalidraw/math"; // --------------------------- Frame State ------------------------------------ export const bindElementsToFramesAfterDuplication = ( diff --git a/packages/excalidraw/groups.ts b/packages/excalidraw/groups.ts index 5a4e606f..cedc4af0 100644 --- a/packages/excalidraw/groups.ts +++ b/packages/excalidraw/groups.ts @@ -1,3 +1,7 @@ +import { getBoundTextElement } from "./element/textElement"; +import { getSelectedElements } from "./scene"; +import { makeNextSelectedElementIds } from "./scene/selection"; + import type { GroupId, ExcalidrawElement, @@ -11,9 +15,6 @@ import type { AppState, InteractiveCanvasAppState, } from "./types"; -import { getSelectedElements } from "./scene"; -import { getBoundTextElement } from "./element/textElement"; -import { makeNextSelectedElementIds } from "./scene/selection"; import type { Mutable } from "./utility-types"; export const selectGroup = ( diff --git a/packages/excalidraw/history.ts b/packages/excalidraw/history.ts index daed2a39..48ea012b 100644 --- a/packages/excalidraw/history.ts +++ b/packages/excalidraw/history.ts @@ -1,6 +1,7 @@ +import { Emitter } from "./emitter"; + import type { AppStateChange, ElementsChange } from "./change"; import type { SceneElementsMap } from "./element/types"; -import { Emitter } from "./emitter"; import type { Snapshot } from "./store"; import type { AppState } from "./types"; diff --git a/packages/excalidraw/hooks/useCreatePortalContainer.ts b/packages/excalidraw/hooks/useCreatePortalContainer.ts index e8f5e3db..b557d7e2 100644 --- a/packages/excalidraw/hooks/useCreatePortalContainer.ts +++ b/packages/excalidraw/hooks/useCreatePortalContainer.ts @@ -1,4 +1,5 @@ import { useState, useLayoutEffect } from "react"; + import { useDevice, useExcalidrawContainer } from "../components/App"; import { THEME } from "../constants"; import { useUIAppState } from "../context/ui-appState"; diff --git a/packages/excalidraw/hooks/useEmitter.ts b/packages/excalidraw/hooks/useEmitter.ts index 27b94bc9..eebbaaf3 100644 --- a/packages/excalidraw/hooks/useEmitter.ts +++ b/packages/excalidraw/hooks/useEmitter.ts @@ -1,4 +1,5 @@ import { useEffect, useState } from "react"; + import type { Emitter } from "../emitter"; export const useEmitter = ( diff --git a/packages/excalidraw/hooks/useLibraryItemSvg.ts b/packages/excalidraw/hooks/useLibraryItemSvg.ts index 72b648d1..a79aab5c 100644 --- a/packages/excalidraw/hooks/useLibraryItemSvg.ts +++ b/packages/excalidraw/hooks/useLibraryItemSvg.ts @@ -1,7 +1,9 @@ +import { exportToSvg } from "@excalidraw/utils/export"; import { useEffect, useState } from "react"; + import { COLOR_PALETTE } from "../colors"; import { atom, useAtom } from "../editor-jotai"; -import { exportToSvg } from "@excalidraw/utils/export"; + import type { LibraryItem } from "../types"; export type SvgCache = Map; diff --git a/packages/excalidraw/hooks/useOutsideClick.ts b/packages/excalidraw/hooks/useOutsideClick.ts index da9a54d0..7ec2113c 100644 --- a/packages/excalidraw/hooks/useOutsideClick.ts +++ b/packages/excalidraw/hooks/useOutsideClick.ts @@ -1,4 +1,5 @@ import { useEffect } from "react"; + import { EVENT } from "../constants"; export function useOutsideClick( diff --git a/packages/excalidraw/hooks/useScrollPosition.ts b/packages/excalidraw/hooks/useScrollPosition.ts index 0be2eab9..1fb1408b 100644 --- a/packages/excalidraw/hooks/useScrollPosition.ts +++ b/packages/excalidraw/hooks/useScrollPosition.ts @@ -1,6 +1,7 @@ +import throttle from "lodash.throttle"; import { useEffect } from "react"; + import { atom, useAtom } from "../editor-jotai"; -import throttle from "lodash.throttle"; const scrollPositionAtom = atom(0); diff --git a/packages/excalidraw/i18n.ts b/packages/excalidraw/i18n.ts index e1da5fc4..47bae597 100644 --- a/packages/excalidraw/i18n.ts +++ b/packages/excalidraw/i18n.ts @@ -1,6 +1,7 @@ +import { useAtomValue, editorJotaiStore, atom } from "./editor-jotai"; import fallbackLangData from "./locales/en.json"; import percentages from "./locales/percentages.json"; -import { useAtomValue, editorJotaiStore, atom } from "./editor-jotai"; + import type { NestedKeyOf } from "./utility-types"; const COMPLETION_THRESHOLD = 85; diff --git a/packages/excalidraw/index-node.ts b/packages/excalidraw/index-node.ts index e966b1d5..3b949914 100644 --- a/packages/excalidraw/index-node.ts +++ b/packages/excalidraw/index-node.ts @@ -1,5 +1,7 @@ -import { exportToCanvas } from "./scene/export"; import { getDefaultAppState } from "./appState"; +import { exportToCanvas } from "./scene/export"; + +const fs = require("fs"); const { registerFont, createCanvas } = require("canvas"); @@ -74,7 +76,6 @@ const canvas = exportToCanvas( createCanvas, ); -const fs = require("fs"); const out = fs.createWriteStream("test.png"); const stream = (canvas as any).createPNGStream(); stream.pipe(out); diff --git a/packages/excalidraw/index.tsx b/packages/excalidraw/index.tsx index b4b8574b..f9f25b53 100644 --- a/packages/excalidraw/index.tsx +++ b/packages/excalidraw/index.tsx @@ -1,21 +1,22 @@ import React, { useEffect } from "react"; -import { InitializeApp } from "./components/InitializeApp"; + import App from "./components/App"; -import { isShallowEqual } from "./utils"; +import { InitializeApp } from "./components/InitializeApp"; +import Footer from "./components/footer/FooterCenter"; +import LiveCollaborationTrigger from "./components/live-collaboration/LiveCollaborationTrigger"; +import MainMenu from "./components/main-menu/MainMenu"; +import WelcomeScreen from "./components/welcome-screen/WelcomeScreen"; +import { DEFAULT_UI_OPTIONS } from "./constants"; +import { defaultLang } from "./i18n"; +import { EditorJotaiProvider, editorJotaiStore } from "./editor-jotai"; import polyfill from "./polyfill"; +import { isShallowEqual } from "./utils"; import "./css/app.scss"; import "./css/styles.scss"; import "./fonts/fonts.css"; import type { AppProps, ExcalidrawProps } from "./types"; -import { defaultLang } from "./i18n"; -import { DEFAULT_UI_OPTIONS } from "./constants"; -import { EditorJotaiProvider, editorJotaiStore } from "./editor-jotai"; -import Footer from "./components/footer/FooterCenter"; -import MainMenu from "./components/main-menu/MainMenu"; -import WelcomeScreen from "./components/welcome-screen/WelcomeScreen"; -import LiveCollaborationTrigger from "./components/live-collaboration/LiveCollaborationTrigger"; polyfill(); diff --git a/packages/excalidraw/keys.ts b/packages/excalidraw/keys.ts index 2088f89d..948e7f56 100644 --- a/packages/excalidraw/keys.ts +++ b/packages/excalidraw/keys.ts @@ -1,4 +1,5 @@ import { isDarwin } from "./constants"; + import type { ValueOf } from "./utility-types"; export const CODES = { diff --git a/packages/excalidraw/laser-trails.ts b/packages/excalidraw/laser-trails.ts index b7733bae..06e6b573 100644 --- a/packages/excalidraw/laser-trails.ts +++ b/packages/excalidraw/laser-trails.ts @@ -1,12 +1,14 @@ import type { LaserPointerOptions } from "@excalidraw/laser-pointer"; -import type { Trail } from "./animated-trail"; + import { AnimatedTrail } from "./animated-trail"; +import { getClientColor } from "./clients"; +import { DEFAULT_LASER_COLOR } from "./constants"; +import { easeOut } from "./utils"; + +import type { Trail } from "./animated-trail"; import type { AnimationFrameHandler } from "./animation-frame-handler"; import type App from "./components/App"; import type { SocketId } from "./types"; -import { easeOut } from "./utils"; -import { getClientColor } from "./clients"; -import { DEFAULT_LASER_COLOR } from "./constants"; export class LaserTrails implements Trail { public localTrail: AnimatedTrail; diff --git a/packages/excalidraw/queue.ts b/packages/excalidraw/queue.ts index 9cac2c5e..b7369e5e 100644 --- a/packages/excalidraw/queue.ts +++ b/packages/excalidraw/queue.ts @@ -1,6 +1,7 @@ +import { promiseTry, resolvablePromise } from "./utils"; + import type { MaybePromise } from "./utility-types"; import type { ResolvablePromise } from "./utils"; -import { promiseTry, resolvablePromise } from "./utils"; type Job = (...args: TArgs) => MaybePromise; diff --git a/packages/excalidraw/random.ts b/packages/excalidraw/random.ts index 851bc28e..4a4424a7 100644 --- a/packages/excalidraw/random.ts +++ b/packages/excalidraw/random.ts @@ -1,5 +1,6 @@ -import { Random } from "roughjs/bin/math"; import { nanoid } from "nanoid"; +import { Random } from "roughjs/bin/math"; + import { isTestEnv } from "./utils"; let random = new Random(Date.now()); diff --git a/packages/excalidraw/reactUtils.ts b/packages/excalidraw/reactUtils.ts index 535302d4..5bc46639 100644 --- a/packages/excalidraw/reactUtils.ts +++ b/packages/excalidraw/reactUtils.ts @@ -2,8 +2,9 @@ * @param func handler taking at most single parameter (event). */ -import { unstable_batchedUpdates } from "react-dom"; import { version as ReactVersion } from "react"; +import { unstable_batchedUpdates } from "react-dom"; + import { throttleRAF } from "./utils"; export const withBatchedUpdates = < diff --git a/packages/excalidraw/renderer/helpers.ts b/packages/excalidraw/renderer/helpers.ts index 90f40099..05097f95 100644 --- a/packages/excalidraw/renderer/helpers.ts +++ b/packages/excalidraw/renderer/helpers.ts @@ -1,8 +1,7 @@ -import type { StaticCanvasAppState, AppState } from "../types"; +import { THEME, THEME_FILTER } from "../constants"; import type { StaticCanvasRenderConfig } from "../scene/types"; - -import { THEME, THEME_FILTER } from "../constants"; +import type { StaticCanvasAppState, AppState } from "../types"; export const fillCircle = ( context: CanvasRenderingContext2D, diff --git a/packages/excalidraw/renderer/interactiveScene.ts b/packages/excalidraw/renderer/interactiveScene.ts index 9aa83277..257decd6 100644 --- a/packages/excalidraw/renderer/interactiveScene.ts +++ b/packages/excalidraw/renderer/interactiveScene.ts @@ -1,48 +1,23 @@ import { - getElementAbsoluteCoords, - getTransformHandlesFromCoords, - getTransformHandles, - getCommonBounds, -} from "../element"; - -import { roundRect } from "../renderer/roundRect"; - -import { - getScrollBars, - SCROLLBAR_COLOR, - SCROLLBAR_WIDTH, -} from "../scene/scrollbars"; + pointFrom, + type GlobalPoint, + type LocalPoint, + type Radians, +} from "@excalidraw/math"; +import oc from "open-color"; -import { renderSelectionElement } from "../renderer/renderElement"; import { getClientColor, renderRemoteCursors } from "../clients"; -import { - isSelectedViaGroup, - getSelectedGroupIds, - getElementsInGroup, - selectGroupsFromGivenElements, -} from "../groups"; -import type { - TransformHandles, - TransformHandleType, -} from "../element/transformHandles"; -import { - getOmitSidesForDevice, - shouldShowBoundingBox, -} from "../element/transformHandles"; -import { arrayToMap, invariant, throttleRAF } from "../utils"; import { DEFAULT_TRANSFORM_HANDLE_SPACING, FRAME_STYLE, THEME, } from "../constants"; -import { type InteractiveCanvasAppState } from "../types"; - -import { renderSnaps } from "../renderer/renderSnaps"; - -import type { - SuggestedBinding, - SuggestedPointBinding, -} from "../element/binding"; +import { + getElementAbsoluteCoords, + getTransformHandlesFromCoords, + getTransformHandles, + getCommonBounds, +} from "../element"; import { BINDING_HIGHLIGHT_OFFSET, BINDING_HIGHLIGHT_THICKNESS, @@ -50,11 +25,9 @@ import { } from "../element/binding"; import { LinearElementEditor } from "../element/linearElementEditor"; import { - bootstrapCanvas, - fillCircle, - getNormalizedCanvasDimensions, -} from "./helpers"; -import oc from "open-color"; + getOmitSidesForDevice, + shouldShowBoundingBox, +} from "../element/transformHandles"; import { isElbowArrow, isFrameLikeElement, @@ -62,6 +35,38 @@ import { isLinearElement, isTextElement, } from "../element/typeChecks"; +import { + isSelectedViaGroup, + getSelectedGroupIds, + getElementsInGroup, + selectGroupsFromGivenElements, +} from "../groups"; +import { renderSelectionElement } from "../renderer/renderElement"; +import { renderSnaps } from "../renderer/renderSnaps"; +import { roundRect } from "../renderer/roundRect"; +import { + getScrollBars, + SCROLLBAR_COLOR, + SCROLLBAR_WIDTH, +} from "../scene/scrollbars"; +import { getCornerRadius } from "../shapes"; +import { type InteractiveCanvasAppState } from "../types"; +import { arrayToMap, invariant, throttleRAF } from "../utils"; + +import { + bootstrapCanvas, + fillCircle, + getNormalizedCanvasDimensions, +} from "./helpers"; + +import type { + SuggestedBinding, + SuggestedPointBinding, +} from "../element/binding"; +import type { + TransformHandles, + TransformHandleType, +} from "../element/transformHandles"; import type { ElementsMap, ExcalidrawBindableElement, @@ -78,13 +83,6 @@ import type { InteractiveSceneRenderConfig, RenderableElementsMap, } from "../scene/types"; -import { - pointFrom, - type GlobalPoint, - type LocalPoint, - type Radians, -} from "@excalidraw/math"; -import { getCornerRadius } from "../shapes"; const renderElbowArrowMidPointHighlight = ( context: CanvasRenderingContext2D, diff --git a/packages/excalidraw/renderer/renderElement.ts b/packages/excalidraw/renderer/renderElement.ts index d93469c2..9209c46d 100644 --- a/packages/excalidraw/renderer/renderElement.ts +++ b/packages/excalidraw/renderer/renderElement.ts @@ -1,14 +1,27 @@ -import type { - ExcalidrawElement, - ExcalidrawTextElement, - NonDeletedExcalidrawElement, - ExcalidrawFreeDrawElement, - ExcalidrawImageElement, - ExcalidrawTextElementWithContainer, - ExcalidrawFrameLikeElement, - NonDeletedSceneElementsMap, - ElementsMap, -} from "../element/types"; +import { isRightAngleRads } from "@excalidraw/math"; +import { getStroke } from "perfect-freehand"; +import rough from "roughjs/bin/rough"; + +import { getDefaultAppState } from "../appState"; +import { + BOUND_TEXT_PADDING, + DEFAULT_REDUCED_GLOBAL_ALPHA, + ELEMENT_READY_TO_ERASE_OPACITY, + FRAME_STYLE, + MIME_TYPES, + THEME, +} from "../constants"; +import { getElementAbsoluteCoords } from "../element/bounds"; +import { getUncroppedImageElement } from "../element/cropElement"; +import { LinearElementEditor } from "../element/linearElementEditor"; +import { + getBoundTextElement, + getContainerCoords, + getContainerElement, + getBoundTextMaxHeight, + getBoundTextMaxWidth, +} from "../element/textElement"; +import { getLineHeightInPx } from "../element/textMeasurements"; import { isTextElement, isLinearElement, @@ -19,16 +32,28 @@ import { isMagicFrameElement, isImageElement, } from "../element/typeChecks"; -import { getElementAbsoluteCoords } from "../element/bounds"; -import type { RoughCanvas } from "roughjs/bin/canvas"; +import { getVerticalOffset } from "../fonts"; +import { getContainingFrame } from "../frame"; +import { ShapeCache } from "../scene/ShapeCache"; +import { getCornerRadius } from "../shapes"; +import { distance, getFontString, isRTL } from "../utils"; +import type { + ExcalidrawElement, + ExcalidrawTextElement, + NonDeletedExcalidrawElement, + ExcalidrawFreeDrawElement, + ExcalidrawImageElement, + ExcalidrawTextElementWithContainer, + ExcalidrawFrameLikeElement, + NonDeletedSceneElementsMap, + ElementsMap, +} from "../element/types"; import type { StaticCanvasRenderConfig, RenderableElementsMap, InteractiveCanvasRenderConfig, } from "../scene/types"; -import { distance, getFontString, isRTL } from "../utils"; -import rough from "roughjs/bin/rough"; import type { AppState, StaticCanvasAppState, @@ -37,33 +62,8 @@ import type { ElementsPendingErasure, PendingExcalidrawElements, } from "../types"; -import { getDefaultAppState } from "../appState"; -import { - BOUND_TEXT_PADDING, - DEFAULT_REDUCED_GLOBAL_ALPHA, - ELEMENT_READY_TO_ERASE_OPACITY, - FRAME_STYLE, - MIME_TYPES, - THEME, -} from "../constants"; import type { StrokeOptions } from "perfect-freehand"; -import { getStroke } from "perfect-freehand"; -import { - getBoundTextElement, - getContainerCoords, - getContainerElement, - getBoundTextMaxHeight, - getBoundTextMaxWidth, -} from "../element/textElement"; -import { LinearElementEditor } from "../element/linearElementEditor"; - -import { getContainingFrame } from "../frame"; -import { ShapeCache } from "../scene/ShapeCache"; -import { getVerticalOffset } from "../fonts"; -import { isRightAngleRads } from "@excalidraw/math"; -import { getCornerRadius } from "../shapes"; -import { getUncroppedImageElement } from "../element/cropElement"; -import { getLineHeightInPx } from "../element/textMeasurements"; +import type { RoughCanvas } from "roughjs/bin/canvas"; // using a stronger invert (100% vs our regular 93%) and saturate // as a temp hack to make images in dark theme look closer to original diff --git a/packages/excalidraw/renderer/renderNewElementScene.ts b/packages/excalidraw/renderer/renderNewElementScene.ts index caa7f581..f8040836 100644 --- a/packages/excalidraw/renderer/renderNewElementScene.ts +++ b/packages/excalidraw/renderer/renderNewElementScene.ts @@ -1,8 +1,10 @@ -import type { NewElementSceneRenderConfig } from "../scene/types"; import { throttleRAF } from "../utils"; + import { bootstrapCanvas, getNormalizedCanvasDimensions } from "./helpers"; import { renderElement } from "./renderElement"; +import type { NewElementSceneRenderConfig } from "../scene/types"; + const _renderNewElementScene = ({ canvas, rc, diff --git a/packages/excalidraw/renderer/renderSnaps.ts b/packages/excalidraw/renderer/renderSnaps.ts index 878e8e52..8c26675a 100644 --- a/packages/excalidraw/renderer/renderSnaps.ts +++ b/packages/excalidraw/renderer/renderSnaps.ts @@ -1,5 +1,7 @@ import { pointFrom, type GlobalPoint, type LocalPoint } from "@excalidraw/math"; + import { THEME } from "../constants"; + import type { PointSnapLine, PointerSnapLine } from "../snapping"; import type { InteractiveCanvasAppState } from "../types"; diff --git a/packages/excalidraw/renderer/staticScene.ts b/packages/excalidraw/renderer/staticScene.ts index 90ed8af4..62aeed5b 100644 --- a/packages/excalidraw/renderer/staticScene.ts +++ b/packages/excalidraw/renderer/staticScene.ts @@ -1,19 +1,28 @@ +import { + EXTERNAL_LINK_IMG, + ELEMENT_LINK_IMG, + getLinkHandleFromCoords, +} from "../components/hyperlink/helpers"; import { FRAME_STYLE } from "../constants"; import { getElementAbsoluteCoords } from "../element"; - -import { - elementOverlapsWithFrame, - getTargetFrame, - shouldApplyFrameClip, -} from "../frame"; +import { isElementLink } from "../element/elementLink"; +import { createPlaceholderEmbeddableLabel } from "../element/embeddable"; +import { getBoundTextElement } from "../element/textElement"; import { isEmbeddableElement, isIframeLikeElement, isTextElement, } from "../element/typeChecks"; +import { + elementOverlapsWithFrame, + getTargetFrame, + shouldApplyFrameClip, +} from "../frame"; import { renderElement } from "../renderer/renderElement"; -import { createPlaceholderEmbeddableLabel } from "../element/embeddable"; -import type { StaticCanvasAppState, Zoom } from "../types"; +import { throttleRAF } from "../utils"; + +import { bootstrapCanvas, getNormalizedCanvasDimensions } from "./helpers"; + import type { ElementsMap, ExcalidrawFrameLikeElement, @@ -23,15 +32,7 @@ import type { StaticCanvasRenderConfig, StaticSceneRenderConfig, } from "../scene/types"; -import { - EXTERNAL_LINK_IMG, - ELEMENT_LINK_IMG, - getLinkHandleFromCoords, -} from "../components/hyperlink/helpers"; -import { bootstrapCanvas, getNormalizedCanvasDimensions } from "./helpers"; -import { throttleRAF } from "../utils"; -import { getBoundTextElement } from "../element/textElement"; -import { isElementLink } from "../element/elementLink"; +import type { StaticCanvasAppState, Zoom } from "../types"; const GridLineColor = { Bold: "#dddddd", diff --git a/packages/excalidraw/renderer/staticSvgScene.ts b/packages/excalidraw/renderer/staticSvgScene.ts index b14faf7f..23a6890d 100644 --- a/packages/excalidraw/renderer/staticSvgScene.ts +++ b/packages/excalidraw/renderer/staticSvgScene.ts @@ -1,5 +1,3 @@ -import type { Drawable } from "roughjs/bin/core"; -import type { RoughSVG } from "roughjs/bin/svg"; import { FRAME_STYLE, MAX_DECIMALS_FOR_SVG_EXPORT, @@ -8,6 +6,7 @@ import { } from "../constants"; import { normalizeLink, toValidURL } from "../data/url"; import { getElementAbsoluteCoords, hashString } from "../element"; +import { getUncroppedWidthAndHeight } from "../element/cropElement"; import { createPlaceholderEmbeddableLabel, getEmbedLink, @@ -17,27 +16,30 @@ import { getBoundTextElement, getContainerElement, } from "../element/textElement"; +import { getLineHeightInPx } from "../element/textMeasurements"; import { isArrowElement, isIframeLikeElement, isInitializedImageElement, isTextElement, } from "../element/typeChecks"; +import { getVerticalOffset } from "../fonts"; +import { getContainingFrame } from "../frame"; +import { ShapeCache } from "../scene/ShapeCache"; +import { getCornerRadius, isPathALoop } from "../shapes"; +import { getFontFamilyString, isRTL, isTestEnv } from "../utils"; + +import { getFreeDrawSvgPath, IMAGE_INVERT_FILTER } from "./renderElement"; + import type { ExcalidrawElement, ExcalidrawTextElementWithContainer, NonDeletedExcalidrawElement, } from "../element/types"; -import { getContainingFrame } from "../frame"; -import { ShapeCache } from "../scene/ShapeCache"; import type { RenderableElementsMap, SVGRenderConfig } from "../scene/types"; import type { AppState, BinaryFiles } from "../types"; -import { getFontFamilyString, isRTL, isTestEnv } from "../utils"; -import { getFreeDrawSvgPath, IMAGE_INVERT_FILTER } from "./renderElement"; -import { getVerticalOffset } from "../fonts"; -import { getCornerRadius, isPathALoop } from "../shapes"; -import { getUncroppedWidthAndHeight } from "../element/cropElement"; -import { getLineHeightInPx } from "../element/textMeasurements"; +import type { Drawable } from "roughjs/bin/core"; +import type { RoughSVG } from "roughjs/bin/svg"; const roughSVGDrawWithPrecision = ( rsvg: RoughSVG, diff --git a/packages/excalidraw/scene/Renderer.ts b/packages/excalidraw/scene/Renderer.ts index 8048d20c..19a6c0b1 100644 --- a/packages/excalidraw/scene/Renderer.ts +++ b/packages/excalidraw/scene/Renderer.ts @@ -1,17 +1,17 @@ import { isElementInViewport } from "../element/sizeHelpers"; import { isImageElement } from "../element/typeChecks"; +import { renderInteractiveSceneThrottled } from "../renderer/interactiveScene"; +import { renderStaticSceneThrottled } from "../renderer/staticScene"; +import { memoize, toBrandedType } from "../utils"; + +import type Scene from "./Scene"; +import type { RenderableElementsMap } from "./types"; import type { ExcalidrawElement, NonDeletedElementsMap, NonDeletedExcalidrawElement, } from "../element/types"; -import { renderInteractiveSceneThrottled } from "../renderer/interactiveScene"; -import { renderStaticSceneThrottled } from "../renderer/staticScene"; - import type { AppState } from "../types"; -import { memoize, toBrandedType } from "../utils"; -import type Scene from "./Scene"; -import type { RenderableElementsMap } from "./types"; export class Renderer { private scene: Scene; diff --git a/packages/excalidraw/scene/Scene.ts b/packages/excalidraw/scene/Scene.ts index 99bb9e1e..0eab8b80 100644 --- a/packages/excalidraw/scene/Scene.ts +++ b/packages/excalidraw/scene/Scene.ts @@ -1,4 +1,21 @@ import throttle from "lodash.throttle"; + +import { ENV } from "../constants"; +import { isNonDeletedElement } from "../element"; +import { isFrameLikeElement } from "../element/typeChecks"; +import { + syncInvalidIndices, + syncMovedIndices, + validateFractionalIndices, +} from "../fractionalIndex"; +import { getElementsInGroup } from "../groups"; +import { randomInteger } from "../random"; +import { arrayToMap } from "../utils"; +import { toBrandedType } from "../utils"; + +import { getSelectedElements } from "./selection"; + +import type { LinearElementEditor } from "../element/linearElementEditor"; import type { ExcalidrawElement, NonDeletedExcalidrawElement, @@ -10,22 +27,8 @@ import type { OrderedExcalidrawElement, Ordered, } from "../element/types"; -import { isNonDeletedElement } from "../element"; -import type { LinearElementEditor } from "../element/linearElementEditor"; -import { isFrameLikeElement } from "../element/typeChecks"; -import { getSelectedElements } from "./selection"; import type { AppState } from "../types"; import type { Assert, SameType } from "../utility-types"; -import { randomInteger } from "../random"; -import { - syncInvalidIndices, - syncMovedIndices, - validateFractionalIndices, -} from "../fractionalIndex"; -import { arrayToMap } from "../utils"; -import { toBrandedType } from "../utils"; -import { ENV } from "../constants"; -import { getElementsInGroup } from "../groups"; type ElementIdKey = InstanceType["elementId"]; type ElementKey = ExcalidrawElement | ElementIdKey; diff --git a/packages/excalidraw/scene/Shape.ts b/packages/excalidraw/scene/Shape.ts index 9c49db0c..64d90b78 100644 --- a/packages/excalidraw/scene/Shape.ts +++ b/packages/excalidraw/scene/Shape.ts @@ -1,19 +1,9 @@ -import type { Point as RoughPoint } from "roughjs/bin/geometry"; -import type { Drawable, Options } from "roughjs/bin/core"; -import type { RoughGenerator } from "roughjs/bin/generator"; -import { getDiamondPoints, getArrowheadPoints } from "../element"; -import type { ElementShapes } from "./types"; -import type { - ExcalidrawElement, - NonDeletedExcalidrawElement, - ExcalidrawSelectionElement, - ExcalidrawLinearElement, - Arrowhead, -} from "../element/types"; -import { generateFreeDrawShape } from "../renderer/renderElement"; -import { isTransparent, assertNever } from "../utils"; +import { pointFrom, pointDistance, type LocalPoint } from "@excalidraw/math"; import { simplify } from "points-on-curve"; + import { ROUGHNESS } from "../constants"; +import { getDiamondPoints, getArrowheadPoints } from "../element"; +import { headingForPointIsHorizontal } from "../element/heading"; import { isElbowArrow, isEmbeddableElement, @@ -21,11 +11,24 @@ import { isIframeLikeElement, isLinearElement, } from "../element/typeChecks"; +import { generateFreeDrawShape } from "../renderer/renderElement"; +import { getCornerRadius, isPathALoop } from "../shapes"; +import { isTransparent, assertNever } from "../utils"; + import { canChangeRoundness } from "./comparisons"; + +import type { + ExcalidrawElement, + NonDeletedExcalidrawElement, + ExcalidrawSelectionElement, + ExcalidrawLinearElement, + Arrowhead, +} from "../element/types"; import type { EmbedsValidationStatus } from "../types"; -import { pointFrom, pointDistance, type LocalPoint } from "@excalidraw/math"; -import { getCornerRadius, isPathALoop } from "../shapes"; -import { headingForPointIsHorizontal } from "../element/heading"; +import type { ElementShapes } from "./types"; +import type { Drawable, Options } from "roughjs/bin/core"; +import type { RoughGenerator } from "roughjs/bin/generator"; +import type { Point as RoughPoint } from "roughjs/bin/geometry"; const getDashArrayDashed = (strokeWidth: number) => [8, 8 + strokeWidth]; diff --git a/packages/excalidraw/scene/ShapeCache.ts b/packages/excalidraw/scene/ShapeCache.ts index 39d388a7..c170b0a8 100644 --- a/packages/excalidraw/scene/ShapeCache.ts +++ b/packages/excalidraw/scene/ShapeCache.ts @@ -1,14 +1,17 @@ -import type { Drawable } from "roughjs/bin/core"; import { RoughGenerator } from "roughjs/bin/generator"; + +import { COLOR_PALETTE } from "../colors"; +import { elementWithCanvasCache } from "../renderer/renderElement"; + +import { _generateElementShape } from "./Shape"; + import type { ExcalidrawElement, ExcalidrawSelectionElement, } from "../element/types"; -import { elementWithCanvasCache } from "../renderer/renderElement"; -import { _generateElementShape } from "./Shape"; -import type { ElementShape, ElementShapes } from "./types"; -import { COLOR_PALETTE } from "../colors"; import type { AppState, EmbedsValidationStatus } from "../types"; +import type { ElementShape, ElementShapes } from "./types"; +import type { Drawable } from "roughjs/bin/core"; export class ShapeCache { private static rg = new RoughGenerator(); diff --git a/packages/excalidraw/scene/export.ts b/packages/excalidraw/scene/export.ts index 7b332569..8ca35de2 100644 --- a/packages/excalidraw/scene/export.ts +++ b/packages/excalidraw/scene/export.ts @@ -1,16 +1,6 @@ import rough from "roughjs/bin/rough"; -import type { - ExcalidrawElement, - ExcalidrawFrameLikeElement, - ExcalidrawTextElement, - NonDeletedExcalidrawElement, - NonDeletedSceneElementsMap, -} from "../element/types"; -import type { Bounds } from "../element/bounds"; -import { getCommonBounds, getElementAbsoluteCoords } from "../element/bounds"; -import { renderSceneToSvg } from "../renderer/staticSvgScene"; -import { arrayToMap, distance, getFontString, toBrandedType } from "../utils"; -import type { AppState, BinaryFiles } from "../types"; + +import { getDefaultAppState } from "../appState"; import { DEFAULT_EXPORT_PADDING, FRAME_STYLE, @@ -21,27 +11,39 @@ import { MIME_TYPES, EXPORT_DATA_TYPES, } from "../constants"; -import { getDefaultAppState } from "../appState"; +import { base64ToString, decode, encode, stringToBase64 } from "../data/encode"; import { serializeAsJSON } from "../data/json"; +import { newTextElement } from "../element"; +import { getCommonBounds, getElementAbsoluteCoords } from "../element/bounds"; import { getInitializedImageElements, updateImageCache, } from "../element/image"; +import { newElementWith } from "../element/mutateElement"; +import { isFrameLikeElement } from "../element/typeChecks"; +import { Fonts } from "../fonts"; +import { syncInvalidIndices } from "../fractionalIndex"; import { getElementsOverlappingFrame, getFrameLikeElements, getFrameLikeTitle, getRootElements, } from "../frame"; -import { newTextElement } from "../element"; +import { renderStaticScene } from "../renderer/staticScene"; +import { renderSceneToSvg } from "../renderer/staticSvgScene"; import { type Mutable } from "../utility-types"; -import { newElementWith } from "../element/mutateElement"; -import { isFrameLikeElement } from "../element/typeChecks"; +import { arrayToMap, distance, getFontString, toBrandedType } from "../utils"; + import type { RenderableElementsMap } from "./types"; -import { syncInvalidIndices } from "../fractionalIndex"; -import { renderStaticScene } from "../renderer/staticScene"; -import { Fonts } from "../fonts"; -import { base64ToString, decode, encode, stringToBase64 } from "../data/encode"; +import type { Bounds } from "../element/bounds"; +import type { + ExcalidrawElement, + ExcalidrawFrameLikeElement, + ExcalidrawTextElement, + NonDeletedExcalidrawElement, + NonDeletedSceneElementsMap, +} from "../element/types"; +import type { AppState, BinaryFiles } from "../types"; const truncateText = (element: ExcalidrawTextElement, maxWidth: number) => { if (element.width <= maxWidth) { diff --git a/packages/excalidraw/scene/normalize.ts b/packages/excalidraw/scene/normalize.ts index 2a025fc2..0c73c5a8 100644 --- a/packages/excalidraw/scene/normalize.ts +++ b/packages/excalidraw/scene/normalize.ts @@ -1,5 +1,7 @@ import { clamp, round } from "@excalidraw/math"; + import { MAX_ZOOM, MIN_ZOOM } from "../constants"; + import type { NormalizedZoomValue } from "../types"; export const getNormalizedZoom = (zoom: number): NormalizedZoomValue => { diff --git a/packages/excalidraw/scene/scroll.ts b/packages/excalidraw/scene/scroll.ts index 5d059e5b..989564eb 100644 --- a/packages/excalidraw/scene/scroll.ts +++ b/packages/excalidraw/scene/scroll.ts @@ -1,16 +1,16 @@ -import type { AppState, Offsets, PointerCoords, Zoom } from "../types"; -import type { ExcalidrawElement } from "../element/types"; import { getCommonBounds, getClosestElementBounds, getVisibleElements, } from "../element"; - import { sceneCoordsToViewportCoords, viewportCoordsToSceneCoords, } from "../utils"; +import type { ExcalidrawElement } from "../element/types"; +import type { AppState, Offsets, PointerCoords, Zoom } from "../types"; + const isOutsideViewPort = (appState: AppState, cords: Array) => { const [x1, y1, x2, y2] = cords; const { x: viewportX1, y: viewportY1 } = sceneCoordsToViewportCoords( diff --git a/packages/excalidraw/scene/scrollbars.ts b/packages/excalidraw/scene/scrollbars.ts index 70f7033f..b44d79f2 100644 --- a/packages/excalidraw/scene/scrollbars.ts +++ b/packages/excalidraw/scene/scrollbars.ts @@ -1,9 +1,10 @@ import { getCommonBounds } from "../element"; -import type { InteractiveCanvasAppState } from "../types"; -import type { ScrollBars } from "./types"; -import { getGlobalCSSVariable } from "../utils"; import { getLanguage } from "../i18n"; +import { getGlobalCSSVariable } from "../utils"; + import type { ExcalidrawElement } from "../element/types"; +import type { InteractiveCanvasAppState } from "../types"; +import type { ScrollBars } from "./types"; export const SCROLLBAR_MARGIN = 4; export const SCROLLBAR_WIDTH = 6; diff --git a/packages/excalidraw/scene/selection.ts b/packages/excalidraw/scene/selection.ts index 3ca91cd5..02f8f05e 100644 --- a/packages/excalidraw/scene/selection.ts +++ b/packages/excalidraw/scene/selection.ts @@ -1,11 +1,5 @@ -import type { - ElementsMap, - ElementsMapOrArray, - ExcalidrawElement, - NonDeletedExcalidrawElement, -} from "../element/types"; import { getElementAbsoluteCoords, getElementBounds } from "../element"; -import type { AppState, InteractiveCanvasAppState } from "../types"; +import { isElementInViewport } from "../element/sizeHelpers"; import { isBoundToContainer, isFrameLikeElement } from "../element/typeChecks"; import { elementOverlapsWithFrame, @@ -13,7 +7,14 @@ import { getFrameChildren, } from "../frame"; import { isShallowEqual } from "../utils"; -import { isElementInViewport } from "../element/sizeHelpers"; + +import type { + ElementsMap, + ElementsMapOrArray, + ExcalidrawElement, + NonDeletedExcalidrawElement, +} from "../element/types"; +import type { AppState, InteractiveCanvasAppState } from "../types"; /** * Frames and their containing elements are not to be selected at the same time. diff --git a/packages/excalidraw/scene/types.ts b/packages/excalidraw/scene/types.ts index c0bfd1bb..3c198d15 100644 --- a/packages/excalidraw/scene/types.ts +++ b/packages/excalidraw/scene/types.ts @@ -1,5 +1,4 @@ -import type { RoughCanvas } from "roughjs/bin/canvas"; -import type { Drawable } from "roughjs/bin/core"; +import type { UserIdleState } from "../constants"; import type { ExcalidrawElement, NonDeletedElementsMap, @@ -18,7 +17,8 @@ import type { PendingExcalidrawElements, } from "../types"; import type { MakeBrand } from "../utility-types"; -import type { UserIdleState } from "../constants"; +import type { RoughCanvas } from "roughjs/bin/canvas"; +import type { Drawable } from "roughjs/bin/core"; export type RenderableElementsMap = NonDeletedElementsMap & MakeBrand<"RenderableElementsMap">; diff --git a/packages/excalidraw/shapes.tsx b/packages/excalidraw/shapes.tsx index cfd639f2..b2c391a4 100644 --- a/packages/excalidraw/shapes.tsx +++ b/packages/excalidraw/shapes.tsx @@ -17,6 +17,7 @@ import { getPolygonShape, type GeometricShape, } from "@excalidraw/utils/geometry/shape"; + import { ArrowIcon, DiamondIcon, @@ -36,20 +37,21 @@ import { ROUNDNESS, } from "./constants"; import { getElementAbsoluteCoords } from "./element"; -import type { Bounds } from "./element/bounds"; import { shouldTestInside } from "./element/collision"; import { LinearElementEditor } from "./element/linearElementEditor"; import { getBoundTextElement } from "./element/textElement"; +import { KEYS } from "./keys"; +import { ShapeCache } from "./scene/ShapeCache"; +import { invariant } from "./utils"; + +import type { Bounds } from "./element/bounds"; import type { ElementsMap, ExcalidrawElement, ExcalidrawLinearElement, NonDeleted, } from "./element/types"; -import { KEYS } from "./keys"; -import { ShapeCache } from "./scene/ShapeCache"; import type { NormalizedZoomValue, Zoom } from "./types"; -import { invariant } from "./utils"; export const SHAPES = [ { diff --git a/packages/excalidraw/snapping.ts b/packages/excalidraw/snapping.ts index 1b661516..7c85f411 100644 --- a/packages/excalidraw/snapping.ts +++ b/packages/excalidraw/snapping.ts @@ -1,4 +1,3 @@ -import type { InclusiveRange } from "@excalidraw/math"; import { pointFrom, pointRotateRads, @@ -7,26 +6,30 @@ import { rangesOverlap, type GlobalPoint, } from "@excalidraw/math"; + +import type { InclusiveRange } from "@excalidraw/math"; + import { TOOL_TYPE } from "./constants"; -import type { Bounds } from "./element/bounds"; import { getCommonBounds, getDraggedElementsBounds, getElementAbsoluteCoords, } from "./element/bounds"; -import type { MaybeTransformHandleType } from "./element/transformHandles"; import { isBoundToContainer, isFrameLikeElement } from "./element/typeChecks"; -import type { - ElementsMap, - ExcalidrawElement, - NonDeletedExcalidrawElement, -} from "./element/types"; import { getMaximumGroups } from "./groups"; import { KEYS } from "./keys"; import { getSelectedElements, getVisibleAndNonSelectedElements, } from "./scene/selection"; + +import type { Bounds } from "./element/bounds"; +import type { MaybeTransformHandleType } from "./element/transformHandles"; +import type { + ElementsMap, + ExcalidrawElement, + NonDeletedExcalidrawElement, +} from "./element/types"; import type { AppClassProperties, AppState, diff --git a/packages/excalidraw/store.ts b/packages/excalidraw/store.ts index 1343347c..8b006588 100644 --- a/packages/excalidraw/store.ts +++ b/packages/excalidraw/store.ts @@ -3,11 +3,12 @@ import { AppStateChange, ElementsChange } from "./change"; import { ENV } from "./constants"; import { newElementWith } from "./element/mutateElement"; import { deepCopyElement } from "./element/newElement"; -import type { OrderedExcalidrawElement } from "./element/types"; import { Emitter } from "./emitter"; +import { isShallowEqual } from "./utils"; + +import type { OrderedExcalidrawElement } from "./element/types"; import type { AppState, ObservedAppState } from "./types"; import type { ValueOf } from "./utility-types"; -import { isShallowEqual } from "./utils"; // hidden non-enumerable property for runtime checks const hiddenObservedAppStateProp = "__observedAppState"; diff --git a/packages/excalidraw/subset/harfbuzz/harfbuzz-loader.ts b/packages/excalidraw/subset/harfbuzz/harfbuzz-loader.ts index 9a48d19c..120dedb7 100644 --- a/packages/excalidraw/subset/harfbuzz/harfbuzz-loader.ts +++ b/packages/excalidraw/subset/harfbuzz/harfbuzz-loader.ts @@ -7,8 +7,8 @@ * In the future consider separating common utils into a separate shared chunk. */ -import binary from "./harfbuzz-wasm"; import bindings from "./harfbuzz-bindings"; +import binary from "./harfbuzz-wasm"; /** * Lazy loads wasm and respective bindings for font subsetting based on the harfbuzzjs. diff --git a/packages/excalidraw/subset/subset-main.ts b/packages/excalidraw/subset/subset-main.ts index afccf0d2..5f39af99 100644 --- a/packages/excalidraw/subset/subset-main.ts +++ b/packages/excalidraw/subset/subset-main.ts @@ -1,6 +1,6 @@ -import { WorkerPool } from "../workers"; -import { isServerEnv, promiseTry } from "../utils"; import { WorkerInTheMainChunkError, WorkerUrlNotDefinedError } from "../errors"; +import { isServerEnv, promiseTry } from "../utils"; +import { WorkerPool } from "../workers"; import type { Commands } from "./subset-shared.chunk"; diff --git a/packages/excalidraw/subset/subset-shared.chunk.ts b/packages/excalidraw/subset/subset-shared.chunk.ts index b64a3825..4e4b8842 100644 --- a/packages/excalidraw/subset/subset-shared.chunk.ts +++ b/packages/excalidraw/subset/subset-shared.chunk.ts @@ -7,8 +7,8 @@ * In the future consider separating common utils into a separate shared chunk. */ -import loadWoff2 from "./woff2/woff2-loader"; import loadHbSubset from "./harfbuzz/harfbuzz-loader"; +import loadWoff2 from "./woff2/woff2-loader"; /** * Shared commands between the main thread and worker threads. diff --git a/packages/excalidraw/subset/woff2/woff2-loader.ts b/packages/excalidraw/subset/woff2/woff2-loader.ts index 446dc9f8..7d5de309 100644 --- a/packages/excalidraw/subset/woff2/woff2-loader.ts +++ b/packages/excalidraw/subset/woff2/woff2-loader.ts @@ -7,8 +7,8 @@ * In the future consider separating common utils into a separate shared chunk. */ -import binary from "./woff2-wasm"; import bindings from "./woff2-bindings"; +import binary from "./woff2-wasm"; /** * Lazy loads wasm and respective bindings for woff2 compression and decompression. diff --git a/packages/excalidraw/tests/App.test.tsx b/packages/excalidraw/tests/App.test.tsx index ad62706a..8b86477f 100644 --- a/packages/excalidraw/tests/App.test.tsx +++ b/packages/excalidraw/tests/App.test.tsx @@ -1,10 +1,10 @@ import React from "react"; -import * as StaticScene from "../renderer/staticScene"; -import { reseed } from "../random"; -import { render, queryByTestId, unmountComponent } from "../tests/test-utils"; +import { vi } from "vitest"; import { Excalidraw } from "../index"; -import { vi } from "vitest"; +import { reseed } from "../random"; +import * as StaticScene from "../renderer/staticScene"; +import { render, queryByTestId, unmountComponent } from "../tests/test-utils"; const renderStaticScene = vi.spyOn(StaticScene, "renderStaticScene"); diff --git a/packages/excalidraw/tests/MermaidToExcalidraw.test.tsx b/packages/excalidraw/tests/MermaidToExcalidraw.test.tsx index 05727a0f..cedb7048 100644 --- a/packages/excalidraw/tests/MermaidToExcalidraw.test.tsx +++ b/packages/excalidraw/tests/MermaidToExcalidraw.test.tsx @@ -1,9 +1,11 @@ import React from "react"; -import { render, waitFor } from "./test-utils"; -import { Excalidraw } from "../index"; import { expect } from "vitest"; -import { getTextEditor, updateTextEditor } from "./queries/dom"; + +import { Excalidraw } from "../index"; + import { mockMermaidToExcalidraw } from "./helpers/mocks"; +import { getTextEditor, updateTextEditor } from "./queries/dom"; +import { render, waitFor } from "./test-utils"; mockMermaidToExcalidraw({ mockRef: true, diff --git a/packages/excalidraw/tests/actionStyles.test.tsx b/packages/excalidraw/tests/actionStyles.test.tsx index abe4a7c0..2e60000a 100644 --- a/packages/excalidraw/tests/actionStyles.test.tsx +++ b/packages/excalidraw/tests/actionStyles.test.tsx @@ -1,4 +1,6 @@ import React from "react"; + +import { copiedStyles } from "../actions/actionStyles"; import { Excalidraw } from "../index"; import { CODES } from "../keys"; import { API } from "../tests/helpers/api"; @@ -10,7 +12,6 @@ import { screen, togglePopover, } from "../tests/test-utils"; -import { copiedStyles } from "../actions/actionStyles"; const { h } = window; diff --git a/packages/excalidraw/tests/align.test.tsx b/packages/excalidraw/tests/align.test.tsx index 47624e8f..d29e497e 100644 --- a/packages/excalidraw/tests/align.test.tsx +++ b/packages/excalidraw/tests/align.test.tsx @@ -1,10 +1,5 @@ import React from "react"; -import { act, unmountComponent, render } from "./test-utils"; -import { Excalidraw } from "../index"; -import { defaultLang, setLanguage } from "../i18n"; -import { UI, Pointer, Keyboard } from "./helpers/ui"; -import { API } from "./helpers/api"; -import { KEYS } from "../keys"; + import { actionAlignVerticallyCentered, actionAlignHorizontallyCentered, @@ -14,6 +9,13 @@ import { actionAlignLeft, actionAlignRight, } from "../actions"; +import { defaultLang, setLanguage } from "../i18n"; +import { Excalidraw } from "../index"; +import { KEYS } from "../keys"; + +import { API } from "./helpers/api"; +import { UI, Pointer, Keyboard } from "./helpers/ui"; +import { act, unmountComponent, render } from "./test-utils"; const mouse = new Pointer("mouse"); diff --git a/packages/excalidraw/tests/appState.test.tsx b/packages/excalidraw/tests/appState.test.tsx index 4a937cd5..e97c5f3b 100644 --- a/packages/excalidraw/tests/appState.test.tsx +++ b/packages/excalidraw/tests/appState.test.tsx @@ -1,10 +1,13 @@ import React from "react"; -import { fireEvent, queryByTestId, render, waitFor } from "./test-utils"; -import { Excalidraw } from "../index"; -import { API } from "./helpers/api"; + import { getDefaultAppState } from "../appState"; import { EXPORT_DATA_TYPES, MIME_TYPES } from "../constants"; +import { Excalidraw } from "../index"; + +import { API } from "./helpers/api"; import { Pointer, UI } from "./helpers/ui"; +import { fireEvent, queryByTestId, render, waitFor } from "./test-utils"; + import type { ExcalidrawTextElement } from "../element/types"; const { h } = window; diff --git a/packages/excalidraw/tests/binding.test.tsx b/packages/excalidraw/tests/binding.test.tsx index 905a44e7..1c50062c 100644 --- a/packages/excalidraw/tests/binding.test.tsx +++ b/packages/excalidraw/tests/binding.test.tsx @@ -1,13 +1,15 @@ +import { pointFrom } from "@excalidraw/math"; import React from "react"; -import { fireEvent, render } from "./test-utils"; -import { Excalidraw, isLinearElement } from "../index"; -import { UI, Pointer, Keyboard } from "./helpers/ui"; + +import { actionWrapTextInContainer } from "../actions/actionBoundText"; import { getTransformHandles } from "../element/transformHandles"; -import { API } from "./helpers/api"; +import { Excalidraw, isLinearElement } from "../index"; import { KEYS } from "../keys"; -import { actionWrapTextInContainer } from "../actions/actionBoundText"; import { arrayToMap } from "../utils"; -import { pointFrom } from "@excalidraw/math"; + +import { API } from "./helpers/api"; +import { UI, Pointer, Keyboard } from "./helpers/ui"; +import { fireEvent, render } from "./test-utils"; const { h } = window; diff --git a/packages/excalidraw/tests/clipboard.test.tsx b/packages/excalidraw/tests/clipboard.test.tsx index c2c0a5e2..c7e17f49 100644 --- a/packages/excalidraw/tests/clipboard.test.tsx +++ b/packages/excalidraw/tests/clipboard.test.tsx @@ -1,22 +1,25 @@ import React from "react"; import { vi } from "vitest"; + +import { createPasteEvent, serializeAsClipboardJSON } from "../clipboard"; +import { getElementBounds } from "../element"; +import { getLineHeightInPx } from "../element/textMeasurements"; +import { getLineHeight } from "../fonts"; +import { Excalidraw } from "../index"; +import { KEYS } from "../keys"; +import { arrayToMap } from "../utils"; + +import { API } from "./helpers/api"; +import { mockMermaidToExcalidraw } from "./helpers/mocks"; +import { Pointer, Keyboard } from "./helpers/ui"; import { render, waitFor, GlobalTestState, unmountComponent, } from "./test-utils"; -import { Pointer, Keyboard } from "./helpers/ui"; -import { Excalidraw } from "../index"; -import { KEYS } from "../keys"; -import { getLineHeightInPx } from "../element/textMeasurements"; -import { getElementBounds } from "../element"; + import type { NormalizedZoomValue } from "../types"; -import { API } from "./helpers/api"; -import { createPasteEvent, serializeAsClipboardJSON } from "../clipboard"; -import { arrayToMap } from "../utils"; -import { mockMermaidToExcalidraw } from "./helpers/mocks"; -import { getLineHeight } from "../fonts"; const { h } = window; diff --git a/packages/excalidraw/tests/contextmenu.test.tsx b/packages/excalidraw/tests/contextmenu.test.tsx index bb3f415f..7de34951 100644 --- a/packages/excalidraw/tests/contextmenu.test.tsx +++ b/packages/excalidraw/tests/contextmenu.test.tsx @@ -1,4 +1,15 @@ import React from "react"; +import { vi } from "vitest"; + +import { copiedStyles } from "../actions/actionStyles"; +import { Excalidraw } from "../index"; +import { KEYS } from "../keys"; +import { reseed } from "../random"; +import * as StaticScene from "../renderer/staticScene"; +import { setDateTimeForTests } from "../utils"; + +import { API } from "./helpers/api"; +import { UI, Pointer, Keyboard } from "./helpers/ui"; import { render, fireEvent, @@ -12,16 +23,8 @@ import { togglePopover, unmountComponent, } from "./test-utils"; -import { Excalidraw } from "../index"; -import * as StaticScene from "../renderer/staticScene"; -import { reseed } from "../random"; -import { UI, Pointer, Keyboard } from "./helpers/ui"; -import { KEYS } from "../keys"; + import type { ShortcutName } from "../actions/shortcuts"; -import { copiedStyles } from "../actions/actionStyles"; -import { API } from "./helpers/api"; -import { setDateTimeForTests } from "../utils"; -import { vi } from "vitest"; import type { ActionName } from "../actions/types"; const checkpoint = (name: string) => { diff --git a/packages/excalidraw/tests/cropElement.test.tsx b/packages/excalidraw/tests/cropElement.test.tsx index a508f5d6..ddc93e3f 100644 --- a/packages/excalidraw/tests/cropElement.test.tsx +++ b/packages/excalidraw/tests/cropElement.test.tsx @@ -1,15 +1,18 @@ import React from "react"; import { vi } from "vitest"; -import { Keyboard, Pointer, UI } from "./helpers/ui"; -import type { ExcalidrawImageElement, ImageCrop } from "../element/types"; -import { act, GlobalTestState, render, unmountComponent } from "./test-utils"; + import { Excalidraw, exportToCanvas, exportToSvg } from ".."; -import { API } from "./helpers/api"; -import type { NormalizedZoomValue } from "../types"; -import { KEYS } from "../keys"; +import { actionFlipHorizontal, actionFlipVertical } from "../actions"; import { duplicateElement } from "../element"; +import { KEYS } from "../keys"; import { cloneJSON } from "../utils"; -import { actionFlipHorizontal, actionFlipVertical } from "../actions"; + +import { API } from "./helpers/api"; +import { Keyboard, Pointer, UI } from "./helpers/ui"; +import { act, GlobalTestState, render, unmountComponent } from "./test-utils"; + +import type { ExcalidrawImageElement, ImageCrop } from "../element/types"; +import type { NormalizedZoomValue } from "../types"; const { h } = window; const mouse = new Pointer("mouse"); diff --git a/packages/excalidraw/tests/data/reconcile.test.ts b/packages/excalidraw/tests/data/reconcile.test.ts index f0e8105a..35a33956 100644 --- a/packages/excalidraw/tests/data/reconcile.test.ts +++ b/packages/excalidraw/tests/data/reconcile.test.ts @@ -1,13 +1,14 @@ -import type { RemoteExcalidrawElement } from "../../data/reconcile"; import { reconcileElements } from "../../data/reconcile"; +import { syncInvalidIndices } from "../../fractionalIndex"; +import { randomInteger } from "../../random"; +import { cloneJSON } from "../../utils"; + +import type { RemoteExcalidrawElement } from "../../data/reconcile"; import type { ExcalidrawElement, OrderedExcalidrawElement, } from "../../element/types"; -import { syncInvalidIndices } from "../../fractionalIndex"; -import { randomInteger } from "../../random"; import type { AppState } from "../../types"; -import { cloneJSON } from "../../utils"; type Id = string; type ElementLike = { diff --git a/packages/excalidraw/tests/data/restore.test.ts b/packages/excalidraw/tests/data/restore.test.ts index 37a27ac6..52928435 100644 --- a/packages/excalidraw/tests/data/restore.test.ts +++ b/packages/excalidraw/tests/data/restore.test.ts @@ -1,19 +1,21 @@ +import { pointFrom } from "@excalidraw/math"; +import { vi } from "vitest"; + +import { getDefaultAppState } from "../../appState"; +import { DEFAULT_SIDEBAR, FONT_FAMILY, ROUNDNESS } from "../../constants"; import * as restore from "../../data/restore"; +import { newElementWith } from "../../element/mutateElement"; +import * as sizeHelpers from "../../element/sizeHelpers"; +import { API } from "../helpers/api"; + +import type { ImportedDataState } from "../../data/types"; import type { ExcalidrawElement, ExcalidrawFreeDrawElement, ExcalidrawLinearElement, ExcalidrawTextElement, } from "../../element/types"; -import * as sizeHelpers from "../../element/sizeHelpers"; -import { API } from "../helpers/api"; -import { getDefaultAppState } from "../../appState"; -import type { ImportedDataState } from "../../data/types"; import type { NormalizedZoomValue } from "../../types"; -import { DEFAULT_SIDEBAR, FONT_FAMILY, ROUNDNESS } from "../../constants"; -import { newElementWith } from "../../element/mutateElement"; -import { vi } from "vitest"; -import { pointFrom } from "@excalidraw/math"; describe("restoreElements", () => { const mockSizeHelper = vi.spyOn(sizeHelpers, "isInvisiblySmallElement"); diff --git a/packages/excalidraw/tests/dragCreate.test.tsx b/packages/excalidraw/tests/dragCreate.test.tsx index 743ba794..ecdfbcb6 100644 --- a/packages/excalidraw/tests/dragCreate.test.tsx +++ b/packages/excalidraw/tests/dragCreate.test.tsx @@ -1,8 +1,12 @@ import React from "react"; +import { vi } from "vitest"; + import { Excalidraw } from "../index"; -import * as StaticScene from "../renderer/staticScene"; -import * as InteractiveScene from "../renderer/interactiveScene"; import { KEYS } from "../keys"; +import { reseed } from "../random"; +import * as InteractiveScene from "../renderer/interactiveScene"; +import * as StaticScene from "../renderer/staticScene"; + import { render, fireEvent, @@ -10,9 +14,8 @@ import { restoreOriginalGetBoundingClientRect, unmountComponent, } from "./test-utils"; + import type { ExcalidrawLinearElement } from "../element/types"; -import { reseed } from "../random"; -import { vi } from "vitest"; unmountComponent(); diff --git a/packages/excalidraw/tests/elementLocking.test.tsx b/packages/excalidraw/tests/elementLocking.test.tsx index 281c2689..a1ca1468 100644 --- a/packages/excalidraw/tests/elementLocking.test.tsx +++ b/packages/excalidraw/tests/elementLocking.test.tsx @@ -1,12 +1,13 @@ import React from "react"; + +import { actionSelectAll } from "../actions"; +import { mutateElement } from "../element/mutateElement"; +import { t } from "../i18n"; import { Excalidraw } from "../index"; -import { render, unmountComponent } from "../tests/test-utils"; -import { Keyboard, Pointer, UI } from "../tests/helpers/ui"; import { KEYS } from "../keys"; import { API } from "../tests/helpers/api"; -import { actionSelectAll } from "../actions"; -import { t } from "../i18n"; -import { mutateElement } from "../element/mutateElement"; +import { Keyboard, Pointer, UI } from "../tests/helpers/ui"; +import { render, unmountComponent } from "../tests/test-utils"; unmountComponent(); diff --git a/packages/excalidraw/tests/excalidraw.test.tsx b/packages/excalidraw/tests/excalidraw.test.tsx index 6fbcf2ad..0e33f816 100644 --- a/packages/excalidraw/tests/excalidraw.test.tsx +++ b/packages/excalidraw/tests/excalidraw.test.tsx @@ -1,10 +1,12 @@ -import React from "react"; -import { fireEvent, GlobalTestState, toggleMenu, render } from "./test-utils"; -import { Excalidraw, Footer, MainMenu } from "../index"; import { queryByText, queryByTestId } from "@testing-library/react"; +import React from "react"; +import { useMemo } from "react"; + import { THEME } from "../constants"; import { t } from "../i18n"; -import { useMemo } from "react"; +import { Excalidraw, Footer, MainMenu } from "../index"; + +import { fireEvent, GlobalTestState, toggleMenu, render } from "./test-utils"; const { h } = window; diff --git a/packages/excalidraw/tests/export.test.tsx b/packages/excalidraw/tests/export.test.tsx index 3547b297..c1033627 100644 --- a/packages/excalidraw/tests/export.test.tsx +++ b/packages/excalidraw/tests/export.test.tsx @@ -1,18 +1,21 @@ import React from "react"; -import { render, waitFor } from "./test-utils"; -import { Excalidraw } from "../index"; -import { API } from "./helpers/api"; + +import { getDefaultAppState } from "../appState"; +import { SVG_NS } from "../constants"; +import { getDataURL } from "../data/blob"; import { encodePngMetadata } from "../data/image"; import { serializeAsJSON } from "../data/json"; +import { Excalidraw } from "../index"; import { decodeSvgBase64Payload, encodeSvgBase64Payload, exportToSvg, } from "../scene/export"; + +import { API } from "./helpers/api"; +import { render, waitFor } from "./test-utils"; + import type { FileId } from "../element/types"; -import { getDataURL } from "../data/blob"; -import { getDefaultAppState } from "../appState"; -import { SVG_NS } from "../constants"; const { h } = window; diff --git a/packages/excalidraw/tests/fitToContent.test.tsx b/packages/excalidraw/tests/fitToContent.test.tsx index a4f03910..bfd16c4e 100644 --- a/packages/excalidraw/tests/fitToContent.test.tsx +++ b/packages/excalidraw/tests/fitToContent.test.tsx @@ -1,9 +1,10 @@ import React from "react"; -import { act, render } from "./test-utils"; -import { API } from "./helpers/api"; +import { vi } from "vitest"; import { Excalidraw } from "../index"; -import { vi } from "vitest"; + +import { API } from "./helpers/api"; +import { act, render } from "./test-utils"; const { h } = window; diff --git a/packages/excalidraw/tests/fixtures/diagramFixture.ts b/packages/excalidraw/tests/fixtures/diagramFixture.ts index 72b909af..a4fdc156 100644 --- a/packages/excalidraw/tests/fixtures/diagramFixture.ts +++ b/packages/excalidraw/tests/fixtures/diagramFixture.ts @@ -1,4 +1,5 @@ import { VERSIONS } from "../../constants"; + import { diamondFixture, ellipseFixture, diff --git a/packages/excalidraw/tests/fixtures/elementFixture.ts b/packages/excalidraw/tests/fixtures/elementFixture.ts index f0470ec8..a7d8c508 100644 --- a/packages/excalidraw/tests/fixtures/elementFixture.ts +++ b/packages/excalidraw/tests/fixtures/elementFixture.ts @@ -1,5 +1,7 @@ import type { Radians } from "@excalidraw/math"; + import { DEFAULT_FONT_FAMILY } from "../../constants"; + import type { ExcalidrawElement } from "../../element/types"; const elementBase: Omit = { diff --git a/packages/excalidraw/tests/flip.test.tsx b/packages/excalidraw/tests/flip.test.tsx index e3f44b33..9d9f6861 100644 --- a/packages/excalidraw/tests/flip.test.tsx +++ b/packages/excalidraw/tests/flip.test.tsx @@ -1,4 +1,21 @@ +import { pointFrom, type Radians } from "@excalidraw/math"; import React from "react"; +import { vi } from "vitest"; + +import type { LocalPoint } from "@excalidraw/math"; + +import { actionFlipHorizontal, actionFlipVertical } from "../actions"; +import { createPasteEvent } from "../clipboard"; +import { ROUNDNESS } from "../constants"; +import { getElementAbsoluteCoords } from "../element"; +import { newLinearElement } from "../element"; +import { getBoundTextElementPosition } from "../element/textElement"; +import { Excalidraw } from "../index"; +import { KEYS } from "../keys"; +import { arrayToMap, cloneJSON } from "../utils"; + +import { API } from "./helpers/api"; +import { UI, Pointer, Keyboard } from "./helpers/ui"; import { fireEvent, GlobalTestState, @@ -7,10 +24,7 @@ import { unmountComponent, waitFor, } from "./test-utils"; -import { UI, Pointer, Keyboard } from "./helpers/ui"; -import { API } from "./helpers/api"; -import { actionFlipHorizontal, actionFlipVertical } from "../actions"; -import { getElementAbsoluteCoords } from "../element"; + import type { ExcalidrawElement, ExcalidrawImageElement, @@ -18,17 +32,7 @@ import type { ExcalidrawTextElementWithContainer, FileId, } from "../element/types"; -import { newLinearElement } from "../element"; -import { Excalidraw } from "../index"; import type { NormalizedZoomValue } from "../types"; -import { ROUNDNESS } from "../constants"; -import { vi } from "vitest"; -import { KEYS } from "../keys"; -import { getBoundTextElementPosition } from "../element/textElement"; -import { createPasteEvent } from "../clipboard"; -import { arrayToMap, cloneJSON } from "../utils"; -import type { LocalPoint } from "@excalidraw/math"; -import { pointFrom, type Radians } from "@excalidraw/math"; const { h } = window; const mouse = new Pointer("mouse"); diff --git a/packages/excalidraw/tests/fractionalIndex.test.ts b/packages/excalidraw/tests/fractionalIndex.test.ts index b57af016..dbd55bd9 100644 --- a/packages/excalidraw/tests/fractionalIndex.test.ts +++ b/packages/excalidraw/tests/fractionalIndex.test.ts @@ -1,15 +1,18 @@ /* eslint-disable no-lone-blocks */ +import { generateKeyBetween } from "fractional-indexing"; + +import { deepCopyElement } from "../element/newElement"; +import { InvalidFractionalIndexError } from "../errors"; import { syncInvalidIndices, syncMovedIndices, validateFractionalIndices, } from "../fractionalIndex"; -import { API } from "./helpers/api"; import { arrayToMap } from "../utils"; -import { InvalidFractionalIndexError } from "../errors"; + +import { API } from "./helpers/api"; + import type { ExcalidrawElement, FractionalIndex } from "../element/types"; -import { deepCopyElement } from "../element/newElement"; -import { generateKeyBetween } from "fractional-indexing"; describe("sync invalid indices with array order", () => { describe("should NOT sync empty array", () => { diff --git a/packages/excalidraw/tests/helpers/api.ts b/packages/excalidraw/tests/helpers/api.ts index 218f3711..2aa9ee99 100644 --- a/packages/excalidraw/tests/helpers/api.ts +++ b/packages/excalidraw/tests/helpers/api.ts @@ -1,3 +1,32 @@ +import fs from "fs"; +import path from "path"; +import util from "util"; + +import { pointFrom, type LocalPoint, type Radians } from "@excalidraw/math"; + +import { getDefaultAppState } from "../../appState"; +import { createTestHook } from "../../components/App"; +import { DEFAULT_VERTICAL_ALIGN, ROUNDNESS } from "../../constants"; +import { getMimeType } from "../../data/blob"; +import { newElement, newTextElement, newLinearElement } from "../../element"; +import { mutateElement } from "../../element/mutateElement"; +import { + newArrowElement, + newEmbeddableElement, + newFrameElement, + newFreeDrawElement, + newIframeElement, + newImageElement, + newMagicFrameElement, +} from "../../element/newElement"; +import { isLinearElementType } from "../../element/typeChecks"; +import { selectGroupsForSelectedElements } from "../../groups"; +import { getSelectedElements } from "../../scene/selection"; +import { assertNever } from "../../utils"; +import { GlobalTestState, createEvent, fireEvent, act } from "../test-utils"; + +import type { Action } from "../../actions/types"; +import type App from "../../components/App"; import type { ExcalidrawElement, ExcalidrawGenericElement, @@ -13,34 +42,8 @@ import type { ExcalidrawArrowElement, FixedSegment, } from "../../element/types"; -import { newElement, newTextElement, newLinearElement } from "../../element"; -import { DEFAULT_VERTICAL_ALIGN, ROUNDNESS } from "../../constants"; -import { getDefaultAppState } from "../../appState"; -import { GlobalTestState, createEvent, fireEvent, act } from "../test-utils"; -import fs from "fs"; -import util from "util"; -import path from "path"; -import { getMimeType } from "../../data/blob"; -import { - newArrowElement, - newEmbeddableElement, - newFrameElement, - newFreeDrawElement, - newIframeElement, - newImageElement, - newMagicFrameElement, -} from "../../element/newElement"; import type { AppState } from "../../types"; -import { getSelectedElements } from "../../scene/selection"; -import { isLinearElementType } from "../../element/typeChecks"; import type { Mutable } from "../../utility-types"; -import { assertNever } from "../../utils"; -import type App from "../../components/App"; -import { createTestHook } from "../../components/App"; -import type { Action } from "../../actions/types"; -import { mutateElement } from "../../element/mutateElement"; -import { pointFrom, type LocalPoint, type Radians } from "@excalidraw/math"; -import { selectGroupsForSelectedElements } from "../../groups"; const readFile = util.promisify(fs.readFile); // so that window.h is available when App.tsx is not imported as well. diff --git a/packages/excalidraw/tests/helpers/mocks.ts b/packages/excalidraw/tests/helpers/mocks.ts index a87523ec..10e1dee2 100644 --- a/packages/excalidraw/tests/helpers/mocks.ts +++ b/packages/excalidraw/tests/helpers/mocks.ts @@ -1,7 +1,8 @@ -import { vi } from "vitest"; import * as MermaidToExcalidraw from "@excalidraw/mermaid-to-excalidraw"; -import type { parseMermaidToExcalidraw } from "@excalidraw/mermaid-to-excalidraw"; import React from "react"; +import { vi } from "vitest"; + +import type { parseMermaidToExcalidraw } from "@excalidraw/mermaid-to-excalidraw"; export const mockMermaidToExcalidraw = (opts: { parseMermaidToExcalidraw: typeof parseMermaidToExcalidraw; diff --git a/packages/excalidraw/tests/helpers/ui.ts b/packages/excalidraw/tests/helpers/ui.ts index b9b7023c..a72e3fa7 100644 --- a/packages/excalidraw/tests/helpers/ui.ts +++ b/packages/excalidraw/tests/helpers/ui.ts @@ -1,16 +1,11 @@ -import type { - ExcalidrawElement, - ExcalidrawLinearElement, - ExcalidrawTextElement, - ExcalidrawArrowElement, - ExcalidrawRectangleElement, - ExcalidrawEllipseElement, - ExcalidrawDiamondElement, - ExcalidrawTextContainer, - ExcalidrawTextElementWithContainer, - ExcalidrawImageElement, -} from "../../element/types"; -import type { TransformHandleType } from "../../element/transformHandles"; +import { pointFrom, pointRotateRads } from "@excalidraw/math"; + +import type { GlobalPoint, LocalPoint, Radians } from "@excalidraw/math"; + +import { createTestHook } from "../../components/App"; +import { getCommonBounds, getElementPointsCoords } from "../../element/bounds"; +import { cropElement } from "../../element/cropElement"; +import { mutateElement } from "../../element/mutateElement"; import { getTransformHandles, getTransformHandlesFromCoords, @@ -19,23 +14,32 @@ import { type TransformHandle, type TransformHandleDirection, } from "../../element/transformHandles"; -import { KEYS } from "../../keys"; -import { act, fireEvent, GlobalTestState, screen } from "../test-utils"; -import { mutateElement } from "../../element/mutateElement"; -import { API } from "./api"; import { isLinearElement, isFreeDrawElement, isTextElement, isFrameLikeElement, } from "../../element/typeChecks"; -import { getCommonBounds, getElementPointsCoords } from "../../element/bounds"; -import { getTextEditor } from "../queries/dom"; +import { KEYS } from "../../keys"; import { arrayToMap } from "../../utils"; -import { createTestHook } from "../../components/App"; -import type { GlobalPoint, LocalPoint, Radians } from "@excalidraw/math"; -import { pointFrom, pointRotateRads } from "@excalidraw/math"; -import { cropElement } from "../../element/cropElement"; +import { getTextEditor } from "../queries/dom"; +import { act, fireEvent, GlobalTestState, screen } from "../test-utils"; + +import { API } from "./api"; + +import type { TransformHandleType } from "../../element/transformHandles"; +import type { + ExcalidrawElement, + ExcalidrawLinearElement, + ExcalidrawTextElement, + ExcalidrawArrowElement, + ExcalidrawRectangleElement, + ExcalidrawEllipseElement, + ExcalidrawDiamondElement, + ExcalidrawTextContainer, + ExcalidrawTextElementWithContainer, + ExcalidrawImageElement, +} from "../../element/types"; import type { ToolType } from "../../types"; // so that window.h is available when App.tsx is not imported as well. diff --git a/packages/excalidraw/tests/history.test.tsx b/packages/excalidraw/tests/history.test.tsx index ffddec49..6e7066b9 100644 --- a/packages/excalidraw/tests/history.test.tsx +++ b/packages/excalidraw/tests/history.test.tsx @@ -1,32 +1,52 @@ import React from "react"; -import "../global.d.ts"; -import * as StaticScene from "../renderer/staticScene"; import { - GlobalTestState, - act, - assertSelectedElements, - render, - togglePopover, - getCloneByOrigId, -} from "./test-utils"; + queryByText, + fireEvent, + queryByTestId, + waitFor, +} from "@testing-library/react"; +import { vi } from "vitest"; +import { pointFrom } from "@excalidraw/math"; + +import type { LocalPoint, Radians } from "@excalidraw/math"; + +import "../global.d.ts"; import "../../utils/test-utils"; -import { Excalidraw } from "../index"; -import { Keyboard, Pointer, UI } from "./helpers/ui"; -import { API } from "./helpers/api"; -import { getDefaultAppState } from "../appState"; -import { fireEvent, queryByTestId, waitFor } from "@testing-library/react"; + +import { + actionSendBackward, + actionBringForward, + actionSendToBack, +} from "../actions"; import { createUndoAction, createRedoAction } from "../actions/actionHistory"; import { actionToggleViewMode } from "../actions/actionToggleViewMode"; +import { getDefaultAppState } from "../appState"; +import { HistoryEntry } from "../history"; +import { Excalidraw } from "../index"; +import { KEYS } from "../keys"; +import * as StaticScene from "../renderer/staticScene"; import { EXPORT_DATA_TYPES, MIME_TYPES, ORIG_ID } from "../constants"; -import type { AppState } from "../types"; +import { Snapshot, CaptureUpdateAction } from "../store"; import { arrayToMap } from "../utils"; import { COLOR_PALETTE, DEFAULT_ELEMENT_BACKGROUND_COLOR_INDEX, DEFAULT_ELEMENT_STROKE_COLOR_INDEX, } from "../colors"; -import { KEYS } from "../keys"; import { newElementWith } from "../element/mutateElement"; +import { AppStateChange, ElementsChange } from "../change"; + +import { API } from "./helpers/api"; +import { Keyboard, Pointer, UI } from "./helpers/ui"; +import { + GlobalTestState, + act, + assertSelectedElements, + render, + togglePopover, + getCloneByOrigId, +} from "./test-utils"; + import type { ExcalidrawElbowArrowElement, ExcalidrawFrameElement, @@ -37,18 +57,7 @@ import type { FractionalIndex, SceneElementsMap, } from "../element/types"; -import { - actionSendBackward, - actionBringForward, - actionSendToBack, -} from "../actions"; -import { vi } from "vitest"; -import { queryByText } from "@testing-library/react"; -import { HistoryEntry } from "../history"; -import { AppStateChange, ElementsChange } from "../change"; -import { Snapshot, CaptureUpdateAction } from "../store"; -import type { LocalPoint, Radians } from "@excalidraw/math"; -import { pointFrom } from "@excalidraw/math"; +import type { AppState } from "../types"; const { h } = window; diff --git a/packages/excalidraw/tests/library.test.tsx b/packages/excalidraw/tests/library.test.tsx index 7b48407b..b084d835 100644 --- a/packages/excalidraw/tests/library.test.tsx +++ b/packages/excalidraw/tests/library.test.tsx @@ -1,18 +1,20 @@ +import { act, queryByTestId } from "@testing-library/react"; import React from "react"; import { vi } from "vitest"; -import { fireEvent, getCloneByOrigId, render, waitFor } from "./test-utils"; -import { act, queryByTestId } from "@testing-library/react"; -import { Excalidraw } from "../index"; -import { API } from "./helpers/api"; import { MIME_TYPES, ORIG_ID } from "../constants"; -import type { LibraryItem, LibraryItems } from "../types"; -import { UI } from "./helpers/ui"; +import { parseLibraryJSON } from "../data/blob"; import { serializeLibraryAsJSON } from "../data/json"; import { distributeLibraryItemsOnSquareGrid } from "../data/library"; -import type { ExcalidrawGenericElement } from "../element/types"; import { getCommonBoundingBox } from "../element/bounds"; -import { parseLibraryJSON } from "../data/blob"; +import { Excalidraw } from "../index"; + +import { API } from "./helpers/api"; +import { UI } from "./helpers/ui"; +import { fireEvent, getCloneByOrigId, render, waitFor } from "./test-utils"; + +import type { ExcalidrawGenericElement } from "../element/types"; +import type { LibraryItem, LibraryItems } from "../types"; const { h } = window; diff --git a/packages/excalidraw/tests/linearElementEditor.test.tsx b/packages/excalidraw/tests/linearElementEditor.test.tsx index 98d6058c..162dbb3f 100644 --- a/packages/excalidraw/tests/linearElementEditor.test.tsx +++ b/packages/excalidraw/tests/linearElementEditor.test.tsx @@ -1,14 +1,25 @@ +import { pointCenter, pointFrom } from "@excalidraw/math"; +import { act, queryByTestId, queryByText } from "@testing-library/react"; import React from "react"; -import type { - ExcalidrawElement, - ExcalidrawLinearElement, - ExcalidrawTextElementWithContainer, - FontString, -} from "../element/types"; +import { vi } from "vitest"; + +import type { GlobalPoint } from "@excalidraw/math"; + +import { ROUNDNESS, VERTICAL_ALIGN } from "../constants"; +import { LinearElementEditor } from "../element/linearElementEditor"; +import { + getBoundTextElementPosition, + getBoundTextMaxWidth, +} from "../element/textElement"; +import * as textElementUtils from "../element/textElement"; +import { wrapText } from "../element/textWrapping"; import { Excalidraw, mutateElement } from "../index"; +import { KEYS } from "../keys"; import { reseed } from "../random"; -import * as StaticScene from "../renderer/staticScene"; import * as InteractiveCanvas from "../renderer/interactiveScene"; +import * as StaticScene from "../renderer/staticScene"; +import { API } from "../tests/helpers/api"; +import { arrayToMap } from "../utils"; import { Keyboard, Pointer, UI } from "./helpers/ui"; import { @@ -18,21 +29,13 @@ import { GlobalTestState, unmountComponent, } from "./test-utils"; -import { API } from "../tests/helpers/api"; -import { KEYS } from "../keys"; -import { LinearElementEditor } from "../element/linearElementEditor"; -import { act, queryByTestId, queryByText } from "@testing-library/react"; -import { - getBoundTextElementPosition, - getBoundTextMaxWidth, -} from "../element/textElement"; -import * as textElementUtils from "../element/textElement"; -import { ROUNDNESS, VERTICAL_ALIGN } from "../constants"; -import { vi } from "vitest"; -import { arrayToMap } from "../utils"; -import type { GlobalPoint } from "@excalidraw/math"; -import { pointCenter, pointFrom } from "@excalidraw/math"; -import { wrapText } from "../element/textWrapping"; + +import type { + ExcalidrawElement, + ExcalidrawLinearElement, + ExcalidrawTextElementWithContainer, + FontString, +} from "../element/types"; const renderInteractiveScene = vi.spyOn( InteractiveCanvas, diff --git a/packages/excalidraw/tests/move.test.tsx b/packages/excalidraw/tests/move.test.tsx index 528f9554..855496f4 100644 --- a/packages/excalidraw/tests/move.test.tsx +++ b/packages/excalidraw/tests/move.test.tsx @@ -1,19 +1,22 @@ import React from "react"; +import { vi } from "vitest"; + import "../../utils/test-utils"; -import { render, fireEvent, act, unmountComponent } from "./test-utils"; +import { bindOrUnbindLinearElement } from "../element/binding"; import { Excalidraw } from "../index"; -import * as StaticScene from "../renderer/staticScene"; -import * as InteractiveCanvas from "../renderer/interactiveScene"; +import { KEYS } from "../keys"; import { reseed } from "../random"; -import { bindOrUnbindLinearElement } from "../element/binding"; +import * as InteractiveCanvas from "../renderer/interactiveScene"; +import * as StaticScene from "../renderer/staticScene"; + +import { UI, Pointer, Keyboard } from "./helpers/ui"; +import { render, fireEvent, act, unmountComponent } from "./test-utils"; + import type { ExcalidrawLinearElement, NonDeleted, ExcalidrawRectangleElement, } from "../element/types"; -import { UI, Pointer, Keyboard } from "./helpers/ui"; -import { KEYS } from "../keys"; -import { vi } from "vitest"; import type Scene from "../scene/Scene"; unmountComponent(); diff --git a/packages/excalidraw/tests/multiPointCreate.test.tsx b/packages/excalidraw/tests/multiPointCreate.test.tsx index df94eb9d..5cbce496 100644 --- a/packages/excalidraw/tests/multiPointCreate.test.tsx +++ b/packages/excalidraw/tests/multiPointCreate.test.tsx @@ -1,4 +1,12 @@ import React from "react"; +import { vi } from "vitest"; + +import { Excalidraw } from "../index"; +import { KEYS } from "../keys"; +import { reseed } from "../random"; +import * as InteractiveCanvas from "../renderer/interactiveScene"; +import * as StaticScene from "../renderer/staticScene"; + import { render, fireEvent, @@ -6,13 +14,8 @@ import { restoreOriginalGetBoundingClientRect, unmountComponent, } from "./test-utils"; -import { Excalidraw } from "../index"; -import * as StaticScene from "../renderer/staticScene"; -import * as InteractiveCanvas from "../renderer/interactiveScene"; -import { KEYS } from "../keys"; + import type { ExcalidrawLinearElement } from "../element/types"; -import { reseed } from "../random"; -import { vi } from "vitest"; unmountComponent(); diff --git a/packages/excalidraw/tests/packages/events.test.tsx b/packages/excalidraw/tests/packages/events.test.tsx index ad8b3c6d..3e79239c 100644 --- a/packages/excalidraw/tests/packages/events.test.tsx +++ b/packages/excalidraw/tests/packages/events.test.tsx @@ -1,11 +1,13 @@ import React from "react"; import { vi } from "vitest"; + import { Excalidraw, CaptureUpdateAction } from "../../index"; -import type { ExcalidrawImperativeAPI } from "../../types"; import { resolvablePromise } from "../../utils"; -import { render } from "../test-utils"; -import { Pointer } from "../helpers/ui"; import { API } from "../helpers/api"; +import { Pointer } from "../helpers/ui"; +import { render } from "../test-utils"; + +import type { ExcalidrawImperativeAPI } from "../../types"; describe("event callbacks", () => { const h = window.h; diff --git a/packages/excalidraw/tests/queries/toolQueries.ts b/packages/excalidraw/tests/queries/toolQueries.ts index df0afa11..ed168735 100644 --- a/packages/excalidraw/tests/queries/toolQueries.ts +++ b/packages/excalidraw/tests/queries/toolQueries.ts @@ -1,7 +1,9 @@ import { queries, buildQueries } from "@testing-library/react"; -import type { ToolType } from "../../types"; + import { TOOL_TYPE } from "../../constants"; +import type { ToolType } from "../../types"; + const _getAllByToolName = (container: HTMLElement, tool: ToolType | "lock") => { const toolTitle = tool === "lock" ? "lock" : TOOL_TYPE[tool]; return queries.getAllByTestId(container, `toolbar-${toolTitle}`); diff --git a/packages/excalidraw/tests/regressionTests.test.tsx b/packages/excalidraw/tests/regressionTests.test.tsx index a3e45bca..8407f076 100644 --- a/packages/excalidraw/tests/regressionTests.test.tsx +++ b/packages/excalidraw/tests/regressionTests.test.tsx @@ -1,10 +1,13 @@ import React from "react"; -import type { ExcalidrawElement } from "../element/types"; -import { CODES, KEYS } from "../keys"; +import { vi } from "vitest"; + +import { FONT_FAMILY } from "../constants"; import { Excalidraw } from "../index"; +import { CODES, KEYS } from "../keys"; import { reseed } from "../random"; import * as StaticScene from "../renderer/staticScene"; import { setDateTimeForTests } from "../utils"; + import { API } from "./helpers/api"; import { Keyboard, Pointer, UI } from "./helpers/ui"; import { @@ -15,8 +18,8 @@ import { togglePopover, unmountComponent, } from "./test-utils"; -import { FONT_FAMILY } from "../constants"; -import { vi } from "vitest"; + +import type { ExcalidrawElement } from "../element/types"; const { h } = window; diff --git a/packages/excalidraw/tests/resize.test.tsx b/packages/excalidraw/tests/resize.test.tsx index 3ebd8cf8..055b097b 100644 --- a/packages/excalidraw/tests/resize.test.tsx +++ b/packages/excalidraw/tests/resize.test.tsx @@ -1,24 +1,28 @@ +import { pointFrom } from "@excalidraw/math"; import React from "react"; -import { render, unmountComponent } from "./test-utils"; + +import type { LocalPoint } from "@excalidraw/math"; + +import { getElementPointsCoords } from "../element/bounds"; +import { LinearElementEditor } from "../element/linearElementEditor"; +import { resizeSingleElement } from "../element/resizeElements"; +import { isLinearElement } from "../element/typeChecks"; +import { Excalidraw } from "../index"; +import { KEYS } from "../keys"; +import { getSizeFromPoints } from "../points"; import { reseed } from "../random"; +import { arrayToMap } from "../utils"; + +import { API } from "./helpers/api"; import { UI, Keyboard, Pointer } from "./helpers/ui"; +import { render, unmountComponent } from "./test-utils"; + +import type { Bounds } from "../element/bounds"; import type { ExcalidrawElbowArrowElement, ExcalidrawFreeDrawElement, ExcalidrawLinearElement, } from "../element/types"; -import type { Bounds } from "../element/bounds"; -import { getElementPointsCoords } from "../element/bounds"; -import { Excalidraw } from "../index"; -import { API } from "./helpers/api"; -import { KEYS } from "../keys"; -import { isLinearElement } from "../element/typeChecks"; -import { LinearElementEditor } from "../element/linearElementEditor"; -import { arrayToMap } from "../utils"; -import type { LocalPoint } from "@excalidraw/math"; -import { pointFrom } from "@excalidraw/math"; -import { resizeSingleElement } from "../element/resizeElements"; -import { getSizeFromPoints } from "../points"; unmountComponent(); diff --git a/packages/excalidraw/tests/rotate.test.tsx b/packages/excalidraw/tests/rotate.test.tsx index 367313ea..2c678f45 100644 --- a/packages/excalidraw/tests/rotate.test.tsx +++ b/packages/excalidraw/tests/rotate.test.tsx @@ -1,9 +1,11 @@ import React from "react"; -import { render, unmountComponent } from "./test-utils"; +import { expect } from "vitest"; + +import { Excalidraw } from "../index"; import { reseed } from "../random"; + import { UI } from "./helpers/ui"; -import { Excalidraw } from "../index"; -import { expect } from "vitest"; +import { render, unmountComponent } from "./test-utils"; unmountComponent(); diff --git a/packages/excalidraw/tests/scene/export.test.ts b/packages/excalidraw/tests/scene/export.test.ts index 6fd8a8b8..43c37eb2 100644 --- a/packages/excalidraw/tests/scene/export.test.ts +++ b/packages/excalidraw/tests/scene/export.test.ts @@ -1,8 +1,7 @@ -import type { - ExcalidrawTextElement, - FractionalIndex, - NonDeletedExcalidrawElement, -} from "../../element/types"; +import { exportToCanvas, exportToSvg } from "@excalidraw/utils"; + +import { FONT_FAMILY, FRAME_STYLE } from "../../constants"; +import { prepareElementsForExport } from "../../data"; import * as exportUtils from "../../scene/export"; import { diamondFixture, @@ -11,9 +10,12 @@ import { textFixture, } from "../fixtures/elementFixture"; import { API } from "../helpers/api"; -import { exportToCanvas, exportToSvg } from "@excalidraw/utils"; -import { FONT_FAMILY, FRAME_STYLE } from "../../constants"; -import { prepareElementsForExport } from "../../data"; + +import type { + ExcalidrawTextElement, + FractionalIndex, + NonDeletedExcalidrawElement, +} from "../../element/types"; describe("exportToSvg", () => { const ELEMENT_HEIGHT = 100; diff --git a/packages/excalidraw/tests/scroll.test.tsx b/packages/excalidraw/tests/scroll.test.tsx index 1a3f80c1..2ccc4546 100644 --- a/packages/excalidraw/tests/scroll.test.tsx +++ b/packages/excalidraw/tests/scroll.test.tsx @@ -1,14 +1,16 @@ import React from "react"; + +import { Excalidraw } from "../index"; +import { KEYS } from "../keys"; + +import { API } from "./helpers/api"; +import { Keyboard } from "./helpers/ui"; import { mockBoundingClientRect, render, restoreOriginalGetBoundingClientRect, waitFor, } from "./test-utils"; -import { Excalidraw } from "../index"; -import { API } from "./helpers/api"; -import { Keyboard } from "./helpers/ui"; -import { KEYS } from "../keys"; const { h } = window; diff --git a/packages/excalidraw/tests/search.test.tsx b/packages/excalidraw/tests/search.test.tsx index 68ad6582..d3622d4b 100644 --- a/packages/excalidraw/tests/search.test.tsx +++ b/packages/excalidraw/tests/search.test.tsx @@ -1,11 +1,14 @@ import React from "react"; -import { act, render, waitFor } from "./test-utils"; -import { Excalidraw } from "../index"; + import { CANVAS_SEARCH_TAB, CLASSES, DEFAULT_SIDEBAR } from "../constants"; -import { Keyboard } from "./helpers/ui"; +import { Excalidraw } from "../index"; import { KEYS } from "../keys"; -import { updateTextEditor } from "./queries/dom"; + import { API } from "./helpers/api"; +import { Keyboard } from "./helpers/ui"; +import { updateTextEditor } from "./queries/dom"; +import { act, render, waitFor } from "./test-utils"; + import type { ExcalidrawTextElement } from "../element/types"; const { h } = window; diff --git a/packages/excalidraw/tests/selection.test.tsx b/packages/excalidraw/tests/selection.test.tsx index 0b1f6e50..d93d3eff 100644 --- a/packages/excalidraw/tests/selection.test.tsx +++ b/packages/excalidraw/tests/selection.test.tsx @@ -1,4 +1,15 @@ import React from "react"; +import { vi } from "vitest"; + +import { Excalidraw } from "../index"; +import { KEYS } from "../keys"; +import { reseed } from "../random"; +import * as InteractiveCanvas from "../renderer/interactiveScene"; +import * as StaticScene from "../renderer/staticScene"; +import { SHAPES } from "../shapes"; + +import { API } from "./helpers/api"; +import { Keyboard, Pointer, UI } from "./helpers/ui"; import { render, fireEvent, @@ -7,15 +18,6 @@ import { assertSelectedElements, unmountComponent, } from "./test-utils"; -import { Excalidraw } from "../index"; -import * as StaticScene from "../renderer/staticScene"; -import * as InteractiveCanvas from "../renderer/interactiveScene"; -import { KEYS } from "../keys"; -import { reseed } from "../random"; -import { API } from "./helpers/api"; -import { Keyboard, Pointer, UI } from "./helpers/ui"; -import { SHAPES } from "../shapes"; -import { vi } from "vitest"; unmountComponent(); diff --git a/packages/excalidraw/tests/shortcuts.test.tsx b/packages/excalidraw/tests/shortcuts.test.tsx index e02ed019..ee2234ec 100644 --- a/packages/excalidraw/tests/shortcuts.test.tsx +++ b/packages/excalidraw/tests/shortcuts.test.tsx @@ -1,6 +1,8 @@ import React from "react"; -import { KEYS } from "../keys"; + import { Excalidraw } from "../index"; +import { KEYS } from "../keys"; + import { API } from "./helpers/api"; import { Keyboard } from "./helpers/ui"; import { fireEvent, render, waitFor } from "./test-utils"; diff --git a/packages/excalidraw/tests/test-utils.ts b/packages/excalidraw/tests/test-utils.ts index 84936f52..73b34098 100644 --- a/packages/excalidraw/tests/test-utils.ts +++ b/packages/excalidraw/tests/test-utils.ts @@ -1,6 +1,4 @@ import "pepjs"; - -import type { RenderResult, RenderOptions } from "@testing-library/react"; import { act } from "@testing-library/react"; import { render, @@ -9,16 +7,20 @@ import { fireEvent, cleanup, } from "@testing-library/react"; +import ansi from "ansicolor"; -import * as toolQueries from "./queries/toolQueries"; -import type { ImportedDataState } from "../data/types"; import { STORAGE_KEYS } from "../../../excalidraw-app/app_constants"; -import { getSelectedElements } from "../scene/selection"; -import type { ExcalidrawElement } from "../element/types"; -import { UI } from "./helpers/ui"; -import ansi from "ansicolor"; import { ORIG_ID } from "../constants"; +import { getSelectedElements } from "../scene/selection"; import { arrayToMap } from "../utils"; + +import { UI } from "./helpers/ui"; +import * as toolQueries from "./queries/toolQueries"; + +import type { RenderResult, RenderOptions } from "@testing-library/react"; + +import type { ImportedDataState } from "../data/types"; +import type { ExcalidrawElement } from "../element/types"; import type { AllPossibleKeys } from "../utility-types"; export { cleanup as unmountComponent }; diff --git a/packages/excalidraw/tests/tool.test.tsx b/packages/excalidraw/tests/tool.test.tsx index 662c61ba..f70d1ccd 100644 --- a/packages/excalidraw/tests/tool.test.tsx +++ b/packages/excalidraw/tests/tool.test.tsx @@ -1,9 +1,12 @@ import React from "react"; + import { Excalidraw } from "../index"; -import type { ExcalidrawImperativeAPI } from "../types"; import { resolvablePromise } from "../utils"; -import { act, render } from "./test-utils"; + import { Pointer } from "./helpers/ui"; +import { act, render } from "./test-utils"; + +import type { ExcalidrawImperativeAPI } from "../types"; describe("setActiveTool()", () => { const h = window.h; diff --git a/packages/excalidraw/tests/viewMode.test.tsx b/packages/excalidraw/tests/viewMode.test.tsx index 66eca8c7..c190ee0e 100644 --- a/packages/excalidraw/tests/viewMode.test.tsx +++ b/packages/excalidraw/tests/viewMode.test.tsx @@ -1,10 +1,12 @@ import React from "react"; -import { render, GlobalTestState } from "./test-utils"; + +import { CURSOR_TYPE } from "../constants"; import { Excalidraw } from "../index"; import { KEYS } from "../keys"; -import { Keyboard, Pointer, UI } from "./helpers/ui"; -import { CURSOR_TYPE } from "../constants"; + import { API } from "./helpers/api"; +import { Keyboard, Pointer, UI } from "./helpers/ui"; +import { render, GlobalTestState } from "./test-utils"; const mouse = new Pointer("mouse"); const touch = new Pointer("touch"); diff --git a/packages/excalidraw/tests/zindex.test.tsx b/packages/excalidraw/tests/zindex.test.tsx index f15d5593..c8e166af 100644 --- a/packages/excalidraw/tests/zindex.test.tsx +++ b/packages/excalidraw/tests/zindex.test.tsx @@ -1,7 +1,5 @@ import React from "react"; -import { act, getCloneByOrigId, render, unmountComponent } from "./test-utils"; -import { Excalidraw } from "../index"; -import { reseed } from "../random"; + import { actionSendBackward, actionBringForward, @@ -9,14 +7,19 @@ import { actionSendToBack, actionDuplicateSelection, } from "../actions"; -import type { AppState } from "../types"; -import { API } from "./helpers/api"; import { selectGroupsForSelectedElements } from "../groups"; +import { Excalidraw } from "../index"; +import { reseed } from "../random"; + +import { API } from "./helpers/api"; +import { act, getCloneByOrigId, render, unmountComponent } from "./test-utils"; + import type { ExcalidrawElement, ExcalidrawFrameElement, ExcalidrawSelectionElement, } from "../element/types"; +import type { AppState } from "../types"; unmountComponent(); diff --git a/packages/excalidraw/types.ts b/packages/excalidraw/types.ts index 0562736c..64c0ac29 100644 --- a/packages/excalidraw/types.ts +++ b/packages/excalidraw/types.ts @@ -1,5 +1,19 @@ -import type { JSX } from "react"; -import type React from "react"; +import type { Action } from "./actions/types"; +import type { Spreadsheet } from "./charts"; +import type { ClipboardData } from "./clipboard"; +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 { SuggestedBinding } from "./element/binding"; +import type { LinearElementEditor } from "./element/linearElementEditor"; +import type { MaybeTransformHandleType } from "./element/transformHandles"; import type { PointerType, ExcalidrawLinearElement, @@ -24,25 +38,11 @@ import type { OrderedExcalidrawElement, ExcalidrawNonSelectionElement, } from "./element/types"; -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 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 { throttleRAF } from "./utils"; +import type React from "react"; +import type { JSX } from "react"; export type SocketId = string & { _brand: "SocketId" }; diff --git a/packages/excalidraw/utils.ts b/packages/excalidraw/utils.ts index e3e18eb9..84f6637f 100644 --- a/packages/excalidraw/utils.ts +++ b/packages/excalidraw/utils.ts @@ -1,7 +1,7 @@ -import Pool from "es6-promise-pool"; import { average } from "@excalidraw/math"; +import Pool from "es6-promise-pool"; + import { COLOR_PALETTE } from "./colors"; -import type { EVENT } from "./constants"; import { DEFAULT_VERSION, FONT_FAMILY, @@ -9,6 +9,8 @@ import { isDarwin, WINDOWS_EMOJI_FALLBACK_FONT, } from "./constants"; + +import type { EVENT } from "./constants"; import type { ExcalidrawBindableElement, FontFamilyValues, diff --git a/packages/excalidraw/visualdebug.ts b/packages/excalidraw/visualdebug.ts index 862f2cf2..6b701486 100644 --- a/packages/excalidraw/visualdebug.ts +++ b/packages/excalidraw/visualdebug.ts @@ -1,4 +1,3 @@ -import type { Curve } from "@excalidraw/math"; import { isLineSegment, lineSegment, @@ -6,10 +5,14 @@ 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 { isBounds } from "./element/typeChecks"; +import type { Bounds } from "./element/bounds"; + // The global data holder to collect the debug operations declare global { interface Window { diff --git a/packages/excalidraw/zindex.ts b/packages/excalidraw/zindex.ts index 1118ed53..8ffcec5d 100644 --- a/packages/excalidraw/zindex.ts +++ b/packages/excalidraw/zindex.ts @@ -1,15 +1,16 @@ import { isFrameLikeElement } from "./element/typeChecks"; -import type { - ExcalidrawElement, - ExcalidrawFrameLikeElement, -} from "./element/types"; import { syncMovedIndices } from "./fractionalIndex"; import { getElementsInGroup } from "./groups"; import { getSelectedElements } from "./scene"; import Scene from "./scene/Scene"; -import type { AppState } from "./types"; import { arrayToMap, findIndex, findLastIndex } from "./utils"; +import type { + ExcalidrawElement, + ExcalidrawFrameLikeElement, +} from "./element/types"; +import type { AppState } from "./types"; + const isOfTargetFrame = (element: ExcalidrawElement, frameId: string) => { return element.frameId === frameId || element.id === frameId; }; diff --git a/packages/math/angle.ts b/packages/math/angle.ts index 8d473cf5..353dc5da 100644 --- a/packages/math/angle.ts +++ b/packages/math/angle.ts @@ -1,3 +1,5 @@ +import { PRECISION } from "./utils"; + import type { Degrees, GlobalPoint, @@ -5,7 +7,6 @@ import type { PolarCoords, Radians, } from "./types"; -import { PRECISION } from "./utils"; // TODO: Simplify with modulo and fix for angles beyond 4*Math.PI and - 4*Math.PI export const normalizeRadians = (angle: Radians): Radians => { diff --git a/packages/math/curve.test.ts b/packages/math/curve.test.ts index 94670d7a..8d60a734 100644 --- a/packages/math/curve.test.ts +++ b/packages/math/curve.test.ts @@ -1,4 +1,5 @@ import "../utils/test-utils"; + import { curve, curveClosestPoint, diff --git a/packages/math/curve.ts b/packages/math/curve.ts index 9b275cee..cd466bbc 100644 --- a/packages/math/curve.ts +++ b/packages/math/curve.ts @@ -1,7 +1,8 @@ -import type { Bounds } from "../excalidraw/element/bounds"; import { isPoint, pointDistance, pointFrom } from "./point"; import { rectangle, rectangleIntersectLineSegment } from "./rectangle"; + import type { Curve, GlobalPoint, LineSegment, LocalPoint } from "./types"; +import type { Bounds } from "../excalidraw/element/bounds"; /** * diff --git a/packages/math/ellipse.test.ts b/packages/math/ellipse.test.ts index 507cc5a1..bcaab2a5 100644 --- a/packages/math/ellipse.test.ts +++ b/packages/math/ellipse.test.ts @@ -8,6 +8,7 @@ import { import { line } from "./line"; import { pointFrom } from "./point"; import { lineSegment } from "./segment"; + import type { Ellipse, GlobalPoint } from "./types"; describe("point and ellipse", () => { diff --git a/packages/math/ellipse.ts b/packages/math/ellipse.ts index c32def0e..741a77df 100644 --- a/packages/math/ellipse.ts +++ b/packages/math/ellipse.ts @@ -4,13 +4,6 @@ import { pointFromVector, pointsEqual, } from "./point"; -import type { - Ellipse, - GlobalPoint, - Line, - LineSegment, - LocalPoint, -} from "./types"; import { PRECISION } from "./utils"; import { vector, @@ -20,6 +13,14 @@ import { vectorScale, } from "./vector"; +import type { + Ellipse, + GlobalPoint, + Line, + LineSegment, + LocalPoint, +} from "./types"; + /** * Construct an Ellipse object from the parameters * diff --git a/packages/math/line.ts b/packages/math/line.ts index bcb4f6d9..889fa08c 100644 --- a/packages/math/line.ts +++ b/packages/math/line.ts @@ -1,4 +1,5 @@ import { pointFrom } from "./point"; + import type { GlobalPoint, Line, LocalPoint } from "./types"; /** diff --git a/packages/math/point.test.ts b/packages/math/point.test.ts index 89cc4f8f..0ed59ee9 100644 --- a/packages/math/point.test.ts +++ b/packages/math/point.test.ts @@ -1,4 +1,5 @@ import { pointFrom, pointRotateRads } from "./point"; + import type { Radians } from "./types"; describe("rotate", () => { diff --git a/packages/math/point.ts b/packages/math/point.ts index 92df1877..f6234c8e 100644 --- a/packages/math/point.ts +++ b/packages/math/point.ts @@ -1,4 +1,7 @@ import { degreesToRadians } from "./angle"; +import { PRECISION } from "./utils"; +import { vectorFromPoint, vectorScale } from "./vector"; + import type { LocalPoint, GlobalPoint, @@ -6,8 +9,6 @@ import type { Degrees, Vector, } from "./types"; -import { PRECISION } from "./utils"; -import { vectorFromPoint, vectorScale } from "./vector"; /** * Create a properly typed Point instance from the X and Y coordinates. diff --git a/packages/math/polygon.ts b/packages/math/polygon.ts index 783bc4cf..762c82db 100644 --- a/packages/math/polygon.ts +++ b/packages/math/polygon.ts @@ -1,8 +1,9 @@ import { pointsEqual } from "./point"; import { lineSegment, pointOnLineSegment } from "./segment"; -import type { GlobalPoint, LocalPoint, Polygon } from "./types"; import { PRECISION } from "./utils"; +import type { GlobalPoint, LocalPoint, Polygon } from "./types"; + export function polygon( ...points: Point[] ) { diff --git a/packages/math/range.ts b/packages/math/range.ts index d90530cb..dee3d7ed 100644 --- a/packages/math/range.ts +++ b/packages/math/range.ts @@ -1,4 +1,5 @@ import { toBrandedType } from "@excalidraw/excalidraw/utils"; + import type { InclusiveRange } from "./types"; /** diff --git a/packages/math/rectangle.ts b/packages/math/rectangle.ts index 7dde15de..394b5c2f 100644 --- a/packages/math/rectangle.ts +++ b/packages/math/rectangle.ts @@ -1,5 +1,6 @@ import { pointFrom } from "./point"; import { lineSegment, lineSegmentIntersectionPoints } from "./segment"; + import type { GlobalPoint, LineSegment, LocalPoint, Rectangle } from "./types"; export function rectangle

( diff --git a/packages/math/segment.ts b/packages/math/segment.ts index 60943aac..e38978b7 100644 --- a/packages/math/segment.ts +++ b/packages/math/segment.ts @@ -5,7 +5,6 @@ import { pointFromVector, pointRotateRads, } from "./point"; -import type { GlobalPoint, LineSegment, LocalPoint, Radians } from "./types"; import { PRECISION } from "./utils"; import { vectorAdd, @@ -15,6 +14,8 @@ import { vectorSubtract, } from "./vector"; +import type { GlobalPoint, LineSegment, LocalPoint, Radians } from "./types"; + /** * Create a line segment from two points. * diff --git a/packages/utils/bbox.ts b/packages/utils/bbox.ts index 19a1a543..61c75a66 100644 --- a/packages/utils/bbox.ts +++ b/packages/utils/bbox.ts @@ -4,6 +4,7 @@ import { type GlobalPoint, type LocalPoint, } from "@excalidraw/math"; + import type { Bounds } from "@excalidraw/excalidraw/element/bounds"; export type LineSegment

= [P, P]; diff --git a/packages/utils/collision.test.ts b/packages/utils/collision.test.ts index 744bea36..24f96e98 100644 --- a/packages/utils/collision.test.ts +++ b/packages/utils/collision.test.ts @@ -1,4 +1,3 @@ -import type { Curve, Degrees, GlobalPoint } from "@excalidraw/math"; import { curve, degreesToRadians, @@ -7,7 +6,11 @@ import { pointFrom, pointRotateDegs, } from "@excalidraw/math"; + +import type { Curve, Degrees, GlobalPoint } from "@excalidraw/math"; + import { pointOnCurve, pointOnPolyline } from "./collision"; + import type { Polyline } from "./geometry/shape"; describe("point and curve", () => { diff --git a/packages/utils/collision.ts b/packages/utils/collision.ts index fb48f4e4..f9001941 100644 --- a/packages/utils/collision.ts +++ b/packages/utils/collision.ts @@ -1,10 +1,3 @@ -import type { Polycurve, Polyline } from "./geometry/shape"; -import { - pointInEllipse, - pointOnEllipse, - type GeometricShape, -} from "./geometry/shape"; -import type { Curve } from "@excalidraw/math"; import { lineSegment, pointFrom, @@ -17,6 +10,16 @@ import { type Polygon, } from "@excalidraw/math"; +import type { Curve } from "@excalidraw/math"; + +import { + pointInEllipse, + pointOnEllipse, + type GeometricShape, +} from "./geometry/shape"; + +import type { Polycurve, Polyline } from "./geometry/shape"; + // check if the given point is considered on the given shape's border export const isPointOnShape = ( point: Point, diff --git a/packages/utils/export.test.ts b/packages/utils/export.test.ts index e2af763b..86bbe80b 100644 --- a/packages/utils/export.test.ts +++ b/packages/utils/export.test.ts @@ -1,9 +1,9 @@ -import * as utils from "."; +import { MIME_TYPES } from "@excalidraw/excalidraw/constants"; +import * as mockedSceneExportUtils from "@excalidraw/excalidraw/scene/export"; import { diagramFactory } from "@excalidraw/excalidraw/tests/fixtures/diagramFixture"; import { vi } from "vitest"; -import * as mockedSceneExportUtils from "@excalidraw/excalidraw/scene/export"; -import { MIME_TYPES } from "@excalidraw/excalidraw/constants"; +import * as utils from "."; const exportToSvgSpy = vi.spyOn(mockedSceneExportUtils, "exportToSvg"); diff --git a/packages/utils/export.ts b/packages/utils/export.ts index 22287ce7..6de25c62 100644 --- a/packages/utils/export.ts +++ b/packages/utils/export.ts @@ -1,23 +1,24 @@ +import { getDefaultAppState } from "@excalidraw/excalidraw/appState"; +import { + copyBlobToClipboardAsPng, + copyTextToSystemClipboard, + copyToClipboard, +} from "@excalidraw/excalidraw/clipboard"; +import { MIME_TYPES } from "@excalidraw/excalidraw/constants"; +import { encodePngMetadata } from "@excalidraw/excalidraw/data/image"; +import { serializeAsJSON } from "@excalidraw/excalidraw/data/json"; +import { restore } from "@excalidraw/excalidraw/data/restore"; import { exportToCanvas as _exportToCanvas, exportToSvg as _exportToSvg, } from "@excalidraw/excalidraw/scene/export"; -import { getDefaultAppState } from "@excalidraw/excalidraw/appState"; -import type { AppState, BinaryFiles } from "@excalidraw/excalidraw/types"; + import type { ExcalidrawElement, ExcalidrawFrameLikeElement, NonDeleted, } from "@excalidraw/excalidraw/element/types"; -import { restore } from "@excalidraw/excalidraw/data/restore"; -import { MIME_TYPES } from "@excalidraw/excalidraw/constants"; -import { encodePngMetadata } from "@excalidraw/excalidraw/data/image"; -import { serializeAsJSON } from "@excalidraw/excalidraw/data/json"; -import { - copyBlobToClipboardAsPng, - copyTextToSystemClipboard, - copyToClipboard, -} from "@excalidraw/excalidraw/clipboard"; +import type { AppState, BinaryFiles } from "@excalidraw/excalidraw/types"; export { MIME_TYPES }; diff --git a/packages/utils/geometry/geometry.test.ts b/packages/utils/geometry/geometry.test.ts index e9ad067f..6ddab71b 100644 --- a/packages/utils/geometry/geometry.test.ts +++ b/packages/utils/geometry/geometry.test.ts @@ -1,9 +1,3 @@ -import type { - GlobalPoint, - LineSegment, - Polygon, - Radians, -} from "@excalidraw/math"; import { pointFrom, lineSegment, @@ -13,6 +7,14 @@ import { polygonIncludesPoint, segmentsIntersectAt, } from "@excalidraw/math"; + +import type { + GlobalPoint, + LineSegment, + Polygon, + Radians, +} from "@excalidraw/math"; + import { pointInEllipse, pointOnEllipse, type Ellipse } from "./shape"; describe("point and line", () => { diff --git a/packages/utils/geometry/shape.ts b/packages/utils/geometry/shape.ts index 10fc06e3..ea3cde3f 100644 --- a/packages/utils/geometry/shape.ts +++ b/packages/utils/geometry/shape.ts @@ -12,7 +12,8 @@ * to pure shapes */ -import type { Curve, LineSegment, Polygon, Radians } from "@excalidraw/math"; +import { getElementAbsoluteCoords } from "@excalidraw/excalidraw/element"; +import { invariant } from "@excalidraw/excalidraw/utils"; import { curve, lineSegment, @@ -32,7 +33,8 @@ import { type GlobalPoint, type LocalPoint, } from "@excalidraw/math"; -import { getElementAbsoluteCoords } from "@excalidraw/excalidraw/element"; +import { pointsOnBezierCurves } from "points-on-curve"; + import type { ElementsMap, ExcalidrawBindableElement, @@ -49,9 +51,9 @@ import type { ExcalidrawSelectionElement, ExcalidrawTextElement, } from "@excalidraw/excalidraw/element/types"; -import { pointsOnBezierCurves } from "points-on-curve"; +import type { Curve, LineSegment, Polygon, Radians } from "@excalidraw/math"; + import type { Drawable, Op } from "roughjs/bin/core"; -import { invariant } from "@excalidraw/excalidraw/utils"; // a polyline (made up term here) is a line consisting of other line segments // this corresponds to a straight line element in the editor but it could also diff --git a/packages/utils/utils.unmocked.test.ts b/packages/utils/utils.unmocked.test.ts index 341adef9..417eabda 100644 --- a/packages/utils/utils.unmocked.test.ts +++ b/packages/utils/utils.unmocked.test.ts @@ -1,8 +1,10 @@ +import { decodePngMetadata } from "@excalidraw/excalidraw/data/image"; +import { decodeSvgBase64Payload } from "@excalidraw/excalidraw/scene/export"; +import { API } from "@excalidraw/excalidraw/tests/helpers/api"; + import type { ImportedDataState } from "@excalidraw/excalidraw/data/types"; + import * as utils from "./index"; -import { API } from "@excalidraw/excalidraw/tests/helpers/api"; -import { decodeSvgBase64Payload } from "@excalidraw/excalidraw/scene/export"; -import { decodePngMetadata } from "@excalidraw/excalidraw/data/image"; // NOTE this test file is using the actual API, unmocked. Hence splitting it // from the other test file, because I couldn't figure out how to test diff --git a/packages/utils/withinBounds.test.ts b/packages/utils/withinBounds.test.ts index 85354d74..b07d0bc3 100644 --- a/packages/utils/withinBounds.test.ts +++ b/packages/utils/withinBounds.test.ts @@ -1,5 +1,7 @@ -import type { Bounds } from "@excalidraw/excalidraw/element/bounds"; import { API } from "@excalidraw/excalidraw/tests/helpers/api"; + +import type { Bounds } from "@excalidraw/excalidraw/element/bounds"; + import { elementPartiallyOverlapsWithOrContainsBBox, elementsOverlappingBBox, diff --git a/packages/utils/withinBounds.ts b/packages/utils/withinBounds.ts index 8d52eb3a..71bc7896 100644 --- a/packages/utils/withinBounds.ts +++ b/packages/utils/withinBounds.ts @@ -1,9 +1,4 @@ -import type { - ExcalidrawElement, - ExcalidrawFreeDrawElement, - ExcalidrawLinearElement, - NonDeletedExcalidrawElement, -} from "@excalidraw/excalidraw/element/types"; +import { getElementBounds } from "@excalidraw/excalidraw/element/bounds"; import { isArrowElement, isExcalidrawElement, @@ -11,10 +6,7 @@ import { isLinearElement, isTextElement, } from "@excalidraw/excalidraw/element/typeChecks"; -import type { Bounds } from "@excalidraw/excalidraw/element/bounds"; -import { getElementBounds } from "@excalidraw/excalidraw/element/bounds"; import { arrayToMap } from "@excalidraw/excalidraw/utils"; -import type { LocalPoint } from "@excalidraw/math"; import { rangeIncludesValue, pointFrom, @@ -22,6 +14,15 @@ import { rangeInclusive, } from "@excalidraw/math"; +import type { Bounds } from "@excalidraw/excalidraw/element/bounds"; +import type { + ExcalidrawElement, + ExcalidrawFreeDrawElement, + ExcalidrawLinearElement, + NonDeletedExcalidrawElement, +} from "@excalidraw/excalidraw/element/types"; +import type { LocalPoint } from "@excalidraw/math"; + type Element = NonDeletedExcalidrawElement; type Elements = readonly NonDeletedExcalidrawElement[]; diff --git a/scripts/autorelease.js b/scripts/autorelease.js index f506cf13..6ca5af21 100644 --- a/scripts/autorelease.js +++ b/scripts/autorelease.js @@ -1,5 +1,6 @@ -const fs = require("fs"); const { exec, execSync } = require("child_process"); +const fs = require("fs"); + const core = require("@actions/core"); const excalidrawDir = `${__dirname}/../packages/excalidraw`; diff --git a/scripts/buildMath.js b/scripts/buildMath.js index fd2f820e..ba421b48 100644 --- a/scripts/buildMath.js +++ b/scripts/buildMath.js @@ -1,4 +1,5 @@ const path = require("path"); + const { build } = require("esbuild"); const { sassPlugin } = require("esbuild-sass-plugin"); diff --git a/scripts/buildPackage.js b/scripts/buildPackage.js index 653af50f..3dd15eec 100644 --- a/scripts/buildPackage.js +++ b/scripts/buildPackage.js @@ -1,6 +1,8 @@ const path = require("path"); + const { build } = require("esbuild"); const { sassPlugin } = require("esbuild-sass-plugin"); + const { parseEnvVariables } = require("../packages/excalidraw/env.cjs"); const ENV_VARS = { diff --git a/scripts/buildUtils.js b/scripts/buildUtils.js index 65b94738..b5718f57 100644 --- a/scripts/buildUtils.js +++ b/scripts/buildUtils.js @@ -1,6 +1,8 @@ const path = require("path"); + const { build } = require("esbuild"); const { sassPlugin } = require("esbuild-sass-plugin"); + const { woff2ServerPlugin } = require("./woff2/woff2-esbuild-plugins"); // contains all dependencies bundled inside diff --git a/scripts/prerelease.js b/scripts/prerelease.js index 3b8080d3..005a6cf5 100644 --- a/scripts/prerelease.js +++ b/scripts/prerelease.js @@ -1,5 +1,6 @@ const fs = require("fs"); const util = require("util"); + const exec = util.promisify(require("child_process").exec); const updateChangelog = require("./updateChangelog"); diff --git a/scripts/woff2/woff2-esbuild-plugins.js b/scripts/woff2/woff2-esbuild-plugins.js index 19ebafc9..2116dd05 100644 --- a/scripts/woff2/woff2-esbuild-plugins.js +++ b/scripts/woff2/woff2-esbuild-plugins.js @@ -1,9 +1,10 @@ +const { execSync } = require("child_process"); const fs = require("fs"); const path = require("path"); -const { execSync } = require("child_process"); -const which = require("which"); -const wawoff = require("wawoff2"); + const { Font } = require("fonteditor-core"); +const wawoff = require("wawoff2"); +const which = require("which"); /** * Custom esbuild plugin to: diff --git a/setupTests.ts b/setupTests.ts index 20d2cc51..2aec616b 100644 --- a/setupTests.ts +++ b/setupTests.ts @@ -1,11 +1,13 @@ +import fs from "fs"; + // vitest.setup.ts import "vitest-canvas-mock"; import "@testing-library/jest-dom"; -import fs from "fs"; import { vi } from "vitest"; + import polyfill from "./packages/excalidraw/polyfill"; -import { testPolyfills } from "./packages/excalidraw/tests/helpers/polyfills"; import { yellow } from "./packages/excalidraw/tests/helpers/colorize"; +import { testPolyfills } from "./packages/excalidraw/tests/helpers/polyfills"; // mock for pep.js not working with setPointerCapture() HTMLElement.prototype.setPointerCapture = vi.fn(); diff --git a/yarn.lock b/yarn.lock index 23e08784..ccd0827f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5354,7 +5354,7 @@ eslint-plugin-flowtype@^8.0.3: lodash "^4.17.21" string-natural-compare "^3.0.1" -eslint-plugin-import@^2.25.3: +eslint-plugin-import@2.31.0, eslint-plugin-import@^2.25.3: version "2.31.0" resolved "https://registry.yarnpkg.com/eslint-plugin-import/-/eslint-plugin-import-2.31.0.tgz#310ce7e720ca1d9c0bb3f69adfd1c6bdd7d9e0e7" integrity sha512-ixmkI62Rbc2/w8Vfxyh1jQRTdRTF52VxwRVHl/ykPAmqG+Nb7/kNn+byLP0LxPgI7zWA16Jt82SybJInmMia3A==