smig/excalidraw
1
0
Fork 0
mirror of https://github.com/excalidraw/excalidraw.git synced 2025-05-03 10:00:07 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: support custom UI rendering inside export dialog (#3666)

Browse source 
* feat: support custom UI rendering inside export dialog

* docs

* add

* remove assertion

Co-authored-by: dwelle <luzar.david@gmail.com>
This commit is contained in:
Aakansha Doshi 2021-05-30 00:37:38 +05:30 • committed by GitHub
parent 0912fe1c93
commit d63b6a3469
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 25 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/components/JSONExportDialog.tsx
View file

@ -22,16 +22,17 @@ const JSONExportModal = ({
elements,
appState,
actionManager,
onExportToBackend,
exportOpts,
canvas,
}: {
appState: AppState;
elements: readonly NonDeletedExcalidrawElement[];
actionManager: ActionsManagerInterface;
onExportToBackend?: ExportCB;
onCloseRequest: () => void;
exportOpts: ExportOpts;
canvas: HTMLCanvasElement | null;
}) => {
const { onExportToBackend } = exportOpts;
return (
<div className="ExportDialog ExportDialog--json">
<div className="ExportDialog-cards">
@ -55,7 +56,7 @@ const JSONExportModal = ({
/>
</Card>
)}
{exportOpts.onExportToBackend && (
{onExportToBackend && (
<Card color="pink">
<div className="Card-icon">{link}</div>
<h2>{t("exportDialog.link_title")}</h2>
@ -66,10 +67,12 @@ const JSONExportModal = ({
title={t("exportDialog.link_button")}
aria-label={t("exportDialog.link_button")}
showAriaLabel={true}
onClick={() => onExportToBackend!(elements)}
onClick={() => onExportToBackend(elements, appState, canvas)}
/>
</Card>
)}
{exportOpts.renderCustomUI &&
exportOpts.renderCustomUI(elements, appState, canvas)}
</div>
</div>
);
@ -79,14 +82,14 @@ export const JSONExportDialog = ({
elements,
appState,
actionManager,
onExportToBackend,
exportOpts,
canvas,
}: {
appState: AppState;
elements: readonly NonDeletedExcalidrawElement[];
actionManager: ActionsManagerInterface;
onExportToBackend?: ExportCB;
exportOpts: ExportOpts;
canvas: HTMLCanvasElement | null;
}) => {
const [modalIsShown, setModalIsShown] = useState(false);
@ -113,9 +116,9 @@ export const JSONExportDialog = ({
elements={elements}
appState={appState}
actionManager={actionManager}
onExportToBackend={onExportToBackend}
onCloseRequest={handleClose}
exportOpts={exportOpts}
canvas={canvas}
/>
</Dialog>
)}

9
src/components/LayerUI.tsx
View file

@ -387,15 +387,8 @@ const LayerUI = ({
elements={elements}
appState={appState}
actionManager={actionManager}
onExportToBackend={(elements) => {
UIOptions.canvasActions.export.onExportToBackend &&
UIOptions.canvasActions.export.onExportToBackend(
elements,
appState,
canvas,
);
}}
exportOpts={UIOptions.canvasActions.export}
canvas={canvas}
/>
);
};