@zsviczian/excalidraw 0.10.0-obsidian-36 → 0.10.0-obsidian-40

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (40) hide show
  1. package/dist/excalidraw.development.js +85 -31
  2. package/dist/excalidraw.production.min.js +1 -1
  3. package/package.json +1 -1
  4. package/types/actions/actionAddToLibrary.d.ts +9 -12
  5. package/types/actions/actionCanvas.d.ts +45 -53
  6. package/types/actions/actionClipboard.d.ts +15 -20
  7. package/types/actions/actionDeleteSelected.d.ts +9 -12
  8. package/types/actions/actionExport.d.ts +27 -36
  9. package/types/actions/actionFinalize.d.ts +6 -8
  10. package/types/actions/actionMenu.d.ts +9 -12
  11. package/types/actions/actionProperties.d.ts +36 -48
  12. package/types/actions/actionStyles.d.ts +3 -4
  13. package/types/actions/actionToggleGridMode.d.ts +3 -4
  14. package/types/actions/actionToggleStats.d.ts +3 -4
  15. package/types/actions/actionToggleViewMode.d.ts +3 -4
  16. package/types/actions/actionToggleZenMode.d.ts +3 -4
  17. package/types/actions/actionUnbindText.d.ts +11 -0
  18. package/types/actions/index.d.ts +2 -0
  19. package/types/actions/shortcuts.d.ts +1 -1
  20. package/types/actions/types.d.ts +2 -2
  21. package/types/appState.d.ts +0 -4
  22. package/types/components/App.d.ts +14 -0
  23. package/types/components/ContextMenu.d.ts +3 -0
  24. package/types/components/LayerUI.d.ts +2 -1
  25. package/types/components/MobileMenu.d.ts +2 -1
  26. package/types/components/PenModeButton.d.ts +13 -0
  27. package/types/components/Tooltip.d.ts +7 -0
  28. package/types/components/icons.d.ts +1 -0
  29. package/types/constants.d.ts +1 -0
  30. package/types/element/Hyperlink.d.ts +116 -0
  31. package/types/element/collision.d.ts +1 -0
  32. package/types/element/linearElementEditor.d.ts +3 -4
  33. package/types/element/newElement.d.ts +1 -1
  34. package/types/element/textWysiwyg.d.ts +1 -3
  35. package/types/element/types.d.ts +1 -0
  36. package/types/keys.d.ts +1 -0
  37. package/types/renderer/renderElement.d.ts +1 -0
  38. package/types/scene/index.d.ts +1 -1
  39. package/types/scene/zoom.d.ts +12 -5
  40. package/types/types.d.ts +9 -4
@@ -1,5 +1,12 @@
1
1
  import "./Tooltip.scss";
2
2
  import React from "react";
