From 25e2f807091dd1d70e30faa7b8523b812174429f Mon Sep 17 00:00:00 2001 From: Aakansha Doshi Date: Fri, 14 Jul 2023 14:50:27 +0530 Subject: [PATCH] let host call convertToExcalidrawElements when using programmatic API --- src/components/App.tsx | 5 +---- src/data/restore.ts | 7 +++++-- src/data/transform.test.ts | 34 +++++++++++++++++++++------------- src/data/transform.ts | 32 ++++++++++++++++++++++++++++++-- src/data/types.ts | 28 +--------------------------- 5 files changed, 58 insertions(+), 48 deletions(-) diff --git a/src/components/App.tsx b/src/components/App.tsx index 23fd0212ab..64ce1a5b9f 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -304,7 +304,6 @@ import { jotaiStore } from "../jotai"; import { activeConfirmDialogAtom } from "./ActiveConfirmDialog"; import { actionWrapTextInContainer } from "../actions/actionBoundText"; import BraveMeasureTextError from "./BraveMeasureTextError"; -import { convertToExcalidrawElements } from "../data/transform"; import { activeEyeDropperAtom } from "./EyeDropper"; const AppContext = React.createContext(null!); @@ -2097,9 +2096,7 @@ class App extends React.Component { } if (sceneData.elements) { - this.scene.replaceAllElements( - convertToExcalidrawElements(sceneData.elements), - ); + this.scene.replaceAllElements(sceneData.elements); } if (sceneData.collaborators) { diff --git a/src/data/restore.ts b/src/data/restore.ts index d9662a888c..b116a204d5 100644 --- a/src/data/restore.ts +++ b/src/data/restore.ts @@ -41,7 +41,10 @@ import { getDefaultLineHeight, measureBaseline, } from "../element/textElement"; -import { convertToExcalidrawElements } from "../data/transform"; +import { + ExcalidrawProgrammaticAPI, + convertToExcalidrawElements, +} from "../data/transform"; type RestoredAppState = Omit< AppState, @@ -366,7 +369,7 @@ const repairBoundElement = ( }; export const restoreElements = ( - elements: ImportedDataState["elements"], + elements: ExcalidrawProgrammaticAPI["elements"], /** NOTE doesn't serve for reconciliation */ localElements: readonly ExcalidrawElement[] | null | undefined, opts?: { refreshDimensions?: boolean; repairBindings?: boolean } | undefined, diff --git a/src/data/transform.test.ts b/src/data/transform.test.ts index 7ff49002ee..409e06f96e 100644 --- a/src/data/transform.test.ts +++ b/src/data/transform.test.ts @@ -1,5 +1,7 @@ -import { convertToExcalidrawElements } from "./transform"; -import { ImportedDataState } from "./types"; +import { + ExcalidrawProgrammaticAPI, + convertToExcalidrawElements, +} from "./transform"; describe("Test Transform", () => { it("should transform regular shapes", () => { @@ -54,7 +56,9 @@ describe("Test Transform", () => { ]; expect( - convertToExcalidrawElements(elements as ImportedDataState["elements"]), + convertToExcalidrawElements( + elements as ExcalidrawProgrammaticAPI["elements"], + ), ).toMatchSnapshot(); }); @@ -76,7 +80,9 @@ describe("Test Transform", () => { }, ]; expect( - convertToExcalidrawElements(elements as ImportedDataState["elements"]), + convertToExcalidrawElements( + elements as ExcalidrawProgrammaticAPI["elements"], + ), ).toMatchSnapshot(); }); @@ -111,7 +117,7 @@ describe("Test Transform", () => { }, ]; const excaldrawElements = convertToExcalidrawElements( - elements as ImportedDataState["elements"], + elements as ExcalidrawProgrammaticAPI["elements"], ); expect(excaldrawElements.length).toBe(4); @@ -193,7 +199,7 @@ describe("Test Transform", () => { }, ]; const excaldrawElements = convertToExcalidrawElements( - elements as ImportedDataState["elements"], + elements as ExcalidrawProgrammaticAPI["elements"], ); expect(excaldrawElements.length).toBe(12); @@ -250,7 +256,7 @@ describe("Test Transform", () => { }, ]; const excaldrawElements = convertToExcalidrawElements( - elements as ImportedDataState["elements"], + elements as ExcalidrawProgrammaticAPI["elements"], ); expect(excaldrawElements.length).toBe(8); @@ -283,7 +289,7 @@ describe("Test Transform", () => { }, ]; const excaldrawElements = convertToExcalidrawElements( - elements as ImportedDataState["elements"], + elements as ExcalidrawProgrammaticAPI["elements"], ); expect(excaldrawElements.length).toBe(4); @@ -366,7 +372,7 @@ describe("Test Transform", () => { ]; const excaldrawElements = convertToExcalidrawElements( - elements as ImportedDataState["elements"], + elements as ExcalidrawProgrammaticAPI["elements"], ); expect(excaldrawElements.length).toBe(4); @@ -482,7 +488,7 @@ describe("Test Transform", () => { ]; const excaldrawElements = convertToExcalidrawElements( - elements as ImportedDataState["elements"], + elements as ExcalidrawProgrammaticAPI["elements"], ); expect(excaldrawElements.length).toBe(5); @@ -530,7 +536,7 @@ describe("Test Transform", () => { ]; const excaldrawElements = convertToExcalidrawElements( - elements as ImportedDataState["elements"], + elements as ExcalidrawProgrammaticAPI["elements"], ); expect(excaldrawElements.length).toBe(4); @@ -580,7 +586,7 @@ describe("Test Transform", () => { ]; const excaldrawElements = convertToExcalidrawElements( - elements as ImportedDataState["elements"], + elements as ExcalidrawProgrammaticAPI["elements"], ); expect(excaldrawElements.length).toBe(4); @@ -622,7 +628,9 @@ describe("Test Transform", () => { }, ]; expect( - convertToExcalidrawElements(elements as ImportedDataState["elements"]), + convertToExcalidrawElements( + elements as ExcalidrawProgrammaticAPI["elements"], + ), ).toMatchSnapshot(); }); }); diff --git a/src/data/transform.ts b/src/data/transform.ts index 591cb18f3e..beb5000ca3 100644 --- a/src/data/transform.ts +++ b/src/data/transform.ts @@ -24,15 +24,43 @@ import { import { ExcalidrawBindableElement, ExcalidrawElement, + ExcalidrawFreeDrawElement, ExcalidrawGenericElement, ExcalidrawImageElement, ExcalidrawLinearElement, + ExcalidrawSelectionElement, ExcalidrawTextElement, } from "../element/types"; import { MarkOptional } from "../utility-types"; import { getFontString } from "../utils"; -import { ImportedDataState, ValidContainer, ValidLinearElement } from "./types"; +import { ValidContainer, ValidLinearElement } from "./types"; +export interface ExcalidrawProgrammaticAPI { + elements?: + | readonly ( + | Extract< + ExcalidrawElement, + | ExcalidrawSelectionElement + | ExcalidrawImageElement + | ExcalidrawFreeDrawElement + > + | ({ + type: Extract; + x: number; + y: number; + } & Partial) + | ValidContainer + | ValidLinearElement + | ({ + type: "text"; + text: string; + x: number; + y: number; + id?: ExcalidrawTextElement["id"]; + } & Partial) + )[] + | null; +} export const ELEMENTS_SUPPORTING_PROGRAMMATIC_API = [ "rectangle", "ellipse", @@ -307,7 +335,7 @@ const excalidrawElements = (() => { })(); export const convertToExcalidrawElements = ( - elements: ImportedDataState["elements"], + elements: ExcalidrawProgrammaticAPI["elements"], ): ExcalidrawElement[] => { excalidrawElements.clear(); if (!elements) { diff --git a/src/data/types.ts b/src/data/types.ts index c154af6252..ff61e242e8 100644 --- a/src/data/types.ts +++ b/src/data/types.ts @@ -1,11 +1,8 @@ import { ExcalidrawBindableElement, ExcalidrawElement, - ExcalidrawFreeDrawElement, ExcalidrawGenericElement, - ExcalidrawImageElement, ExcalidrawLinearElement, - ExcalidrawSelectionElement, ExcalidrawTextElement, FontFamilyValues, TextAlign, @@ -137,30 +134,7 @@ export interface ImportedDataState { type?: string; version?: number; source?: string; - elements?: - | readonly ( - | Extract< - ExcalidrawElement, - | ExcalidrawSelectionElement - | ExcalidrawImageElement - | ExcalidrawFreeDrawElement - > - | ({ - type: Extract; - x: number; - y: number; - } & Partial) - | ValidContainer - | ValidLinearElement - | ({ - type: "text"; - text: string; - x: number; - y: number; - id?: ExcalidrawTextElement["id"]; - } & Partial) - )[] - | null; + elements?: readonly ExcalidrawElement[] | null; appState?: Readonly< Partial< AppState & {