@zsviczian/excalidraw 0.10.0-obsidian-38 → 0.10.0-obsidian-42

package/types/components/icons.d.ts

@@ -168,4 +168,5 @@ export declare const TextAlignRightIcon: React.MemoExoticComponent<({ theme }: {
     theme: Theme;
 }) => JSX.Element>;
 export declare const publishIcon: JSX.Element;
+export declare const editIcon: JSX.Element;
 export {};

package/types/constants.d.ts

@@ -98,6 +98,7 @@ export declare const TOAST_TIMEOUT = 5000;
 export declare const VERSION_TIMEOUT = 30000;
 export declare const SCROLL_TIMEOUT = 100;
 export declare const ZOOM_STEP = 0.1;
+export declare const HYPERLINK_TOOLTIP_DELAY = 300;
 export declare const IDLE_THRESHOLD = 60000;
 export declare const ACTIVE_THRESHOLD = 3000;
 export declare const MODES: {

package/types/element/Hyperlink.d.ts

@@ -0,0 +1,117 @@
+/// <reference types="react" />
+import { AppState, ExcalidrawProps } from "../types";
+import { NonDeletedExcalidrawElement } from "./types";
+import { Bounds } from "./bounds";
+import "./Hyperlink.scss";
+export declare const EXTERNAL_LINK_IMG: HTMLImageElement;
+export declare const Hyperlink: ({ element, appState, setAppState, onLinkOpen, }: {
+    element: NonDeletedExcalidrawElement;
+    appState: AppState;
+    setAppState: React.Component<any, AppState>["setState"];
+    onLinkOpen: ExcalidrawProps["onLinkOpen"];
+}) => JSX.Element | null;
+export declare const normalizeLink: (link: string) => string;
+export declare const isLocalLink: (link: string | null) => boolean;
+export declare const actionLink: {
+    name: "link";
+    perform: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => false | {
+        elements: readonly import("./types").ExcalidrawElement[];
+        appState: {
+            showHyperlinkPopup: "editor";
+            isLoading: boolean;
+            errorMessage: string | null;
+            draggingElement: NonDeletedExcalidrawElement | null;
+            resizingElement: NonDeletedExcalidrawElement | null;
+            multiElement: import("./types").NonDeleted<import("./types").ExcalidrawLinearElement> | null;
+            selectionElement: NonDeletedExcalidrawElement | null;
+            isBindingEnabled: boolean;
+            startBoundElement: import("./types").NonDeleted<import("./types").ExcalidrawBindableElement> | null;
+            suggestedBindings: import("./binding").SuggestedBinding[];
+            editingElement: NonDeletedExcalidrawElement | null;
+            editingLinearElement: import("./linearElementEditor").LinearElementEditor | null;
+            elementType: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw";
+            elementLocked: boolean;
+            penMode: boolean;
+            penDetected: boolean;
+            exportBackground: boolean;
+            exportEmbedScene: boolean;
+            exportWithDarkMode: boolean;
+            exportScale: number;
+            currentItemStrokeColor: string;
+            currentItemBackgroundColor: string;
+            currentItemFillStyle: import("./types").FillStyle;
+            currentItemStrokeWidth: number;
+            currentItemStrokeStyle: import("./types").StrokeStyle;
+            currentItemRoughness: number;
+            currentItemOpacity: number;
+            currentItemFontFamily: number;
+            currentItemFontSize: number;
+            currentItemTextAlign: import("./types").TextAlign;
+            currentItemStrokeSharpness: import("./types").StrokeSharpness;
+            currentItemStartArrowhead: import("./types").Arrowhead | null;
+            currentItemEndArrowhead: import("./types").Arrowhead | null;
+            currentItemLinearStrokeSharpness: import("./types").StrokeSharpness;
+            viewBackgroundColor: string;
+            scrollX: number;
+            scrollY: number;
+            cursorButton: "up" | "down";
+            scrolledOutside: boolean;
+            name: string;
+            isResizing: boolean;
+            isRotating: boolean;
+            zoom: Readonly<{
+                value: import("../types").NormalizedZoomValue;
+            }>;
+            openMenu: "canvas" | "shape" | null;
+            openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
+            lastPointerDownWith: import("./types").PointerType;
+            selectedElementIds: {
+                [id: string]: boolean;
+            };
+            previousSelectedElementIds: {
+                [id: string]: boolean;
+            };
+            shouldCacheIgnoreZoom: boolean;
+            showHelpDialog: boolean;
+            toastMessage: string | null;
+            zenModeEnabled: boolean;
+            theme: string;
+            gridSize: number | null;
+            viewModeEnabled: boolean;
+            selectedGroupIds: {
+                [groupId: string]: boolean;
+            };
+            editingGroupId: string | null;
+            width: number;
+            height: number;
+            offsetTop: number;
+            offsetLeft: number;
+            isLibraryOpen: boolean;
+            fileHandle: import("browser-fs-access").FileSystemHandle | null;
+            collaborators: Map<string, import("../types").Collaborator>;
+            showStats: boolean;
+            currentChartType: import("./types").ChartType;
+            pasteDialog: {
+                shown: false;
+                data: null;
+            } | {
+                shown: true;
+                data: import("../charts").Spreadsheet;
+            };
+            pendingImageElement: import("./types").NonDeleted<import("./types").ExcalidrawImageElement> | null;
+        };
+        commitToHistory: true;
+    };
+    keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
+    contextItemLabel: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => "labels.link.edit" | "labels.link.create";
+    contextItemPredicate: (elements: readonly import("./types").ExcalidrawElement[], appState: AppState) => boolean;
+    PanelComponent: ({ elements, appState, updateData }: import("react").PropsWithChildren<import("../actions/types").PanelComponentProps>) => JSX.Element;
+} & {
+    keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
+};
+export declare const getContextMenuLabel: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState) => "labels.link.edit" | "labels.link.create";
+export declare const getLinkHandleFromCoords: ([x1, y1, x2, y2]: Bounds, angle: number, appState: AppState) => [x: number, y: number, width: number, height: number];
+export declare const isPointHittingLinkIcon: (element: NonDeletedExcalidrawElement, appState: AppState, [x, y]: readonly [number, number]) => boolean;
+export declare const showHyperlinkTooltip: (element: NonDeletedExcalidrawElement, appState: AppState) => void;
+export declare const hideHyperlinkToolip: () => void;
+export declare const shouldHideLinkPopup: (element: NonDeletedExcalidrawElement, appState: AppState, [clientX, clientY]: readonly [number, number]) => Boolean;