3
+ export declare const getTooltipDiv: () => HTMLDivElement;
4
+ export declare const updateTooltipPosition: (tooltip: HTMLDivElement, item: {
5
+ left: number;
6
+ top: number;
7
+ width: number;
8
+ height: number;
9
+ }, position?: "bottom" | "top") => void;
3
10
  declare type TooltipProps = {
4
11
  children: React.ReactNode;
5
12
  label: string;
@@ -168,4 +168,5 @@ export declare const TextAlignRightIcon: React.MemoExoticComponent<({ theme }: {
168
168
  theme: Theme;
169
169
  }) => JSX.Element>;
170
170
  export declare const publishIcon: JSX.Element;
171
+ export declare const editIcon: JSX.Element;
171
172
  export {};
@@ -98,6 +98,7 @@ export declare const TOAST_TIMEOUT = 5000;
98
98
  export declare const VERSION_TIMEOUT = 30000;
99
99
  export declare const SCROLL_TIMEOUT = 100;
100
100
  export declare const ZOOM_STEP = 0.1;
101
+ export declare const HYPERLINK_TOOLTIP_DELAY = 300;
101
102
  export declare const IDLE_THRESHOLD = 60000;
102
103
  export declare const ACTIVE_THRESHOLD = 3000;
103
104
  export declare const MODES: {
@@ -0,0 +1,116 @@
1
+ /// <reference types="react" />
2
+ import { AppState } from "../types";
3
+ import { NonDeletedExcalidrawElement } from "./types";
4
+ import { Bounds } from "./bounds";
5
+ import "./Hyperlink.scss";
6
+ export declare const EXTERNAL_LINK_IMG: HTMLImageElement;
7
+ export declare const Hyperlink: ({ element, appState, setAppState, }: {
8
+ element: NonDeletedExcalidrawElement;
9
+ appState: AppState;
10
+ setAppState: React.Component<any, AppState>["setState"];
11
+ }) => JSX.Element | null;
12
+ export declare const normalizeLink: (link: string) => string;
13
+ export declare const isLocalLink: (link: string | null) => boolean;
14
+ export declare const actionLink: {
15
+ name: "link";
16
+ perform: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => false | {
17
+ elements: readonly import("./types").ExcalidrawElement[];
18
+ appState: {
19
+ showHyperlinkPopup: "editor";
20
+ isLoading: boolean;
21
+ errorMessage: string | null;
22
+ draggingElement: NonDeletedExcalidrawElement | null;
23
+ resizingElement: NonDeletedExcalidrawElement | null;
24
+ multiElement: import("./types").NonDeleted<import("./types").ExcalidrawLinearElement> | null;
25
+ selectionElement: NonDeletedExcalidrawElement | null;
26
+ isBindingEnabled: boolean;
27
+ startBoundElement: import("./types").NonDeleted<import("./types").ExcalidrawBindableElement> | null;
28
+ suggestedBindings: import("./binding").SuggestedBinding[];
29
+ editingElement: NonDeletedExcalidrawElement | null;
30
+ editingLinearElement: import("./linearElementEditor").LinearElementEditor | null;
31
+ elementType: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw";
32
+ elementLocked: boolean;
33
+ penMode: boolean;
34
+ penDetected: boolean;
35
+ exportBackground: boolean;
36
+ exportEmbedScene: boolean;
37
+ exportWithDarkMode: boolean;
38
+ exportScale: number;
39
+ currentItemStrokeColor: string;
40
+ currentItemBackgroundColor: string;
41
+ currentItemFillStyle: import("./types").FillStyle;
42
+ currentItemStrokeWidth: number;
43
+ currentItemStrokeStyle: import("./types").StrokeStyle;
44
+ currentItemRoughness: number;
45
+ currentItemOpacity: number;
46
+ currentItemFontFamily: number;
47
+ currentItemFontSize: number;
48
+ currentItemTextAlign: import("./types").TextAlign;
49
+ currentItemStrokeSharpness: import("./types").StrokeSharpness;
50
+ currentItemStartArrowhead: import("./types").Arrowhead | null;
51
+ currentItemEndArrowhead: import("./types").Arrowhead | null;
52
+ currentItemLinearStrokeSharpness: import("./types").StrokeSharpness;
53
+ viewBackgroundColor: string;
54
+ scrollX: number;
55
+ scrollY: number;
56
+ cursorButton: "up" | "down";
57
+ scrolledOutside: boolean;
58
+ name: string;
59
+ isResizing: boolean;
60
+ isRotating: boolean;
61
+ zoom: Readonly<{
62
+ value: import("../types").NormalizedZoomValue;
63
+ }>;
64
+ openMenu: "canvas" | "shape" | null;
65
+ openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
66
+ lastPointerDownWith: import("./types").PointerType;
67
+ selectedElementIds: {
68
+ [id: string]: boolean;
69
+ };
70
+ previousSelectedElementIds: {
71
+ [id: string]: boolean;
72
+ };
73
+ shouldCacheIgnoreZoom: boolean;
74
+ showHelpDialog: boolean;
75
+ toastMessage: string | null;
76
+ zenModeEnabled: boolean;
77
+ theme: string;
78
+ gridSize: number | null;
79
+ viewModeEnabled: boolean;
80
+ selectedGroupIds: {
81
+ [groupId: string]: boolean;
82
+ };
83
+ editingGroupId: string | null;
84
+ width: number;
85
+ height: number;
86
+ offsetTop: number;
87
+ offsetLeft: number;
88
+ isLibraryOpen: boolean;
89
+ fileHandle: import("browser-fs-access").FileSystemHandle | null;
90
+ collaborators: Map<string, import("../types").Collaborator>;
91
+ showStats: boolean;
92
+ currentChartType: import("./types").ChartType;
93
+ pasteDialog: {
94
+ shown: false;
95
+ data: null;
96
+ } | {
97
+ shown: true;
98
+ data: import("../charts").Spreadsheet;
99
+ };
100
+ pendingImageElement: import("./types").NonDeleted<import("./types").ExcalidrawImageElement> | null;
101
+ };
102
+ commitToHistory: true;
103
+ };
104
+ keyTest: (event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean;
105
+ contextItemLabel: (elements: readonly import("./types").ExcalidrawElement[], appState: Readonly<AppState>) => "labels.link.edit" | "labels.link.create";
106
+ contextItemPredicate: (elements: readonly import("./types").ExcalidrawElement[], appState: AppState) => boolean;
107
+ PanelComponent: ({ elements, appState, updateData }: import("react").PropsWithChildren<import("../actions/types").PanelComponentProps>) => JSX.Element;
108
+ } & {
109
+ keyTest?: ((event: KeyboardEvent | import("react").KeyboardEvent<Element>) => boolean) | undefined;
110
+ };
111
+ export declare const getContextMenuLabel: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState) => "labels.link.edit" | "labels.link.create";
112
+ export declare const getLinkHandleFromCoords: ([x1, y1, x2, y2]: Bounds, angle: number, appState: AppState) => [x: number, y: number, width: number, height: number];
113
+ export declare const isPointHittingLinkIcon: (element: NonDeletedExcalidrawElement, appState: AppState, [x, y]: readonly [number, number]) => boolean;
114
+ export declare const showHyperlinkTooltip: (element: NonDeletedExcalidrawElement, appState: AppState) => void;
115
+ export declare const hideHyperlinkToolip: () => void;
116
+ export declare const shouldHideLinkPopup: (element: NonDeletedExcalidrawElement, appState: AppState, [clientX, clientY]: readonly [number, number]) => Boolean;
@@ -5,6 +5,7 @@ import { AppState } from "../types";
5
5
  export declare const hitTest: (element: NonDeletedExcalidrawElement, appState: AppState, x: number, y: number) => boolean;
6
6
  export declare const isHittingElementBoundingBoxWithoutHittingElement: (element: NonDeletedExcalidrawElement, appState: AppState, x: number, y: number) => boolean;
7
7
  export declare const isHittingElementNotConsideringBoundingBox: (element: NonDeletedExcalidrawElement, appState: AppState, point: readonly [number, number]) => boolean;
8
+ export declare const isPointHittingElementBoundingBox: (element: NonDeleted<ExcalidrawElement>, [x, y]: readonly [number, number], threshold: number) => boolean;
8
9
  export declare const bindingBorderTest: (element: NonDeleted<ExcalidrawBindableElement>, { x, y }: {
9
10
  x: number;
10
11
  y: number;
@@ -98,6 +98,8 @@ export declare class LinearElementEditor {
98
98
  editingElement: import("./types").NonDeletedExcalidrawElement | null;
99
99
  elementType: "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "image" | "freedraw";
100
100
  elementLocked: boolean;
101
+ penMode: boolean;
102
+ penDetected: boolean;
101
103
  exportBackground: boolean;
102
104
  exportEmbedScene: boolean;
103
105
  exportWithDarkMode: boolean;
@@ -126,10 +128,6 @@ export declare class LinearElementEditor {
126
128
  isRotating: boolean;
127
129
  zoom: Readonly<{
128
130
  value: import("../types").NormalizedZoomValue;
129
- translation: Readonly<{
130
- x: number;
131
- y: number;
132
- }>;
133
131
  }>;
134
132
  openMenu: "canvas" | "shape" | null;
135
133
  openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
@@ -168,6 +166,7 @@ export declare class LinearElementEditor {
168
166
  data: import("../charts").Spreadsheet;
169
167
  };
170
168
  pendingImageElement: NonDeleted<import("./types").ExcalidrawImageElement> | null;
169
+ showHyperlinkPopup: false | "info" | "editor";
171
170
  };
172
171
  };
173
172
  static deletePoints(element: NonDeleted<ExcalidrawLinearElement>, pointIndices: readonly number[]): void;
@@ -1,6 +1,6 @@
1
1
  import { ExcalidrawElement, ExcalidrawImageElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawGenericElement, NonDeleted, TextAlign, GroupId, VerticalAlign, Arrowhead, ExcalidrawFreeDrawElement, FontFamilyValues, ExcalidrawRectangleElement } from "../element/types";
2
2
  import { AppState } from "../types";
3
- declare type ElementConstructorOpts = MarkOptional<Omit<ExcalidrawGenericElement, "id" | "type" | "isDeleted" | "updated">, "width" | "height" | "angle" | "groupIds" | "boundElements" | "seed" | "version" | "versionNonce">;
3
+ declare type ElementConstructorOpts = MarkOptional<Omit<ExcalidrawGenericElement, "id" | "type" | "isDeleted" | "updated">, "width" | "height" | "angle" | "groupIds" | "boundElements" | "seed" | "version" | "versionNonce" | "link">;
4
4
  export declare const newElement: (opts: {
5
5
  type: ExcalidrawGenericElement["type"];
6
6
  } & ElementConstructorOpts) => NonDeleted<ExcalidrawGenericElement>;
@@ -1,9 +1,7 @@
1
1
  import { ExcalidrawElement, ExcalidrawTextElement } from "./types";
2
- import { AppState } from "../types";
3
2
  import App from "../components/App";
4
- export declare const textWysiwyg: ({ id, appState, onChange, onSubmit, getViewportCoords, element, canvas, excalidrawContainer, app, }: {
3
+ export declare const textWysiwyg: ({ id, onChange, onSubmit, getViewportCoords, element, canvas, excalidrawContainer, app, }: {
5
4
  id: ExcalidrawElement["id"];
6
- appState: AppState;
7
5
  onChange?: ((text: string) => void) | undefined;
8
6
  onSubmit: (data: {
9
7
  text: string;
@@ -50,6 +50,7 @@ declare type _ExcalidrawElementBase = Readonly<{
50
50
  }>[] | null;
51
51
  /** epoch (ms) timestamp of last element update */
52
52
  updated: number;
53
+ link: string | null;
53
54
  }>;
54
55
  export declare type ExcalidrawSelectionElement = _ExcalidrawElementBase & {
55
56
  type: "selection";
package/types/keys.d.ts CHANGED
@@ -58,6 +58,7 @@ export declare const KEYS: {
58
58
  readonly X: "x";
59
59
  readonly Y: "y";
60
60
  readonly Z: "z";
61
+ readonly K: "k";
61
62
  };
62
63
  export declare type Key = keyof typeof KEYS;
63
64
  export declare const isArrowKey: (key: string) => boolean;
@@ -12,6 +12,7 @@ export interface ExcalidrawElementWithCanvas {
12
12
  canvasOffsetX: number;
13
13
  canvasOffsetY: number;
14
14
  }
15
+ export declare const DEFAULT_LINK_SIZE = 14;
15
16
  export declare const getShapeForElement: (element: ExcalidrawElement) => Drawable | Drawable[] | null | undefined;
16
17
  export declare const invalidateShapeForElement: (element: ExcalidrawElement) => boolean;
17
18
  export declare const generateRoughOptions: (element: ExcalidrawElement, continuousPath?: boolean) => Options;
@@ -2,4 +2,4 @@ export { isOverScrollBars } from "./scrollbars";
2
2
  export { isSomeElementSelected, getElementsWithinSelection, getCommonAttributeOfSelectedElements, getSelectedElements, getTargetElements, } from "./selection";
3
3
  export { calculateScrollCenter } from "./scroll";
4
4
  export { hasBackground, hasStrokeWidth, hasStrokeStyle, canHaveArrowheads, canChangeSharpness, getElementAtPosition, getElementContainingPosition, hasText, getElementsAtPosition, } from "./comparisons";
5
- export { getNormalizedZoom, getNewZoom } from "./zoom";
5
+ export { getNormalizedZoom } from "./zoom";
@@ -1,6 +1,13 @@
1
- import { NormalizedZoomValue, PointerCoords, Zoom } from "../types";
2
- export declare const getNewZoom: (newZoomValue: NormalizedZoomValue, prevZoom: Zoom, canvasOffset: {
3
- left: number;
4
- top: number;
5
- }, zoomOnViewportPoint?: PointerCoords) => Zoom;
1
+ import { AppState, NormalizedZoomValue } from "../types";
6
2
  export declare const getNormalizedZoom: (zoom: number) => NormalizedZoomValue;
3
+ export declare const getStateForZoom: ({ viewportX, viewportY, nextZoom, }: {
4
+ viewportX: number;
5
+ viewportY: number;
6
+ nextZoom: NormalizedZoomValue;
7
+ }, appState: AppState) => {
8
+ scrollX: number;
9
+ scrollY: number;
10
+ zoom: {
11
+ value: NormalizedZoomValue;
12
+ };
13
+ };
package/types/types.d.ts CHANGED
@@ -55,6 +55,8 @@ export declare type AppState = {
55
55
  editingLinearElement: LinearElementEditor | null;
56
56
  elementType: typeof SHAPES[number]["value"];
57
57
  elementLocked: boolean;
58
+ penMode: boolean;
59
+ penDetected: boolean;
58
60
  exportBackground: boolean;
59
61
  exportEmbedScene: boolean;
60
62
  exportWithDarkMode: boolean;
@@ -123,16 +125,13 @@ export declare type AppState = {
123
125
  };
124
126
  /** imageElement waiting to be placed on canvas */
125
127
  pendingImageElement: NonDeleted<ExcalidrawImageElement> | null;
128
+ showHyperlinkPopup: false | "info" | "editor";
126
129
  };
127
130
  export declare type NormalizedZoomValue = number & {
128
131
  _brand: "normalizedZoom";
129
132
  };
130
133
  export declare type Zoom = Readonly<{
131
134
  value: NormalizedZoomValue;
132
- translation: Readonly<{
133
- x: number;
134
- y: number;
135
- }>;
136
135
  }>;
137
136
  export declare type PointerCoords = Readonly<{
138
137
  x: number;
@@ -205,6 +204,7 @@ export interface ExcalidrawProps {
205
204
  onBeforeTextSubmit?: (textElement: ExcalidrawTextElement, textToSubmit: string, originalText: string, isDeleted: boolean) => [string, string];
206
205
  generateIdForFile?: (file: File) => string | Promise<string>;
207
206
  onThemeChange?: (newTheme: string) => void;
207
+ handleLinkNavigation?: (url: string) => void;
208
208
  }
209
209
  export declare type SceneData = {
210
210
  elements?: ImportedDataState["elements"];
@@ -333,5 +333,10 @@ export declare type ExcalidrawImperativeAPI = {
333
333
  ready: true;
334
334
  id: string;
335
335
  setLocalFont: (showOnPanel: boolean) => void;
336
+ selectElements: (elements: readonly ExcalidrawElement[]) => void;
337
+ sendBackward: (elements: readonly ExcalidrawElement[]) => void;
338
+ bringForward: (elements: readonly ExcalidrawElement[]) => void;
339
+ sendToBack: (elements: readonly ExcalidrawElement[]) => void;
340
+ bringToFront: (elements: readonly ExcalidrawElement[]) => void;
336
341
  };
337
342
  export {};