@zsviczian/excalidraw 0.15.2-obsidian-6 → 0.15.2-obsidian-8

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 (36) hide show
  1. package/dist/excalidraw.development.js +37 -37
  2. package/dist/excalidraw.production.min.js +1 -1
  3. package/package.json +1 -1
  4. package/types/actions/actionAddToLibrary.d.ts +36 -21
  5. package/types/actions/actionBoundText.d.ts +22 -11
  6. package/types/actions/actionCanvas.d.ts +138 -78
  7. package/types/actions/actionClipboard.d.ts +57 -32
  8. package/types/actions/actionDeleteSelected.d.ts +33 -18
  9. package/types/actions/actionElementLock.d.ts +21 -11
  10. package/types/actions/actionExport.d.ts +108 -63
  11. package/types/actions/actionFinalize.d.ts +24 -14
  12. package/types/actions/actionFrame.d.ts +35 -20
  13. package/types/actions/actionLinearEditor.d.ts +12 -7
  14. package/types/actions/actionMenu.d.ts +36 -21
  15. package/types/actions/actionProperties.d.ts +156 -91
  16. package/types/actions/actionStyles.d.ts +12 -7
  17. package/types/actions/actionToggleGridMode.d.ts +12 -7
  18. package/types/actions/actionToggleStats.d.ts +12 -7
  19. package/types/actions/actionToggleViewMode.d.ts +12 -7
  20. package/types/actions/actionToggleZenMode.d.ts +12 -7
  21. package/types/actions/types.d.ts +1 -1
  22. package/types/appState.d.ts +5 -5
  23. package/types/components/App.d.ts +13 -8
  24. package/types/element/Hyperlink.d.ts +12 -7
  25. package/types/element/collision.d.ts +2 -2
  26. package/types/element/embeddable.d.ts +171 -0
  27. package/types/element/iframe.d.ts +4 -4
  28. package/types/element/linearElementEditor.d.ts +12 -7
  29. package/types/element/newElement.d.ts +4 -4
  30. package/types/element/typeChecks.d.ts +4 -4
  31. package/types/element/types.d.ts +6 -6
  32. package/types/groups.d.ts +1 -1
  33. package/types/history.d.ts +3 -3
  34. package/types/scene/selection.d.ts +11 -1
  35. package/types/types.d.ts +19 -14
  36. package/types/utils.d.ts +1 -1
@@ -1,14 +1,14 @@
1
- import { ExcalidrawElement, ExcalidrawImageElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawGenericElement, NonDeleted, TextAlign, GroupId, VerticalAlign, Arrowhead, ExcalidrawFreeDrawElement, FontFamilyValues, ExcalidrawTextContainer, ExcalidrawFrameElement, ExcalidrawIFrameElement } from "../element/types";
1
+ import { ExcalidrawElement, ExcalidrawImageElement, ExcalidrawTextElement, ExcalidrawLinearElement, ExcalidrawGenericElement, NonDeleted, TextAlign, GroupId, VerticalAlign, Arrowhead, ExcalidrawFreeDrawElement, FontFamilyValues, ExcalidrawTextContainer, ExcalidrawFrameElement, ExcalidrawEmbeddableElement } from "../element/types";
2
2
  import { AppState } from "../types";
3
3
  import { MarkOptional, Mutable } from "../utility-types";
4
4
  type ElementConstructorOpts = MarkOptional<Omit<ExcalidrawGenericElement, "id" | "type" | "isDeleted" | "updated">, "width" | "height" | "angle" | "groupIds" | "frameId" | "boundElements" | "seed" | "version" | "versionNonce" | "link" | "strokeStyle" | "fillStyle" | "strokeColor" | "backgroundColor" | "roughness" | "strokeWidth" | "roundness" | "locked" | "opacity">;
5
5
  export declare const newElement: (opts: {
6
6
  type: ExcalidrawGenericElement["type"];
7
7
  } & ElementConstructorOpts) => NonDeleted<ExcalidrawGenericElement>;
