@myoc/element 0.19.522 → 0.19.524

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.
@@ -1,9 +1,11 @@
1
1
  import "./ToolIcon.scss";
2
2
  import "./MobileToolbar.scss";
3
+ import type { ActionManager } from "../actions/manager";
3
4
  import type { AppClassProperties, UIAppState } from "../types";
4
5
  type MobileToolbarProps = {
5
6
  app: AppClassProperties;
7
+ actionManager: ActionManager;
6
8
  setAppState: React.Component<any, UIAppState>["setState"];
7
9
  };
8
- export declare const MobileToolbar: ({ app, setAppState }: MobileToolbarProps) => import("react/jsx-runtime").JSX.Element;
10
+ export declare const MobileToolbar: ({ app, actionManager, setAppState, }: MobileToolbarProps) => import("react/jsx-runtime").JSX.Element;
9
11
  export {};
@@ -1,10 +1,12 @@
1
1
  import type { AppClassProperties, AppProps, AppState, UIAppState } from "../types";
2
+ import type { ActionManager } from "../actions/manager";
2
3
  /** the main (desktop/tablet) toolbar island */
3
- export declare const Toolbar: ({ app, appState, setAppState, UIOptions, onPenModeToggle, onLockToggle, heading, }: {
4
+ export declare const Toolbar: ({ app, appState, setAppState, UIOptions, actionManager, onPenModeToggle, onLockToggle, heading, }: {
4
5
  app: AppClassProperties;
5
6
  appState: UIAppState;
6
7
  setAppState: React.Component<any, AppState>["setState"];
7
8
  UIOptions: AppProps["UIOptions"];
9
+ actionManager: ActionManager;
8
10
  onPenModeToggle: AppClassProperties["togglePenMode"];
9
11
  onLockToggle: () => void;
10
12
  heading: React.ReactNode;
@@ -3,9 +3,8 @@ export type ToolConfig = {
3
3
  icon: React.ReactNode;
4
4
  /** letter shortcut(s) — the first one is shown in tooltips */
5
5
  letterKey?: string | readonly string[];
6
- /** whether `letterKey` requires Shift to be held (e.g. Shift+X) */
6
+ /** whether `letterKey` requires Shift to be held */
7
7
  shiftKey?: boolean;
8
- numericKey?: string;
9
8
  /** whether the tool's shapes can be filled — fills the icon when active */
10
9
  fillable?: boolean;
11
10
  /**
@@ -41,14 +40,16 @@ export declare const TOOLS: {
41
40
  lasso: ToolConfig;
42
41
  };
43
42
  export type ToolbarToolType = keyof typeof TOOLS;
43
+ export declare const MYOC_SIMPLIFIED_MAIN_TOOL_TYPES: readonly ["selection", "freedraw", "text", "image", "eraser"];
44
+ export declare const MYOC_SIMPLIFIED_EXTRA_TOOL_TYPES: readonly ["autoshape", "rectangle", "diamond", "ellipse", "arrow", "line"];
44
45
  /**
45
46
  * tools that, when activated while already active, switch back to the
46
47
  * previously active tool (see `setActiveTool`'s `toggle` option)
47
48
  */
48
49
  export declare const TOGGLE_TOOLS: readonly (ToolType | "custom")[];
49
50
  export declare const getToolLetter: (type: ToolbarToolType) => string | undefined;
50
- /** human-readable shortcut hint, e.g. "R or 2", used in tooltips & aria */
51
- export declare const getToolShortcut: (type: ToolbarToolType) => string;
51
+ /** human-readable shortcut hint, e.g. "R", used in tooltips & aria */
52
+ export declare const getToolShortcut: (type: ToolbarToolType) => string | undefined;
52
53
  export declare const findShapeByKey: (key: string, app: AppClassProperties, shiftKey?: boolean) => "line" | "arrow" | "text" | "selection" | "rectangle" | "diamond" | "ellipse" | "embeddable" | "image" | "frame" | "freedraw" | "lasso" | "eraser" | "hand" | "laser" | "autoshape" | "bucketfill" | null;
53
54
  /**
54
55
  * Whether a toolbar entry activating the given tool renders disabled — true
@@ -111,6 +112,10 @@ export declare const FrameToolButton: {
111
112
  ({ app, activeTool, hideKeyBinding, hideShortcut, }: ToolButtonComponentProps): import("react/jsx-runtime").JSX.Element;
112
113
  displayName: string;
113
114
  };
115
+ export declare const AutoshapeToolButton: {
116
+ ({ app, activeTool, hideKeyBinding, hideShortcut, }: ToolButtonComponentProps): import("react/jsx-runtime").JSX.Element;
117
+ displayName: string;
118
+ };
114
119
  /**
115
120
  * The selection tool button — pointer-clicking it while the selection tool
116
121
  * is active switches to lasso.
@@ -56,7 +56,6 @@ export declare const LiveCollaborationTrigger: {
56
56
  displayName: string;
57
57
  };
58
58
  export declare const PreferencesToggleGridModeItem: () => import("react/jsx-runtime").JSX.Element;
59
- export declare const PreferencesToggleZenModeItem: () => import("react/jsx-runtime").JSX.Element;
60
59
  export declare const Preferences: {
61
60
  ({ children, additionalItems, }: {
62
61
  children?: React.ReactNode;
@@ -68,7 +67,6 @@ export declare const Preferences: {
68
67
  ToggleArrowBinding: () => import("react/jsx-runtime").JSX.Element;
69
68
  ToggleMidpointSnapping: () => import("react/jsx-runtime").JSX.Element;
70
69
  ToggleGridMode: () => import("react/jsx-runtime").JSX.Element;
71
- ToggleZenMode: () => import("react/jsx-runtime").JSX.Element;
72
70
  ToggleViewMode: () => import("react/jsx-runtime").JSX.Element | null;
73
71
  ToggleElementProperties: () => import("react/jsx-runtime").JSX.Element;
74
72
  displayName: string;
@@ -116,6 +116,13 @@ export type ImageStatus = {
116
116
  downloadError?: ImageDownloadErrorStatus | null;
117
117
  uploadProgress?: ImageUploadProgressStatus | null;
118
118
  };
119
+ export type RenderCustomizations = {
120
+ /**
121
+ * Host-controlled color for transient canvas traces whose visibility depends
122
+ * on the embedding app background, such as eraser and draw-to-shape trails.
123
+ */
124
+ traceColor?: string;
125
+ };
119
126
  export type ToolType = "selection" | "lasso" | "rectangle" | "diamond" | "ellipse" | "arrow" | "line" | "freedraw" | "text" | "image" | "eraser" | "hand" | "frame" | "magicframe" | "embeddable" | "laser" | "autoshape" | "bucketfill";
120
127
  export type ElementOrToolType = ExcalidrawElementType | ToolType | "custom";
121
128
  export type ActiveTool = {
@@ -797,10 +804,10 @@ export interface ExcalidrawProps {
797
804
  type: "custom";
798
805
  customType: string;
799
806
  };
800
- zenModeEnabled?: boolean;
801
807
  gridModeEnabled?: boolean;
802
808
  objectsSnapModeEnabled?: boolean;
803
809
  theme?: Theme;
810
+ renderCustomizations?: RenderCustomizations;
804
811
  name?: string;
805
812
  renderCustomStats?: (elements: readonly NonDeletedExcalidrawElement[], appState: UIAppState) => JSX.Element;
806
813
  editorPreferences?: EditorPreferences;
@@ -970,6 +977,7 @@ export type AppClassProperties = {
970
977
  addElementsFromPaste: App["addElementsFromPaste"];
971
978
  togglePenMode: App["togglePenMode"];
972
979
  toggleLock: App["toggleLock"];
980
+ openEyeDropper: App["openEyeDropper"];
973
981
  setActiveTool: App["setActiveTool"];
974
982
  setOpenDialog: App["setOpenDialog"];
975
983
  insertEmbeddableElement: App["insertEmbeddableElement"];
@@ -57,6 +57,11 @@ export type SetViewportOptions = {
57
57
  * combination. See {@link ViewportOffsets}.
58
58
  */
59
59
  offsets?: ViewportOffsets;
60
+ /**
61
+ * Multiplier applied to fit zooms to leave extra breathing room around the
62
+ * target. Ignored for `fit: "none"`.
63
+ */
64
+ viewportZoomFactor?: number;
60
65
  };
61
66
  type Viewport = Pick<AppState, "scrollX" | "scrollY" | "zoom">;
62
67
  /**
@@ -73,7 +78,7 @@ export declare const constrainScrollState: (state: Pick<AppState, "scrollX" | "s
73
78
  * cancelling the other.
74
79
  */
75
80
  export declare const getViewportForZoomWithScrollConstraints: (opts: ZoomOptions, state: AppState) => Viewport;
76
- export declare const zoomToFitBounds: ({ bounds, appState, canvasOffsets, fit, minZoom, maxZoom, steppedZoom, }: {
81
+ export declare const zoomToFitBounds: ({ bounds, appState, canvasOffsets, fit, minZoom, maxZoom, steppedZoom, viewportZoomFactor, }: {
77
82
  bounds: SceneBounds;
78
83
  canvasOffsets?: Offsets;
79
84
  appState: Readonly<AppState>;
@@ -81,6 +86,7 @@ export declare const zoomToFitBounds: ({ bounds, appState, canvasOffsets, fit, m
81
86
  minZoom?: number;
82
87
  maxZoom?: number;
83
88
  steppedZoom?: boolean;
89
+ viewportZoomFactor?: number;
84
90
  }) => {
85
91
  appState: {
86
92
  scrollX: number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@myoc/element",
3
- "version": "0.19.522",
3
+ "version": "0.19.524",
4
4
  "type": "module",
5
5
  "types": "./dist/types/element/src/index.d.ts",
6
6
  "main": "./dist/prod/index.js",
@@ -64,9 +64,9 @@
64
64
  "build:esm": "rimraf dist && node ../../scripts/buildBase.js && yarn gen:types"
65
65
  },
66
66
  "dependencies": {
67
- "@excalidraw/common": "npm:@myoc/common@0.19.522",
68
- "@excalidraw/fractional-indexing": "npm:@myoc/fractional-indexing@0.19.522",
69
- "@excalidraw/math": "npm:@myoc/math@0.19.522",
67
+ "@excalidraw/common": "npm:@myoc/common@0.19.524",
68
+ "@excalidraw/fractional-indexing": "npm:@myoc/fractional-indexing@0.19.524",
69
+ "@excalidraw/math": "npm:@myoc/math@0.19.524",
70
70
  "thumbhash": "0.1.1"
71
71
  }
72
72
  }
@@ -1,191 +0,0 @@
1
- export declare const actionToggleZenMode: {
2
- name: "zenMode";
3
- label: string;
4
- icon: import("react/jsx-runtime").JSX.Element;
5
- viewMode: true;
6
- trackEvent: {
7
- category: "canvas";
8
- predicate: (appState: Readonly<import("../types").AppState>) => boolean;
9
- };
10
- perform(elements: readonly import("@excalidraw/element/types").OrderedExcalidrawElement[], appState: Readonly<import("../types").AppState>): {
11
- appState: {
12
- zenModeEnabled: boolean;
13
- contextMenu: {
14
- items: import("../components/ContextMenu").ContextMenuItems;
15
- top: number;
16
- left: number;
17
- } | null;
18
- showWelcomeScreen: boolean;
19
- isLoading: boolean;
20
- myocSimplifiedMode: boolean;
21
- dontResizeLimitMBs: number;
22
- hideMainMenus: boolean;
23
- wheelZoomsOnDefault?: boolean;
24
- arrangeConfiguration: {
25
- algorithm: import("@excalidraw/element/types").ArrangeAlgorithms;
26
- gap: number;
27
- };
28
- normaliseConfiguration: {
29
- mode: import("../types").NormaliseMode;
30
- metric: import("../types").NormaliseMetric;
31
- };
32
- errorMessage: React.ReactNode;
33
- activeEmbeddable: {
34
- element: import("@excalidraw/element/types").NonDeletedExcalidrawElement;
35
- state: "hover" | "active";
36
- } | null;
37
- newElement: import("@excalidraw/element/types").NonDeleted<import("@excalidraw/element/types").ExcalidrawNonSelectionElement> | null;
38
- resizingElement: import("@excalidraw/element/types").NonDeletedExcalidrawElement | null;
39
- multiElement: import("@excalidraw/element/types").NonDeleted<import("@excalidraw/element/types").ExcalidrawLinearElement> | null;
40
- selectionElement: import("@excalidraw/element/types").NonDeletedExcalidrawElement | null;
41
- isBindingEnabled: boolean;
42
- boxSelectionMode: import("../types").BoxSelectionMode;
43
- bindingPreference: "enabled" | "disabled";
44
- isMidpointSnappingEnabled: boolean;
45
- suggestedBinding: {
46
- element: import("@excalidraw/element/types").NonDeleted<import("@excalidraw/element/types").ExcalidrawBindableElement>;
47
- midPoint?: import("@excalidraw/math").GlobalPoint;
48
- } | null;
49
- hoveredArrowTextAnchor: {
50
- elementId: import("@excalidraw/element/types").ExcalidrawArrowElement["id"];
51
- anchor: "start" | "end" | "label";
52
- } | null;
53
- frameToHighlight: import("@excalidraw/element/types").NonDeleted<import("@excalidraw/element/types").ExcalidrawFrameLikeElement> | null;
54
- frameRendering: {
55
- enabled: boolean;
56
- name: boolean;
57
- outline: boolean;
58
- clip: boolean;
59
- };
60
- editingFrame: import("@excalidraw/element/types").ExcalidrawFrameLikeElement["id"] | null;
61
- elementsToHighlight: readonly import("@excalidraw/element/types").NonDeletedExcalidrawElement[] | null;
62
- editingTextElement: import("@excalidraw/element/types").ExcalidrawTextElement | null;
63
- activeTool: {
64
- lastActiveTool: import("../types").ActiveTool | null;
65
- locked: boolean;
66
- fromSelection: boolean;
67
- } & import("../types").ActiveTool;
68
- preferredSelectionTool: {
69
- type: "selection" | "lasso";
70
- initialized: boolean;
71
- };
72
- penMode: boolean;
73
- penDetected: boolean;
74
- exportBackground: boolean;
75
- exportEmbedScene: boolean;
76
- exportWithDarkMode: boolean;
77
- exportScale: number;
78
- currentItemStrokeColor: string;
79
- currentItemBackgroundColor: string;
80
- currentItemFillStyle: import("@excalidraw/element/types").ExcalidrawElement["fillStyle"];
81
- currentItemStrokeWidthKey: import("@excalidraw/common").StrokeWidthKey;
82
- currentItemStrokeStyle: import("@excalidraw/element/types").ExcalidrawElement["strokeStyle"];
83
- currentItemRoughness: number;
84
- currentItemStrokeVariability: import("@excalidraw/element/types").StrokeVariability;
85
- currentItemOpacity: number;
86
- currentItemFontFamily: import("@excalidraw/element/types").FontFamilyValues;
87
- currentItemFontSize: number;
88
- currentItemTextAlign: import("@excalidraw/element/types").TextAlign;
89
- currentItemStartArrowhead: import("@excalidraw/element/types").Arrowhead | null;
90
- currentItemEndArrowhead: import("@excalidraw/element/types").Arrowhead | null;
91
- currentHoveredFontFamily: import("@excalidraw/element/types").FontFamilyValues | null;
92
- currentItemRoundness: import("@excalidraw/element/types").StrokeRoundness;
93
- currentItemArrowType: "sharp" | "round" | "elbow";
94
- viewBackgroundColor: string;
95
- scrollX: number;
96
- scrollY: number;
97
- scrollConstraints: import("../types").ScrollConstraints | null;
98
- cursorButton: "up" | "down";
99
- scrolledOutside: boolean;
100
- name: string | null;
101
- isResizing: boolean;
102
- isRotating: boolean;
103
- zoom: import("../types").Zoom;
104
- openMenu: "canvas" | null;
105
- openPopup: "canvasBackground" | "elementBackground" | "elementStroke" | "fontFamily" | "compactTextProperties" | "compactStrokeStyles" | "compactOtherProperties" | "compactArrowProperties" | null;
106
- openSidebar: {
107
- name: import("../types").SidebarName;
108
- tab?: import("../types").SidebarTabName;
109
- } | null;
110
- openDialog: null | {
111
- name: "imageExport" | "help" | "jsonExport";
112
- } | {
113
- name: "settings";
114
- } | {
115
- name: "elementLinkSelector";
116
- sourceElementId: import("@excalidraw/element/types").ExcalidrawElement["id"];
117
- } | {
118
- name: "charts";
119
- data: import("../charts").Spreadsheet;
120
- rawText: string;
121
- };
122
- defaultSidebarDockedPreference: boolean;
123
- lastPointerDownWith: import("@excalidraw/element/types").PointerType;
124
- selectedElementIds: Readonly<{
125
- [id: string]: true;
126
- }>;
127
- hoveredElementIds: Readonly<{
128
- [id: string]: true;
129
- }>;
130
- previousSelectedElementIds: {
131
- [id: string]: true;
132
- };
133
- selectedElementsAreBeingDragged: boolean;
134
- shouldCacheIgnoreZoom: boolean;
135
- toast: {
136
- message: React.ReactNode;
137
- closable?: boolean;
138
- duration?: number;
139
- } | null;
140
- theme: import("@excalidraw/element/types").Theme;
141
- gridSize: number;
142
- gridStep: number;
143
- gridModeEnabled: boolean;
144
- viewModeEnabled: boolean;
145
- viewModeOnly: boolean;
146
- selectedGroupIds: {
147
- [groupId: string]: boolean;
148
- };
149
- editingGroupId: import("@excalidraw/element/types").GroupId | null;
150
- width: number;
151
- height: number;
152
- offsetTop: number;
153
- offsetLeft: number;
154
- fileHandle: FileSystemFileHandle | null;
155
- collaborators: Map<import("../types").SocketId, import("../types").Collaborator>;
156
- stats: {
157
- open: boolean;
158
- panels: number;
159
- };
160
- showHyperlinkPopup: false | "info" | "editor";
161
- selectedLinearElement: import("@excalidraw/element").LinearElementEditor | null;
162
- snapLines: readonly import("../snapping").SnapLine[];
163
- originSnapOffset: {
164
- x: number;
165
- y: number;
166
- } | null;
167
- objectsSnapModeEnabled: boolean;
168
- isCropping: boolean;
169
- croppingElementId: import("@excalidraw/element/types").ExcalidrawElement["id"] | null;
170
- searchMatches: Readonly<{
171
- focusedId: import("@excalidraw/element/types").ExcalidrawElement["id"] | null;
172
- matches: readonly import("../types").SearchMatch[];
173
- }> | null;
174
- activeLockedId: string | null;
175
- lockedMultiSelections: {
176
- [groupId: string]: true;
177
- };
178
- bindMode: import("@excalidraw/element/types").BindMode;
179
- colorTopPicks: {
180
- elementStroke: readonly string[] | null;
181
- elementBackground: readonly string[] | null;
182
- bucketFill: readonly string[] | null;
183
- };
184
- };
185
- captureUpdate: "EVENTUALLY";
186
- };
187
- checked: (appState: Readonly<import("../types").UIAppState>) => boolean;
188
- predicate: (elements: readonly import("@excalidraw/element/types").ExcalidrawElement[], appState: import("../types").AppState, appProps: import("../types").ExcalidrawProps, app: import("../types").AppClassProperties) => boolean;
189
- } & {
190
- keyTest?: undefined;
191
- };