@zsviczian/excalidraw 0.13.0-obsidian-1 → 0.14.0-obsidian

package/types/types.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, Arrowhead, ChartType, FontFamilyValues, ExcalidrawTextElement, FileId, ExcalidrawImageElement, Theme } from "./element/types";
+import { PointerType, ExcalidrawLinearElement, NonDeletedExcalidrawElement, NonDeleted, TextAlign, ExcalidrawElement, GroupId, ExcalidrawBindableElement, Arrowhead, ChartType, FontFamilyValues, ExcalidrawTextElement, FileId, ExcalidrawImageElement, Theme, StrokeRoundness } from "./element/types";
 import { SHAPES } from "./shapes";
 import { Point as RoughPoint } from "roughjs/bin/geometry";
 import { LinearElementEditor } from "./element/linearElementEditor";
@@ -15,6 +15,7 @@ import { MaybeTransformHandleType } from "./element/transformHandles";
 import Library from "./data/library";
 import type { FileSystemHandle } from "./data/filesystem";
 import type { ALLOWED_IMAGE_MIME_TYPES, MIME_TYPES } from "./constants";
+import { ContextMenuItems } from "./components/ContextMenu";
 export declare type Point = Readonly<RoughPoint>;
 export declare type Collaborator = {
     pointer?: {
@@ -62,6 +63,11 @@ export declare type LastActiveToolBeforeEraser = {
     customType: string;
 } | null;
 export declare type AppState = {
+    contextMenu: {
+        items: ContextMenuItems;
+        top: number;
+        left: number;
+    } | null;
     showWelcomeScreen: boolean;
     isLoading: boolean;
     errorMessage: string | null;
@@ -101,10 +107,9 @@ export declare type AppState = {
     currentItemFontFamily: FontFamilyValues;
     currentItemFontSize: number;
     currentItemTextAlign: TextAlign;
-    currentItemStrokeSharpness: ExcalidrawElement["strokeSharpness"];
     currentItemStartArrowhead: Arrowhead | null;
     currentItemEndArrowhead: Arrowhead | null;
-    currentItemLinearStrokeSharpness: ExcalidrawElement["strokeSharpness"];
+    currentItemRoundness: StrokeRoundness;
     viewBackgroundColor: string;
     scrollX: number;
     scrollY: number;
@@ -117,7 +122,7 @@ export declare type AppState = {
     openMenu: "canvas" | "shape" | null;
     openPopup: "canvasColorPicker" | "backgroundColorPicker" | "strokeColorPicker" | null;
     openSidebar: "library" | "customSidebar" | null;
-    openDialog: "imageExport" | "help" | null;
+    openDialog: "imageExport" | "help" | "jsonExport" | null;
     isSidebarDocked: boolean;
     lastPointerDownWith: PointerType;
     selectedElementIds: {
@@ -221,7 +226,6 @@ export interface ExcalidrawProps {
     onChange?: (elements: readonly ExcalidrawElement[], appState: AppState, files: BinaryFiles) => void;
     initialData?: ExcalidrawInitialDataState | null | Promise<ExcalidrawInitialDataState | null>;
     excalidrawRef?: ForwardRef<ExcalidrawAPIRefValue>;
-    onCollabButtonClick?: () => void;
     isCollaborating?: boolean;
     onPointerUpdate?: (payload: {
         pointer: {
@@ -234,7 +238,6 @@ export interface ExcalidrawProps {
     onPaste?: (data: ClipboardData, event: ClipboardEvent | null) => Promise<boolean> | boolean;
     onDrop?: (event: React.DragEvent<HTMLDivElement>) => Promise<boolean> | boolean;
     renderTopRightUI?: (isMobile: boolean, appState: AppState) => JSX.Element | null;
-    renderFooter?: (isMobile: boolean, appState: AppState) => JSX.Element | null;
     langCode?: Language["code"];
     viewModeEnabled?: boolean;
     zenModeEnabled?: boolean;
@@ -244,10 +247,7 @@ export interface ExcalidrawProps {
     theme?: Theme;
     name?: string;
     renderCustomStats?: (elements: readonly NonDeletedExcalidrawElement[], appState: AppState) => JSX.Element;
-    UIOptions?: {
-        dockedSidebarBreakpoint?: number;
-        canvasActions?: CanvasActions;
-    };
+    UIOptions?: Partial<UIOptions>;
     detectScroll?: boolean;
     handleKeyboardGlobally?: boolean;
     onLibraryChange?: (libraryItems: LibraryItems) => void | Promise<any>;
@@ -267,6 +267,7 @@ export interface ExcalidrawProps {
      * Render function that renders custom <Sidebar /> component.
      */
     renderSidebar?: () => JSX.Element | null;
+    children?: React.ReactNode;
 }
 export declare type SceneData = {
     elements?: ImportedDataState["elements"];
@@ -284,22 +285,26 @@ export declare type ExportOpts = {
     onExportToBackend?: (exportedElements: readonly NonDeletedExcalidrawElement[], appState: AppState, files: BinaryFiles, canvas: HTMLCanvasElement | null) => void;
     renderCustomUI?: (exportedElements: readonly NonDeletedExcalidrawElement[], appState: AppState, files: BinaryFiles, canvas: HTMLCanvasElement | null) => JSX.Element;
 };
-declare type CanvasActions = {
-    changeViewBackgroundColor?: boolean;
-    clearCanvas?: boolean;
-    export?: false | ExportOpts;
-    loadScene?: boolean;
-    saveToActiveFile?: boolean;
-    toggleTheme?: boolean | null;
-    saveAsImage?: boolean;
-};
+declare type CanvasActions = Partial<{
+    changeViewBackgroundColor: boolean;
+    clearCanvas: boolean;
+    export: false | ExportOpts;
+    loadScene: boolean;
+    saveToActiveFile: boolean;
+    toggleTheme: boolean | null;
+    saveAsImage: boolean;
+}>;
+declare type UIOptions = Partial<{
+    dockedSidebarBreakpoint: number;
+    welcomeScreen: boolean;
+    canvasActions: CanvasActions;
+}>;
 export declare type AppProps = Merge<ExcalidrawProps, {
-    UIOptions: {
+    UIOptions: Merge<MarkRequired<UIOptions, "welcomeScreen">, {
         canvasActions: Required<CanvasActions> & {
             export: ExportOpts;
         };
-        dockedSidebarBreakpoint?: number;
-    };
+    }>;
     detectScroll: boolean;
     handleKeyboardGlobally: boolean;
     isCollaborating: boolean;
@@ -319,6 +324,7 @@ export declare type AppClassProperties = {
     files: BinaryFiles;
     device: App["device"];
     scene: App["scene"];
+    pasteFromClipboard: App["pasteFromClipboard"];
 };
 export declare type PointerDownState = Readonly<{
     origin: Readonly<{
@@ -418,4 +424,19 @@ export declare type Device = Readonly<{
     isTouchScreen: boolean;
     canDeviceFitSidebar: boolean;
 }>;
+export declare type UIChildrenComponents = {
+    [k in "FooterCenter" | "Menu" | "WelcomeScreen"]?: React.ReactElement<{
+        children?: React.ReactNode;
+    }, React.JSXElementConstructor<any>>;
+};
+export declare type UIWelcomeScreenComponents = {
+    [k in "Center" | "MenuHint" | "ToolbarHint" | "HelpHint"]?: React.ReactElement<{
+        children?: React.ReactNode;
+    }, React.JSXElementConstructor<any>>;
+};
+export declare type UIWelcomeScreenCenterComponents = {
+    [k in "Logo" | "Heading" | "Menu" | "MenuItemLoadScene" | "MenuItemHelp"]?: React.ReactElement<{
+        children?: React.ReactNode;
+    }, React.JSXElementConstructor<any>>;
+};
 export {};

package/types/utils.d.ts

@@ -2,6 +2,7 @@ import { EVENT } from "./constants";
 import { FontFamilyValues, FontString } from "./element/types";
 import { AppState, LastActiveToolBeforeEraser, Zoom } from "./types";
 import { SHAPES } from "./shapes";
+import React from "react";
 export declare const setDateTimeForTests: (dateTime: string) => void;
 export declare const getDateTime: () => string;
 export declare const capitalizeString: (str: string) => string;
@@ -134,3 +135,19 @@ export declare const isPrimitive: (val: any) => boolean;
 export declare const getFrame: () => "top" | "iframe";
 export declare const isPromiseLike: (value: any) => value is Promise<any>;
 export declare const queryFocusableElements: (container: HTMLElement | null) => HTMLElement[];
+/**
+ * Partitions React children into named components and the rest of children.
+ *
+ * Returns known children as a dictionary of react children keyed by their
+ * displayName, and the rest children as an array.
+ *
+ * NOTE all named react components are included in the dictionary, irrespective
+ * of the supplied type parameter. This means you may be throwing away
+ * children that you aren't expecting, but should nonetheless be rendered.
+ * To guard against this (provided you care about the rest children at all),
+ * supply a second parameter with an object with keys of the expected children.
+ */
+export declare const getReactChildren: <KnownChildren extends {
+    [x: string]: React.ReactNode;
+}>(children: React.ReactNode, expectedComponents?: Record<keyof KnownChildren, any> | undefined) => readonly [Partial<KnownChildren>, React.ReactNode[]];
+export declare const isShallowEqual: <T extends Record<string, any>>(objA: T, objB: T) => boolean;