package/types/element/collision.d.ts

@@ -5,6 +5,7 @@ import { AppState } from "../types";
 export declare const hitTest: (element: NonDeletedExcalidrawElement, appState: AppState, x: number, y: number) => boolean;
 export declare const isHittingElementBoundingBoxWithoutHittingElement: (element: NonDeletedExcalidrawElement, appState: AppState, x: number, y: number) => boolean;
 export declare const isHittingElementNotConsideringBoundingBox: (element: NonDeletedExcalidrawElement, appState: AppState, point: readonly [number, number]) => boolean;
+export declare const isPointHittingElementBoundingBox: (element: NonDeleted<ExcalidrawElement>, [x, y]: readonly [number, number], threshold: number) => boolean;
 export declare const bindingBorderTest: (element: NonDeleted<ExcalidrawBindableElement>, { x, y }: {
     x: number;
     y: number;

package/types/element/linearElementEditor.d.ts

@@ -98,7 +98,8 @@ export declare class LinearElementEditor {
             editingElement: import("./types").NonDeletedExcalidrawElement | null;
             elementType: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw";
             elementLocked: boolean;
-            penLocked: boolean;
+            penMode: boolean;
+            penDetected: boolean;
             exportBackground: boolean;
             exportEmbedScene: boolean;
             exportWithDarkMode: boolean;
@@ -127,10 +128,6 @@ export declare class LinearElementEditor {
             isRotating: boolean;
             zoom: Readonly<{
                 value: import("../types").NormalizedZoomValue;
-                translation: Readonly<{
-                    x: number;
-                    y: number;
-                }>;
             }>;
             openMenu: "canvas" | "shape" | null;
             openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
@@ -146,7 +143,6 @@ export declare class LinearElementEditor {
             toastMessage: string | null;
             zenModeEnabled: boolean;
             theme: string;
-            /** @returns whether point was dragged */
             gridSize: number | null;
             viewModeEnabled: boolean;
             selectedGroupIds: {
@@ -170,6 +166,7 @@ export declare class LinearElementEditor {
                 data: import("../charts").Spreadsheet;
             };
             pendingImageElement: NonDeleted<import("./types").ExcalidrawImageElement> | null;
+            showHyperlinkPopup: false | "info" | "editor";
         };
     };
     static deletePoints(element: NonDeleted<ExcalidrawLinearElement>, pointIndices: readonly number[]): void;

package/types/element/newElement.d.ts

@@ -1,6 +1,6 @@
 import { ExcalidrawElement, ExcalidrawImageElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawGenericElement, NonDeleted, TextAlign, GroupId, VerticalAlign, Arrowhead, ExcalidrawFreeDrawElement, FontFamilyValues, ExcalidrawRectangleElement } from "../element/types";
 import { AppState } from "../types";
-declare type ElementConstructorOpts = MarkOptional<Omit<ExcalidrawGenericElement, "id" | "type" | "isDeleted" | "updated">, "width" | "height" | "angle" | "groupIds" | "boundElements" | "seed" | "version" | "versionNonce">;
+declare type ElementConstructorOpts = MarkOptional<Omit<ExcalidrawGenericElement, "id" | "type" | "isDeleted" | "updated">, "width" | "height" | "angle" | "groupIds" | "boundElements" | "seed" | "version" | "versionNonce" | "link">;
 export declare const newElement: (opts: {
     type: ExcalidrawGenericElement["type"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawGenericElement>;
@@ -13,11 +13,12 @@ export declare const newTextElement: (opts: {
     verticalAlign: VerticalAlign;
     containerId?: ExcalidrawRectangleElement["id"];
 } & ElementConstructorOpts) => NonDeleted<ExcalidrawTextElement>;
-export declare const updateTextElement: (element: ExcalidrawTextElement, { text, isDeleted, originalText, rawText, }: {
+export declare const updateTextElement: (element: ExcalidrawTextElement, { text, isDeleted, originalText, rawText, link, }: {
     text: string;
     isDeleted?: boolean | undefined;
     originalText: string;
     rawText?: string | undefined;
+    link?: string | undefined;
 }) => ExcalidrawTextElement;
 export declare const newFreeDrawElement: (opts: {
     type: "freedraw";

package/types/element/textWysiwyg.d.ts

@@ -1,9 +1,7 @@
 import { ExcalidrawElement, ExcalidrawTextElement } from "./types";
-import { AppState } from "../types";
 import App from "../components/App";
-export declare const textWysiwyg: ({ id, appState, onChange, onSubmit, getViewportCoords, element, canvas, excalidrawContainer, app, }: {
+export declare const textWysiwyg: ({ id, onChange, onSubmit, getViewportCoords, element, canvas, excalidrawContainer, app, }: {
     id: ExcalidrawElement["id"];
-    appState: AppState;
     onChange?: ((text: string) => void) | undefined;
     onSubmit: (data: {
         text: string;

package/types/element/types.d.ts

@@ -50,6 +50,7 @@ declare type _ExcalidrawElementBase = Readonly<{
     }>[] | null;
     /** epoch (ms) timestamp of last element update */
     updated: number;
+    link: string | null;
 }>;
 export declare type ExcalidrawSelectionElement = _ExcalidrawElementBase & {
     type: "selection";

package/types/keys.d.ts

@@ -58,6 +58,7 @@ export declare const KEYS: {
     readonly X: "x";
     readonly Y: "y";
     readonly Z: "z";
+    readonly K: "k";
 };
 export declare type Key = keyof typeof KEYS;
 export declare const isArrowKey: (key: string) => boolean;

package/types/renderer/renderElement.d.ts

@@ -12,6 +12,7 @@ export interface ExcalidrawElementWithCanvas {
     canvasOffsetX: number;
     canvasOffsetY: number;
 }
+export declare const DEFAULT_LINK_SIZE = 14;
 export declare const getShapeForElement: (element: ExcalidrawElement) => Drawable | Drawable[] | null | undefined;
 export declare const invalidateShapeForElement: (element: ExcalidrawElement) => boolean;
 export declare const generateRoughOptions: (element: ExcalidrawElement, continuousPath?: boolean) => Options;

package/types/scene/index.d.ts

@@ -2,4 +2,4 @@ export { isOverScrollBars } from "./scrollbars";
 export { isSomeElementSelected, getElementsWithinSelection, getCommonAttributeOfSelectedElements, getSelectedElements, getTargetElements, } from "./selection";
 export { calculateScrollCenter } from "./scroll";
 export { hasBackground, hasStrokeWidth, hasStrokeStyle, canHaveArrowheads, canChangeSharpness, getElementAtPosition, getElementContainingPosition, hasText, getElementsAtPosition, } from "./comparisons";
-export { getNormalizedZoom, getNewZoom } from "./zoom";
+export { getNormalizedZoom } from "./zoom";

package/types/scene/zoom.d.ts

@@ -1,6 +1,13 @@
-import { NormalizedZoomValue, PointerCoords, Zoom } from "../types";
-export declare const getNewZoom: (newZoomValue: NormalizedZoomValue, prevZoom: Zoom, canvasOffset: {
-    left: number;
-    top: number;
-}, zoomOnViewportPoint?: PointerCoords) => Zoom;
+import { AppState, NormalizedZoomValue } from "../types";
 export declare const getNormalizedZoom: (zoom: number) => NormalizedZoomValue;
+export declare const getStateForZoom: ({ viewportX, viewportY, nextZoom, }: {
+    viewportX: number;
+    viewportY: number;
+    nextZoom: NormalizedZoomValue;
+}, appState: AppState) => {
+    scrollX: number;
+    scrollY: number;
+    zoom: {
+        value: NormalizedZoomValue;
+    };
+};

package/types/types.d.ts

@@ -55,7 +55,8 @@ export declare type AppState = {
     editingLinearElement: LinearElementEditor | null;
     elementType: typeof SHAPES[number]["value"];
     elementLocked: boolean;
-    penLocked: boolean;
+    penMode: boolean;
+    penDetected: boolean;
     exportBackground: boolean;
     exportEmbedScene: boolean;
     exportWithDarkMode: boolean;
@@ -124,16 +125,13 @@ export declare type AppState = {
     };
     /** imageElement waiting to be placed on canvas */
     pendingImageElement: NonDeleted<ExcalidrawImageElement> | null;
+    showHyperlinkPopup: false | "info" | "editor";
 };
 export declare type NormalizedZoomValue = number & {
     _brand: "normalizedZoom";
 };
 export declare type Zoom = Readonly<{
     value: NormalizedZoomValue;
-    translation: Readonly<{
-        x: number;
-        y: number;
-    }>;
 }>;
 export declare type PointerCoords = Readonly<{
     x: number;
@@ -203,9 +201,10 @@ export interface ExcalidrawProps {
     onLibraryChange?: (libraryItems: LibraryItems) => void | Promise<any>;
     autoFocus?: boolean;
     onBeforeTextEdit?: (textElement: ExcalidrawTextElement) => string;
-    onBeforeTextSubmit?: (textElement: ExcalidrawTextElement, textToSubmit: string, originalText: string, isDeleted: boolean) => [string, string];
+    onBeforeTextSubmit?: (textElement: ExcalidrawTextElement, textToSubmit: string, originalText: string, isDeleted: boolean) => [string, string, string];
     generateIdForFile?: (file: File) => string | Promise<string>;
     onThemeChange?: (newTheme: string) => void;
+    onLinkOpen?: (link: string, event: MouseEvent) => void;
 }
 export declare type SceneData = {
     elements?: ImportedDataState["elements"];
@@ -334,9 +333,10 @@ export declare type ExcalidrawImperativeAPI = {
     ready: true;
     id: string;
     setLocalFont: (showOnPanel: boolean) => void;
-    sendBackward: (elements: ExcalidrawElement[]) => void;
-    bringForward: (elements: ExcalidrawElement[]) => void;
-    sendToBack: (elements: ExcalidrawElement[]) => void;
-    bringToFront: (elements: ExcalidrawElement[]) => void;
+    selectElements: (elements: readonly ExcalidrawElement[]) => void;
+    sendBackward: (elements: readonly ExcalidrawElement[]) => void;
+    bringForward: (elements: readonly ExcalidrawElement[]) => void;
+    sendToBack: (elements: readonly ExcalidrawElement[]) => void;
+    bringToFront: (elements: readonly ExcalidrawElement[]) => void;
 };
 export {};