8
- export declare const newIFrameElement: (opts: {
9
- type: "iframe";
8
+ export declare const newEmbeddableElement: (opts: {
9
+ type: "embeddable";
10
10
  validated: boolean | undefined;
11
- } & ElementConstructorOpts) => NonDeleted<ExcalidrawIFrameElement>;
11
+ } & ElementConstructorOpts) => NonDeleted<ExcalidrawEmbeddableElement>;
12
12
  export declare const newFrameElement: (opts: ElementConstructorOpts) => NonDeleted<ExcalidrawFrameElement>;
13
13
  export declare const newTextElement: (opts: {
14
14
  text: string;
@@ -1,19 +1,19 @@
1
1
  import { AppState } from "../types";
2
2
  import { MarkNonNullable } from "../utility-types";
3
- import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawIFrameElement, ExcalidrawLinearElement, ExcalidrawBindableElement, ExcalidrawGenericElement, ExcalidrawFreeDrawElement, InitializedExcalidrawImageElement, ExcalidrawImageElement, ExcalidrawTextElementWithContainer, ExcalidrawTextContainer, ExcalidrawFrameElement, RoundnessType } from "./types";
3
+ import { ExcalidrawElement, ExcalidrawTextElement, ExcalidrawEmbeddableElement, ExcalidrawLinearElement, ExcalidrawBindableElement, ExcalidrawGenericElement, ExcalidrawFreeDrawElement, InitializedExcalidrawImageElement, ExcalidrawImageElement, ExcalidrawTextElementWithContainer, ExcalidrawTextContainer, ExcalidrawFrameElement, RoundnessType } from "./types";
4
4
  export declare const isGenericElement: (element: ExcalidrawElement | null) => element is ExcalidrawGenericElement;
5
5
  export declare const isInitializedImageElement: (element: ExcalidrawElement | null) => element is InitializedExcalidrawImageElement;
6
6
  export declare const isImageElement: (element: ExcalidrawElement | null) => element is ExcalidrawImageElement;
7
- export declare const isIFrameElement: (element: ExcalidrawElement | null | undefined) => element is ExcalidrawIFrameElement;
7
+ export declare const isEmbeddableElement: (element: ExcalidrawElement | null | undefined) => element is ExcalidrawEmbeddableElement;
8
8
  export declare const isTextElement: (element: ExcalidrawElement | null) => element is ExcalidrawTextElement;
9
9
  export declare const isFrameElement: (element: ExcalidrawElement | null) => element is ExcalidrawFrameElement;
10
10
  export declare const isFreeDrawElement: (element?: ExcalidrawElement | null) => element is ExcalidrawFreeDrawElement;
11
11
  export declare const isFreeDrawElementType: (elementType: ExcalidrawElement["type"]) => boolean;
12
12
  export declare const isLinearElement: (element?: ExcalidrawElement | null) => element is ExcalidrawLinearElement;
13
13
  export declare const isArrowElement: (element?: ExcalidrawElement | null) => element is ExcalidrawLinearElement;
14
- export declare const isLinearElementType: (elementType: AppState["activeTool"]["type"] | "iframe") => boolean;
14
+ export declare const isLinearElementType: (elementType: AppState["activeTool"]["type"]) => boolean;
15
15
  export declare const isBindingElement: (element?: ExcalidrawElement | null, includeLocked?: boolean) => element is ExcalidrawLinearElement;
16
- export declare const isBindingElementType: (elementType: AppState["activeTool"]["type"] | "iframe") => boolean;
16
+ export declare const isBindingElementType: (elementType: AppState["activeTool"]["type"]) => boolean;
17
17
  export declare const isBindableElement: (element: ExcalidrawElement | null, includeLocked?: boolean) => element is ExcalidrawBindableElement;
18
18
  export declare const isTextBindableContainer: (element: ExcalidrawElement | null, includeLocked?: boolean) => element is ExcalidrawTextContainer;
19
19
  export declare const isExcalidrawElement: (element: any) => boolean;
@@ -73,16 +73,16 @@ export type ExcalidrawDiamondElement = _ExcalidrawElementBase & {
73
73
  export type ExcalidrawEllipseElement = _ExcalidrawElementBase & {
74
74
  type: "ellipse";
75
75
  };
76
- export type ExcalidrawIFrameElement = _ExcalidrawElementBase & Readonly<{
76
+ export type ExcalidrawEmbeddableElement = _ExcalidrawElementBase & Readonly<{
77
77
  /**
78
- * indicates whether the iframe src (url) has been validated for rendering.
78
+ * indicates whether the embeddable src (url) has been validated for rendering.
79
79
  * nullish value indicates that the validation is pending. We reset the
80
80
  * value on each restore (or url change) so that we can guarantee
81
81
  * the validation came from a trusted source (the editor). Also because we
82
82
  * may not have access to host-app supplied url validator during restore.
83
83
  */
84
84
  validated?: boolean;
85
- type: "iframe";
85
+ type: "embeddable";
86
86
  }>;
87
87
  export type ExcalidrawImageElement = _ExcalidrawElementBase & Readonly<{
88
88
  type: "image";
@@ -100,7 +100,7 @@ export type ExcalidrawFrameElement = _ExcalidrawElementBase & {
100
100
  /**
101
101
  * These are elements that don't have any additional properties.
102
102
  */
103
- export type ExcalidrawGenericElement = ExcalidrawSelectionElement | ExcalidrawRectangleElement | ExcalidrawIFrameElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement;
103
+ export type ExcalidrawGenericElement = ExcalidrawSelectionElement | ExcalidrawRectangleElement | ExcalidrawEmbeddableElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement;
104
104
  /**
105
105
  * ExcalidrawElement should be JSON serializable and (eventually) contain
106
106
  * no computed data. The list of all ExcalidrawElements should be shareable
@@ -130,8 +130,8 @@ export type ExcalidrawTextElement = _ExcalidrawElementBase & Readonly<{
130
130
  _brand: "unitlessLineHeight";
131
131
  };
132
132
  }>;
133
- export type ExcalidrawBindableElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawTextElement | ExcalidrawImageElement | ExcalidrawIFrameElement | ExcalidrawFrameElement;
134
- export type ExcalidrawTextContainer = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawArrowElement | ExcalidrawIFrameElement;
133
+ export type ExcalidrawBindableElement = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawTextElement | ExcalidrawImageElement | ExcalidrawEmbeddableElement | ExcalidrawFrameElement;
134
+ export type ExcalidrawTextContainer = ExcalidrawRectangleElement | ExcalidrawDiamondElement | ExcalidrawEllipseElement | ExcalidrawArrowElement;
135
135
  export type ExcalidrawTextElementWithContainer = {
136
136
  containerId: ExcalidrawTextContainer["id"];
137
137
  } & ExcalidrawTextElement;
package/types/groups.d.ts CHANGED
@@ -12,7 +12,7 @@ export declare const getSelectedGroupIds: (appState: AppState) => GroupId[];
12
12
  * When you select an element, you often want to actually select the whole group it's in, unless
13
13
  * you're currently editing that group.
14
14
  */
15
- export declare const selectGroupsForSelectedElements: (appState: AppState, elements: readonly NonDeleted<ExcalidrawElement>[]) => AppState;
15
+ export declare const selectGroupsForSelectedElements: (appState: AppState, elements: readonly NonDeleted<ExcalidrawElement>[], prevAppState: AppState) => AppState;
16
16
  export declare const selectGroupsFromGivenElements: (elements: readonly NonDeleted<ExcalidrawElement>[], appState: AppState) => {
17
17
  [groupId: string]: boolean;
18
18
  };
@@ -5,9 +5,9 @@ export interface HistoryEntry {
5
5
  elements: ExcalidrawElement[];
6
6
  }
7
7
  declare const clearAppStatePropertiesForHistory: (appState: AppState) => {
8
- selectedElementIds: {
9
- [id: string]: boolean;
10
- };
8
+ selectedElementIds: Readonly<{
9
+ [id: string]: true;
10
+ }>;
11
11
  selectedGroupIds: {
12
12
  [groupId: string]: boolean;
13
13
  };
@@ -8,7 +8,10 @@ import { AppState } from "../types";
8
8
  */
9
9
  export declare const excludeElementsInFramesFromSelection: <T extends ExcalidrawElement>(selectedElements: readonly T[]) => T[];
10
10
  export declare const getElementsWithinSelection: (elements: readonly NonDeletedExcalidrawElement[], selection: NonDeletedExcalidrawElement, excludeElementsInFrames?: boolean) => NonDeletedExcalidrawElement[];
11
- export declare const isSomeElementSelected: (elements: readonly NonDeletedExcalidrawElement[], appState: Pick<AppState, "selectedElementIds">) => boolean;
11
+ export declare const isSomeElementSelected: {
12
+ (elements: readonly NonDeletedExcalidrawElement[], appState: Pick<AppState, "selectedElementIds">): boolean;
13
+ clearCache(): void;
14
+ };
12
15
  /**
13
16
  * Returns common attribute (picked by `getAttribute` callback) of selected
14
17
  * elements. If elements don't share the same value, returns `null`.
@@ -19,3 +22,10 @@ export declare const getSelectedElements: (elements: readonly NonDeletedExcalidr
19
22
  includeElementsInFrames?: boolean;
20
23
  }) => ExcalidrawElement[];
21
24
  export declare const getTargetElements: (elements: readonly NonDeletedExcalidrawElement[], appState: Pick<AppState, "selectedElementIds" | "editingElement">) => ExcalidrawElement[];
25
+ /**
26
+ * returns prevState's selectedElementids if no change from previous, so as to
27
+ * retain reference identity for memoization
28
+ */
29
+ export declare const makeNextSelectedElementIds: (nextSelectedElementIds: AppState["selectedElementIds"], prevState: Pick<AppState, "selectedElementIds">) => Readonly<{
30
+ [id: string]: true;
31
+ }>;
package/types/types.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from "react";
2
- import { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, Arrowhead, ChartType, FontFamilyValues, ExcalidrawTextElement, FileId, ExcalidrawImageElement, Theme, StrokeRoundness, ExcalidrawFrameElement } from "./element/types";
2
+ import { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, Arrowhead, ChartType, FontFamilyValues, ExcalidrawTextElement, FileId, ExcalidrawImageElement, Theme, StrokeRoundness, ExcalidrawFrameElement, ExcalidrawEmbeddableElement } from "./element/types";
3
3
  import { SHAPES } from "./shapes";
4
4
  import { Point as RoughPoint } from "roughjs/bin/geometry";
5
5
  import { LinearElementEditor } from "./element/linearElementEditor";
@@ -58,7 +58,7 @@ export type BinaryFileData = {
58
58
  export type BinaryFileMetadata = Omit<BinaryFileData, "dataURL">;
59
59
  export type BinaryFiles = Record<ExcalidrawElement["id"], BinaryFileData>;
60
60
  export type LastActiveTool = {
61
- type: typeof SHAPES[number]["value"] | "eraser" | "hand" | "frame" | "iframe";
61
+ type: typeof SHAPES[number]["value"] | "eraser" | "hand" | "frame" | "embeddable";
62
62
  customType: null;
63
63
  } | {
64
64
  type: "custom";
@@ -75,7 +75,7 @@ export type AppState = {
75
75
  showWelcomeScreen: boolean;
76
76
  isLoading: boolean;
77
77
  errorMessage: React.ReactNode;
78
- activeIFrame: {
78
+ activeEmbeddable: {
79
79
  element: NonDeletedExcalidrawElement;
80
80
  state: "hover" | "active";
81
81
  } | null;
@@ -87,7 +87,12 @@ export type AppState = {
87
87
  startBoundElement: NonDeleted<ExcalidrawBindableElement> | null;
88
88
  suggestedBindings: SuggestedBinding[];
89
89
  frameToHighlight: NonDeleted<ExcalidrawFrameElement> | null;
90
- shouldRenderFrames: boolean;
90
+ frameRendering: {
91
+ enabled: boolean;
92
+ name: boolean;
93
+ outline: boolean;
94
+ clip: boolean;
95
+ };
91
96
  editingFrame: string | null;
92
97
  elementsToHighlight: NonDeleted<ExcalidrawElement>[] | null;
93
98
  editingElement: NonDeletedExcalidrawElement | null;
@@ -100,7 +105,7 @@ export type AppState = {
100
105
  lastActiveTool: LastActiveTool;
101
106
  locked: boolean;
102
107
  } & ({
103
- type: typeof SHAPES[number]["value"] | "eraser" | "hand" | "frame" | "iframe";
108
+ type: typeof SHAPES[number]["value"] | "eraser" | "hand" | "frame" | "embeddable";
104
109
  customType: null;
105
110
  } | {
106
111
  type: "custom";
@@ -150,11 +155,11 @@ export type AppState = {
150
155
  */
151
156
  defaultSidebarDockedPreference: boolean;
152
157
  lastPointerDownWith: PointerType;
153
- selectedElementIds: {
154
- [id: string]: boolean;
155
- };
158
+ selectedElementIds: Readonly<{
159
+ [id: string]: true;
160
+ }>;
156
161
  previousSelectedElementIds: {
157
- [id: string]: boolean;
162
+ [id: string]: true;
158
163
  };
159
164
  selectedElementsAreBeingDragged: boolean;
160
165
  shouldCacheIgnoreZoom: boolean;
@@ -306,10 +311,10 @@ export interface ExcalidrawProps {
306
311
  onPointerDown?: (activeTool: AppState["activeTool"], pointerDownState: PointerDownState) => void;
307
312
  onScrollChange?: (scrollX: number, scrollY: number) => void;
308
313
  children?: React.ReactNode;
309
- validateIFrame?: boolean | RegExp | RegExp[] | ((link: string) => boolean | undefined);
310
- renderCustomIFrame?: (element: NonDeletedExcalidrawElement, radius: number, appState: UIAppState) => JSX.Element | null;
314
+ validateEmbeddable?: boolean | RegExp | RegExp[] | ((link: string) => boolean | undefined);
315
+ renderEmbeddable?: (element: NonDeleted<ExcalidrawEmbeddableElement>, appState: AppState) => JSX.Element | null;
311
316
  renderWebview?: boolean;
312
- renderIFrameMenu?: (//zsivzian
317
+ renderEmbeddableMenu?: (//zsivzian
313
318
  appState: AppState) => JSX.Element | null;
314
319
  }
315
320
  export type SceneData = {
@@ -466,13 +471,13 @@ export type ExcalidrawImperativeAPI = {
466
471
  setCursor: InstanceType<typeof App>["setCursor"];
467
472
  resetCursor: InstanceType<typeof App>["resetCursor"];
468
473
  toggleSidebar: InstanceType<typeof App>["toggleSidebar"];
469
- getIFrameElementById: InstanceType<typeof App>["getIFrameElementById"];
474
+ getHTMLIFrameElement: InstanceType<typeof App>["getHTMLIFrameElement"];
470
475
  /**
471
476
  * Disables rendering of frames (including element clipping), but currently
472
477
  * the frames are still interactive in edit mode. As such, this API should be
473
478
  * used in conjunction with view mode (props.viewModeEnabled).
474
479
  */
475
- toggleFrameRendering: InstanceType<typeof App>["toggleFrameRendering"];
480
+ updateFrameRendering: InstanceType<typeof App>["updateFrameRendering"];
476
481
  };
477
482
  export type Device = Readonly<{
478
483
  isSmScreen: boolean;
package/types/utils.d.ts CHANGED
@@ -81,7 +81,7 @@ export declare const selectNode: (node: Element) => void;
81
81
  export declare const removeSelection: () => void;
82
82
  export declare const distance: (x: number, y: number) => number;
83
83
  export declare const updateActiveTool: (appState: Pick<AppState, "activeTool">, data: ({
84
- type: (typeof SHAPES)[number]["value"] | "eraser" | "hand" | "frame" | "iframe";
84
+ type: (typeof SHAPES)[number]["value"] | "eraser" | "hand" | "frame" | "embeddable";
85
85
  } | {
86
86
  type: "custom";
87
87
  customType: string;