feat: add renderTopRight prop & remove GH corner from core (#3539)

* feat: add `renderTopRight` prop & remove GH corner from core

* reuse `--space-factor` var

* update readme & changelog

src/packages/excalidraw/CHANGELOG.md

@@ -11,6 +11,14 @@ The change should be grouped under one of the below section and must contain PR
 Please add the latest change on the top under the correct section.
 -->
 
+## Unreleased
+
+## Excalidraw API
+
+- Add support to render custom UI in the top right corner via [`renderTopRight`](https://github.com/excalidraw/excalidraw/blob/master/src/packages/excalidraw/README.md#renderTopRight) prop [#3539](https://github.com/excalidraw/excalidraw/pull/3539).
+
+  This also removes the GitHub icon, keeping it local to the https://excalidraw.com app.
+
 ## 0.7.0 (2021-04-26)
 
 ## Excalidraw API

src/packages/excalidraw/README_NEXT.md

@@ -355,6 +355,7 @@ To view the full example visit :point_down:
 | [`onPointerUpdate`](#onPointerUpdate) | Function |  | Callback triggered when mouse pointer is updated. |
 | [`onExportToBackend`](#onExportToBackend) | Function |  | Callback triggered when link button is clicked on export dialog |
 | [`langCode`](#langCode) | string | `en` | Language code string |
+| [`renderTopRight `](#renderTopRight) | Function |  | Function that renders custom UI in top right corner |
 | [`renderFooter `](#renderFooter) | Function |  | Function that renders custom UI footer |
 | [`renderCustomStats`](#renderCustomStats) | Function |  | Function that can be used to render custom stats on the stats dialog. |
 | [`viewModeEnabled`](#viewModeEnabled) | boolean |  | This implies if the app is in view mode. |
@@ -502,9 +503,13 @@ import { defaultLang, languages } from "@excalidraw/excalidraw";
 | defaultLang | string |
 | languages | [Language[]](https://github.com/excalidraw/excalidraw/blob/master/src/i18n.ts#L8) |
 
+#### `renderTopRight`
+
+A function returning JSX to render custom UI in the top right corner of the app.
+
 #### `renderFooter`
 
-A function that renders (returns JSX) custom UI footer. For example, you can use this to render a language picker that was previously being rendered by Excalidraw itself (for now, you'll need to implement your own language picker).
+A function returning JSX to render custom UI footer. For example, you can use this to render a language picker that was previously being rendered by Excalidraw itself (for now, you'll need to implement your own language picker).
 
 #### `renderCustomStats`
 

src/packages/excalidraw/index.tsx

@@ -20,6 +20,7 @@ const Excalidraw = (props: ExcalidrawProps) => {
     isCollaborating,
     onPointerUpdate,
     onExportToBackend,
+    renderTopRight,
     renderFooter,
     langCode = defaultLang.code,
     viewModeEnabled,
@@ -72,6 +73,7 @@ const Excalidraw = (props: ExcalidrawProps) => {
         isCollaborating={isCollaborating}
         onPointerUpdate={onPointerUpdate}
         onExportToBackend={onExportToBackend}
+        renderTopRight={renderTopRight}
         renderFooter={renderFooter}
         langCode={langCode}
         viewModeEnabled={viewModeEnabled}