@excalidraw/excalidraw 0.10.0 → 0.11.0-5346-59101a1

package/types/components/DarkModeToggle.d.ts

@@ -1,8 +1,8 @@
 /// <reference types="react" />
 import "./ToolIcon.scss";
-export declare type Appearence = "light" | "dark";
+import { Theme } from "../element/types";
 export declare const DarkModeToggle: (props: {
-    value: Appearence;
-    onChange: (value: Appearence) => void;
+    value: Theme;
+    onChange: (value: Theme) => void;
     title?: string | undefined;
 }) => JSX.Element;

package/types/components/Dialog.d.ts

@@ -1,7 +1,7 @@
 import React from "react";
 import "./Dialog.scss";
 import { AppState } from "../types";
-export declare const Dialog: (props: {
+export interface DialogProps {
     children: React.ReactNode;
     className?: string;
     small?: boolean;
@@ -9,4 +9,6 @@ export declare const Dialog: (props: {
     title: React.ReactNode;
     autofocus?: boolean;
     theme?: AppState["theme"];
-}) => JSX.Element;
+    closeOnClickOutside?: boolean;
+}
+export declare const Dialog: (props: DialogProps) => JSX.Element;

package/types/components/HintViewer.d.ts

@@ -2,9 +2,10 @@
 import { NonDeletedExcalidrawElement } from "../element/types";
 import "./HintViewer.scss";
 import { AppState } from "../types";
-interface Hint {
+interface HintViewerProps {
     appState: AppState;
     elements: readonly NonDeletedExcalidrawElement[];
+    isMobile: boolean;
 }
-export declare const HintViewer: ({ appState, elements }: Hint) => JSX.Element | null;
+export declare const HintViewer: ({ appState, elements, isMobile, }: HintViewerProps) => JSX.Element | null;
 export {};

package/types/components/ImageExportDialog.d.ts

@@ -1,15 +1,16 @@
 /// <reference types="react" />
-import { ActionsManagerInterface } from "../actions/types";
 import { NonDeletedExcalidrawElement } from "../element/types";
-import { AppState } from "../types";
+import { AppState, BinaryFiles } from "../types";
 import "./ExportDialog.scss";
+import { ActionManager } from "../actions/manager";
 export declare const ErrorCanvasPreview: () => JSX.Element;
 export declare type ExportCB = (elements: readonly NonDeletedExcalidrawElement[], scale?: number) => void;
-export declare const ImageExportDialog: ({ elements, appState, exportPadding, actionManager, onExportToPng, onExportToSvg, onExportToClipboard, }: {
+export declare const ImageExportDialog: ({ elements, appState, files, exportPadding, actionManager, onExportToPng, onExportToSvg, onExportToClipboard, }: {
     appState: AppState;
     elements: readonly NonDeletedExcalidrawElement[];
+    files: BinaryFiles;
     exportPadding?: number | undefined;
-    actionManager: ActionsManagerInterface;
+    actionManager: ActionManager;
     onExportToPng: ExportCB;
     onExportToSvg: ExportCB;
     onExportToClipboard: ExportCB;

package/types/components/InitializeApp.d.ts

@@ -2,15 +2,7 @@ import React from "react";
 import { Language } from "../i18n";
 interface Props {
     langCode: Language["code"];
+    children: React.ReactElement;
 }
-interface State {
-    isLoading: boolean;
-}
-export declare class InitializeApp extends React.Component<Props, State> {
-    state: {
-        isLoading: boolean;
-    };
-    componentDidMount(): Promise<void>;
-    render(): React.ReactNode;
-}
+export declare const InitializeApp: (props: Props) => JSX.Element;
 export {};

package/types/components/JSONExportDialog.d.ts

@@ -1,13 +1,14 @@
 /// <reference types="react" />
-import { ActionsManagerInterface } from "../actions/types";
 import { NonDeletedExcalidrawElement } from "../element/types";
-import { AppState, ExportOpts } from "../types";
+import { AppState, ExportOpts, BinaryFiles } from "../types";
 import "./ExportDialog.scss";
+import { ActionManager } from "../actions/manager";
 export declare type ExportCB = (elements: readonly NonDeletedExcalidrawElement[], scale?: number) => void;
-export declare const JSONExportDialog: ({ elements, appState, actionManager, exportOpts, canvas, }: {
-    appState: AppState;
+export declare const JSONExportDialog: ({ elements, appState, files, actionManager, exportOpts, canvas, }: {
     elements: readonly NonDeletedExcalidrawElement[];
-    actionManager: ActionsManagerInterface;
+    appState: AppState;
+    files: BinaryFiles;
+    actionManager: ActionManager;
     exportOpts: ExportOpts;
     canvas: HTMLCanvasElement | null;
 }) => JSX.Element;

package/types/components/LayerUI.d.ts

@@ -2,17 +2,20 @@ import React from "react";
 import { ActionManager } from "../actions/manager";
 import { NonDeletedExcalidrawElement } from "../element/types";
 import { Language } from "../i18n";
-import { AppProps, AppState, ExcalidrawProps } from "../types";
-import "./LayerUI.scss";
+import { AppProps, AppState, ExcalidrawProps, BinaryFiles } from "../types";
 import Library from "../data/library";
+import "./LayerUI.scss";
+import "./Toolbar.scss";
 interface LayerUIProps {
     actionManager: ActionManager;
     appState: AppState;
+    files: BinaryFiles;
     canvas: HTMLCanvasElement | null;
     setAppState: React.Component<any, AppState>["setState"];
     elements: readonly NonDeletedExcalidrawElement[];
     onCollabButtonClick?: () => void;
     onLockToggle: () => void;
+    onPenModeToggle: () => void;
     onInsertElements: (elements: readonly NonDeletedExcalidrawElement[]) => void;
     zenModeEnabled: boolean;
     showExitZenModeBtn: boolean;
@@ -20,14 +23,18 @@ interface LayerUIProps {
     toggleZenMode: () => void;
     langCode: Language["code"];
     isCollaborating: boolean;
-    renderTopRightUI?: (isMobile: boolean, appState: AppState) => JSX.Element;
-    renderCustomFooter?: (isMobile: boolean, appState: AppState) => JSX.Element;
+    renderTopRightUI?: ExcalidrawProps["renderTopRightUI"];
+    renderCustomFooter?: ExcalidrawProps["renderFooter"];
+    renderCustomStats?: ExcalidrawProps["renderCustomStats"];
     viewModeEnabled: boolean;
     libraryReturnUrl: ExcalidrawProps["libraryReturnUrl"];
     UIOptions: AppProps["UIOptions"];
     focusContainer: () => void;
     library: Library;
     id: string;
+    onImageAction: (data: {
+        insertOnCanvasDirectly: boolean;
+    }) => void;
 }
-declare const _default: React.MemoExoticComponent<({ actionManager, appState, setAppState, canvas, elements, onCollabButtonClick, onLockToggle, onInsertElements, zenModeEnabled, showExitZenModeBtn, showThemeBtn, toggleZenMode, isCollaborating, renderTopRightUI, renderCustomFooter, viewModeEnabled, libraryReturnUrl, UIOptions, focusContainer, library, id, }: LayerUIProps) => JSX.Element>;
+declare const _default: React.MemoExoticComponent<({ actionManager, appState, files, setAppState, canvas, elements, onCollabButtonClick, onLockToggle, onPenModeToggle, onInsertElements, zenModeEnabled, showExitZenModeBtn, showThemeBtn, toggleZenMode, isCollaborating, renderTopRightUI, renderCustomFooter, renderCustomStats, viewModeEnabled, libraryReturnUrl, UIOptions, focusContainer, library, id, onImageAction, }: LayerUIProps) => JSX.Element>;
 export default _default;

package/types/components/LibraryButton.d.ts

@@ -3,4 +3,5 @@ import { AppState } from "../types";
 export declare const LibraryButton: React.FC<{
     appState: AppState;
     setAppState: React.Component<any, AppState>["setState"];
+    isMobile?: boolean;
 }>;

package/types/components/LibraryMenu.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+import Library from "../data/library";
+import { LibraryItems, LibraryItem, AppState, BinaryFiles, ExcalidrawProps } from "../types";
+import "./LibraryMenu.scss";
+export declare const LibraryMenu: ({ onClose, onInsertLibraryItems, pendingElements, onAddToLibrary, theme, setAppState, files, libraryReturnUrl, focusContainer, library, id, appState, }: {
+    pendingElements: LibraryItem["elements"];
+    onClose: () => void;
+    onInsertLibraryItems: (libraryItems: LibraryItems) => void;
+    onAddToLibrary: () => void;
+    theme: AppState["theme"];
+    files: BinaryFiles;
+    setAppState: React.Component<any, AppState>["setState"];
+    libraryReturnUrl: ExcalidrawProps["libraryReturnUrl"];
+    focusContainer: () => void;
+    library: Library;
+    id: string;
+    appState: AppState;
+}) => JSX.Element;

package/types/components/LibraryMenuItems.d.ts

@@ -0,0 +1,24 @@
+import React from "react";
+import Library from "../data/library";
+import { AppState, BinaryFiles, ExcalidrawProps, LibraryItem, LibraryItems } from "../types";
+import "./LibraryMenuItems.scss";
+declare const LibraryMenuItems: ({ isLoading, libraryItems, onRemoveFromLibrary, onAddToLibrary, onInsertLibraryItems, pendingElements, theme, setAppState, appState, libraryReturnUrl, library, files, id, selectedItems, onSelectItems, onPublish, resetLibrary, }: {
+    isLoading: boolean;
+    libraryItems: LibraryItems;
+    pendingElements: LibraryItem["elements"];
+    onRemoveFromLibrary: () => void;
+    onInsertLibraryItems: (libraryItems: LibraryItems) => void;
+    onAddToLibrary: (elements: LibraryItem["elements"]) => void;
+    theme: AppState["theme"];
+    files: BinaryFiles;
+    setAppState: React.Component<any, AppState>["setState"];
+    appState: AppState;
+    libraryReturnUrl: ExcalidrawProps["libraryReturnUrl"];
+    library: Library;
+    id: string;
+    selectedItems: LibraryItem["id"][];
+    onSelectItems: (id: LibraryItem["id"][]) => void;
+    onPublish: () => void;
+    resetLibrary: () => void;
+}) => JSX.Element;
+export default LibraryMenuItems;

package/types/components/LibraryUnit.d.ts

@@ -1,9 +1,13 @@
 /// <reference types="react" />
-import { LibraryItem } from "../types";
+import { BinaryFiles, LibraryItem } from "../types";
 import "./LibraryUnit.scss";
-export declare const LibraryUnit: ({ elements, pendingElements, onRemoveFromLibrary, onClick, }: {
-    elements?: LibraryItem | undefined;
-    pendingElements?: LibraryItem | undefined;
-    onRemoveFromLibrary: () => void;
+export declare const LibraryUnit: ({ id, elements, files, isPending, onClick, selected, onToggle, onDrag, }: {
+    id: LibraryItem["id"] | /** for pending item */ null;
+    elements?: readonly import("../element/types").NonDeleted<import("../element/types").ExcalidrawElement>[] | undefined;
+    files: BinaryFiles;
+    isPending?: boolean | undefined;
     onClick: () => void;
+    selected: boolean;
+    onToggle: (id: string, event: React.MouseEvent) => void;
+    onDrag: (id: string, event: React.DragEvent) => void;
 }) => JSX.Element;

package/types/components/LoadingMessage.d.ts

@@ -1,2 +1,4 @@
 /// <reference types="react" />
-export declare const LoadingMessage: () => JSX.Element;
+export declare const LoadingMessage: React.FC<{
+    delay?: number;
+}>;

package/types/components/LockButton.d.ts

@@ -6,6 +6,7 @@ declare type LockIconProps = {
     checked: boolean;
     onChange?(): void;
     zenModeEnabled?: boolean;
+    isMobile?: boolean;
 };
 export declare const LockButton: (props: LockIconProps) => JSX.Element;
 export {};

package/types/components/MobileMenu.d.ts

@@ -12,11 +12,17 @@ declare type MobileMenuProps = {
     libraryMenu: JSX.Element | null;
     onCollabButtonClick?: () => void;
     onLockToggle: () => void;
+    onPenModeToggle: () => void;
     canvas: HTMLCanvasElement | null;
     isCollaborating: boolean;
-    renderCustomFooter?: (isMobile: boolean, appState: AppState) => JSX.Element;
+    renderCustomFooter?: (isMobile: boolean, appState: AppState) => JSX.Element | null;
     viewModeEnabled: boolean;
     showThemeBtn: boolean;
+    onImageAction: (data: {
+        insertOnCanvasDirectly: boolean;
+    }) => void;
+    renderTopRightUI?: (isMobile: boolean, appState: AppState) => JSX.Element | null;
+    renderStats: () => JSX.Element | null;
 };
-export declare const MobileMenu: ({ appState, elements, libraryMenu, actionManager, renderJSONExportDialog, renderImageExportDialog, setAppState, onCollabButtonClick, onLockToggle, canvas, isCollaborating, renderCustomFooter, viewModeEnabled, showThemeBtn, }: MobileMenuProps) => JSX.Element;
+export declare const MobileMenu: ({ appState, elements, libraryMenu, actionManager, renderJSONExportDialog, renderImageExportDialog, setAppState, onCollabButtonClick, onLockToggle, onPenModeToggle, canvas, isCollaborating, renderCustomFooter, viewModeEnabled, showThemeBtn, onImageAction, renderTopRightUI, renderStats, }: MobileMenuProps) => JSX.Element;
 export {};

package/types/components/Modal.d.ts

@@ -8,4 +8,5 @@ export declare const Modal: (props: {
     onCloseRequest(): void;
     labelledBy: string;
     theme?: AppState["theme"];
+    closeOnClickOutside?: boolean;
 }) => React.ReactPortal | null;

package/types/components/PasteChartDialog.d.ts

@@ -5,5 +5,5 @@ export declare const PasteChartDialog: ({ setAppState, appState, onClose, onInse
     appState: AppState;
     onClose: () => void;
     setAppState: React.Component<any, AppState>["setState"];
-    onInsertChart: (elements: LibraryItem) => void;
+    onInsertChart: (elements: LibraryItem["elements"]) => void;
 }) => JSX.Element;

package/types/components/PenModeButton.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+import "./ToolIcon.scss";
+declare type PenModeIconProps = {
+    title?: string;
+    name?: string;
+    checked: boolean;
+    onChange?(): void;
+    zenModeEnabled?: boolean;
+    isMobile?: boolean;
+    penDetected: boolean;
+};
+export declare const PenModeButton: (props: PenModeIconProps) => JSX.Element | null;
+export {};

package/types/components/Popover.d.ts

@@ -6,6 +6,10 @@ declare type Props = {
     children?: React.ReactNode;
     onCloseRequest?(event: PointerEvent): void;
     fitInViewport?: boolean;
+    offsetLeft?: number;
+    offsetTop?: number;
+    viewportWidth?: number;
+    viewportHeight?: number;
 };
-export declare const Popover: ({ children, left, top, onCloseRequest, fitInViewport, }: Props) => JSX.Element;
+export declare const Popover: ({ children, left, top, onCloseRequest, fitInViewport, offsetLeft, offsetTop, viewportWidth, viewportHeight, }: Props) => JSX.Element;
 export {};

package/types/components/PublishLibrary.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+import { AppState, LibraryItems } from "../types";
+import "./PublishLibrary.scss";
+declare const PublishLibrary: ({ onClose, libraryItems, appState, onSuccess, onError, updateItemsInStorage, onRemove, }: {
+    onClose: () => void;
+    libraryItems: LibraryItems;
+    appState: AppState;
+    onSuccess: (data: {
+        url: string;
+        authorName: string;
+        items: LibraryItems;
+    }) => void;
+    onError: (error: Error) => void;
+    updateItemsInStorage: (items: LibraryItems) => void;
+    onRemove: (id: string) => void;
+}) => JSX.Element;
+export default PublishLibrary;

package/types/components/SidebarLockButton.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import "./ToolIcon.scss";
+import "./SidebarLockButton.scss";
+declare type SidebarLockIconProps = {
+    checked: boolean;
+    onChange?(): void;
+};
+export declare const SidebarLockButton: (props: SidebarLockIconProps) => JSX.Element;
+export {};

package/types/components/SingleLibraryItem.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { AppState, LibraryItem } from "../types";
+import "./SingleLibraryItem.scss";
+declare const SingleLibraryItem: ({ libItem, appState, index, onChange, onRemove, }: {
+    libItem: LibraryItem;
+    appState: AppState;
+    index: number;
+    onChange: (val: string, index: number) => void;
+    onRemove: (id: string) => void;
+}) => JSX.Element;
+export default SingleLibraryItem;

package/types/components/Spinner.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import "./Spinner.scss";
+declare const Spinner: ({ size, circleWidth, }: {
+    size?: string | number | undefined;
+    circleWidth?: number | undefined;
+}) => JSX.Element;
+export default Spinner;

package/types/components/Stack.d.ts

@@ -10,6 +10,6 @@ declare type StackProps = {
 };
 declare const _default: {
     Row: ({ children, gap, align, justifyContent, className, style, }: StackProps) => JSX.Element;
-    Col: ({ children, gap, align, justifyContent, className, }: StackProps) => JSX.Element;
+    Col: ({ children, gap, align, justifyContent, className, style, }: StackProps) => JSX.Element;
 };
 export default _default;

package/types/components/ToolButton.d.ts

@@ -1,5 +1,6 @@
 import "./ToolIcon.scss";
 import React from "react";
+import { PointerType } from "../element/types";
 export declare type ToolButtonSize = "small" | "medium";
 declare type ToolButtonBaseProps = {
     icon?: React.ReactNode;
@@ -17,11 +18,16 @@ declare type ToolButtonBaseProps = {
     visible?: boolean;
     selected?: boolean;
     className?: string;
+    isLoading?: boolean;
 };
 declare type ToolButtonProps = (ToolButtonBaseProps & {
     type: "button";
     children?: React.ReactNode;
-    onClick?(): void;
+    onClick?(event: React.MouseEvent): void;
+}) | (ToolButtonBaseProps & {
+    type: "submit";
+    children?: React.ReactNode;
+    onClick?(event: React.MouseEvent): void;
 }) | (ToolButtonBaseProps & {
     type: "icon";
     children?: React.ReactNode;
@@ -29,7 +35,12 @@ declare type ToolButtonProps = (ToolButtonBaseProps & {
 }) | (ToolButtonBaseProps & {
     type: "radio";
     checked: boolean;
-    onChange?(): void;
+    onChange?(data: {
+        pointerType: PointerType | null;
+    }): void;
+    onPointerDown?(data: {
+        pointerType: PointerType;
+    }): void;
 });
 export declare const ToolButton: React.ForwardRefExoticComponent<ToolButtonProps & React.RefAttributes<unknown>>;
 export {};

package/types/components/Tooltip.d.ts

@@ -1,9 +1,17 @@
 import "./Tooltip.scss";
 import React from "react";
+export declare const getTooltipDiv: () => HTMLDivElement;
+export declare const updateTooltipPosition: (tooltip: HTMLDivElement, item: {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+}, position?: "bottom" | "top") => void;
 declare type TooltipProps = {
     children: React.ReactNode;
     label: string;
     long?: boolean;
+    style?: React.CSSProperties;
 };
-export declare const Tooltip: ({ children, label, long }: TooltipProps) => JSX.Element;
+export declare const Tooltip: ({ children, label, long, style, }: TooltipProps) => JSX.Element;
 export {};

package/types/components/UserList.d.ts

@@ -1,9 +1,10 @@
 import "./UserList.scss";
 import React from "react";
-declare type UserListProps = {
-    children: React.ReactNode;
+import { AppState } from "../types";
+import { ActionManager } from "../actions/manager";
+export declare const UserList: React.FC<{
     className?: string;
     mobile?: boolean;
-};
-export declare const UserList: ({ children, className, mobile }: UserListProps) => JSX.Element;
-export {};
+    collaborators: AppState["collaborators"];
+    actionManager: ActionManager;
+}>;

package/types/components/icons.d.ts

@@ -1,4 +1,5 @@
 import React from "react";
+import { Theme } from "../element/types";
 declare type Opts = {
     width?: number;
     height?: number;
@@ -28,40 +29,40 @@ export declare const shareIOS: JSX.Element;
 export declare const shareWindows: JSX.Element;
 export declare const resetZoom: JSX.Element;
 export declare const BringForwardIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const SendBackwardIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const BringToFrontIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const SendToBackIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const AlignTopIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const AlignBottomIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const AlignLeftIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const AlignRightIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const DistributeHorizontallyIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const DistributeVerticallyIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const CenterVerticallyIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const CenterHorizontallyIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const users: JSX.Element;
 export declare const start: JSX.Element;
@@ -72,91 +73,107 @@ export declare const clone: JSX.Element;
 export declare const shield: JSX.Element;
 export declare const file: JSX.Element;
 export declare const GroupIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const UngroupIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const FillHachureIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const FillCrossHatchIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const FillSolidIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const StrokeWidthIcon: React.MemoExoticComponent<({ theme, strokeWidth }: {
-    theme: "light" | "dark";
+    theme: Theme;
     strokeWidth: number;
 }) => JSX.Element>;
 export declare const StrokeStyleSolidIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const StrokeStyleDashedIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const StrokeStyleDottedIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const SloppinessArchitectIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const SloppinessArtistIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const SloppinessCartoonistIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const EdgeSharpIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const EdgeRoundIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const ArrowheadNoneIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const ArrowheadArrowIcon: React.MemoExoticComponent<({ theme, flip }: {
-    theme: "light" | "dark";
+    theme: Theme;
     flip?: boolean | undefined;
 }) => JSX.Element>;
 export declare const ArrowheadDotIcon: React.MemoExoticComponent<({ theme, flip }: {
-    theme: "light" | "dark";
+    theme: Theme;
     flip?: boolean | undefined;
 }) => JSX.Element>;
 export declare const ArrowheadBarIcon: React.MemoExoticComponent<({ theme, flip }: {
-    theme: "light" | "dark";
+    theme: Theme;
+    flip?: boolean | undefined;
+}) => JSX.Element>;
+export declare const ArrowheadTriangleIcon: React.MemoExoticComponent<({ theme, flip }: {
+    theme: Theme;
     flip?: boolean | undefined;
 }) => JSX.Element>;
 export declare const FontSizeSmallIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const FontSizeMediumIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const FontSizeLargeIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const FontSizeExtraLargeIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const FontFamilyHandDrawnIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const FontFamilyNormalIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const FontFamilyCodeIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const TextAlignLeftIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const TextAlignCenterIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
 }) => JSX.Element>;
 export declare const TextAlignRightIcon: React.MemoExoticComponent<({ theme }: {
-    theme: "light" | "dark";
+    theme: Theme;
+}) => JSX.Element>;
+export declare const TextAlignTopIcon: React.MemoExoticComponent<({ theme }: {
+    theme: Theme;
+}) => JSX.Element>;
+export declare const TextAlignBottomIcon: React.MemoExoticComponent<({ theme }: {
+    theme: Theme;
+}) => JSX.Element>;
+export declare const TextAlignMiddleIcon: React.MemoExoticComponent<({ theme }: {
+    theme: Theme;
 }) => JSX.Element>;
+export declare const publishIcon: JSX.Element;
+export declare const editIcon: JSX.Element;
+export declare const eraser: JSX.Element;
 export {};