@excalidraw/excalidraw 0.11.0-5346-c4f5d00 → 0.11.0-5346-513c9cb
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +1 -1
- package/README.md +39 -41
- package/dist/excalidraw.development.js +13 -13
- package/dist/excalidraw.production.min.js +1 -1
- package/package.json +3 -3
- package/types/data/filesystem.d.ts +2 -2
- package/types/utils.d.ts +1 -0
- package/README_NEXT.md +0 -1345
package/CHANGELOG.md
CHANGED
|
@@ -165,7 +165,7 @@ React.createElement(ExcalidrawLib.Excalidraw, opts);
|
|
|
165
165
|
|
|
166
166
|
### Build
|
|
167
167
|
|
|
168
|
-
- Release preview
|
|
168
|
+
- Release preview package [@excalidraw/excalidraw-preview](https://www.npmjs.com/package/@excalidraw/excalidraw-preview) when triggered via comment
|
|
169
169
|
|
|
170
170
|
```
|
|
171
171
|
@excalibot trigger release
|
package/README.md
CHANGED
|
@@ -1,12 +1,6 @@
|
|
|
1
|
-
|
|
1
|
+
#### Note
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
**This is an unstable release and not recommended for production. If you don't want to wait for the stable release and try out the unreleased changes you can use this.**
|
|
6
|
-
|
|
7
|
-
For stable release please use [@excalidraw/excalidraw](https://www.npmjs.com/package/@excalidraw/excalidraw).
|
|
8
|
-
|
|
9
|
-
<!-- unstable-readme-end-->
|
|
3
|
+
⚠️ ⚠️ ⚠️ You are viewing the docs for the **next** release, in case you want to check the docs for the stable release, you can view it [here](https://www.npmjs.com/package/@excalidraw/excalidraw).
|
|
10
4
|
|
|
11
5
|
### Excalidraw
|
|
12
6
|
|
|
@@ -17,23 +11,27 @@ Excalidraw exported as a component to directly embed in your projects.
|
|
|
17
11
|
You can use npm
|
|
18
12
|
|
|
19
13
|
```
|
|
20
|
-
npm install react react-dom @excalidraw/excalidraw
|
|
14
|
+
npm install react react-dom @excalidraw/excalidraw
|
|
21
15
|
```
|
|
22
16
|
|
|
23
17
|
or via yarn
|
|
24
18
|
|
|
25
19
|
```
|
|
26
|
-
yarn add react react-dom @excalidraw/excalidraw
|
|
20
|
+
yarn add react react-dom @excalidraw/excalidraw
|
|
27
21
|
```
|
|
28
22
|
|
|
29
23
|
After installation you will see a folder `excalidraw-assets` and `excalidraw-assets-dev` in `dist` directory which contains the assets needed for this app in prod and dev mode respectively.
|
|
30
24
|
|
|
31
25
|
Move the folder `excalidraw-assets` and `excalidraw-assets-dev` to the path where your assets are served.
|
|
32
26
|
|
|
33
|
-
By default it will try to load the files from `https://unpkg.com/@excalidraw/excalidraw
|
|
27
|
+
By default it will try to load the files from `https://unpkg.com/@excalidraw/excalidraw/dist/`
|
|
34
28
|
|
|
35
29
|
If you want to load assets from a different path you can set a variable `window.EXCALIDRAW_ASSET_PATH` depending on environment (for example if you have different URL's for dev and prod) to the url from where you want to load the assets.
|
|
36
30
|
|
|
31
|
+
#### Note
|
|
32
|
+
|
|
33
|
+
**If you don't want to wait for the next stable release and try out the unreleased changes you can use `@excalidraw/excalidraw@next`.**
|
|
34
|
+
|
|
37
35
|
### Demo
|
|
38
36
|
|
|
39
37
|
[Try here](https://codesandbox.io/s/excalidraw-ehlz3).
|
|
@@ -48,7 +46,7 @@ If you are using a Web bundler (for instance, Webpack), you can import it as an
|
|
|
48
46
|
|
|
49
47
|
```js
|
|
50
48
|
import React, { useEffect, useState, useRef } from "react";
|
|
51
|
-
import { Excalidraw } from "@excalidraw/excalidraw
|
|
49
|
+
import { Excalidraw } from "@excalidraw/excalidraw";
|
|
52
50
|
import InitialData from "./initialData";
|
|
53
51
|
|
|
54
52
|
import "./styles.scss";
|
|
@@ -166,13 +164,13 @@ import { useState, useEffect } from "react";
|
|
|
166
164
|
export default function IndexPage() {
|
|
167
165
|
const [Comp, setComp] = useState(null);
|
|
168
166
|
useEffect(() => {
|
|
169
|
-
import("@excalidraw/excalidraw
|
|
167
|
+
import("@excalidraw/excalidraw").then((comp) => setComp(comp.default));
|
|
170
168
|
}, []);
|
|
171
169
|
return <>{Comp && <Comp />}</>;
|
|
172
170
|
}
|
|
173
171
|
```
|
|
174
172
|
|
|
175
|
-
The `types` are available at `@excalidraw/excalidraw
|
|
173
|
+
The `types` are available at `@excalidraw/excalidraw/types`, you can view [example for typescript](https://codesandbox.io/s/excalidraw-types-9h2dm)
|
|
176
174
|
|
|
177
175
|
#### In Browser
|
|
178
176
|
|
|
@@ -183,7 +181,7 @@ For development use :point_down:
|
|
|
183
181
|
```js
|
|
184
182
|
<script
|
|
185
183
|
type="text/javascript"
|
|
186
|
-
src="https://unpkg.com/@excalidraw/excalidraw
|
|
184
|
+
src="https://unpkg.com/@excalidraw/excalidraw/dist/excalidraw.development.js"
|
|
187
185
|
></script>
|
|
188
186
|
```
|
|
189
187
|
|
|
@@ -192,7 +190,7 @@ For production use :point_down:
|
|
|
192
190
|
```js
|
|
193
191
|
<script
|
|
194
192
|
type="text/javascript"
|
|
195
|
-
src="https://unpkg.com/@excalidraw/excalidraw
|
|
193
|
+
src="https://unpkg.com/@excalidraw/excalidraw/dist/excalidraw.production.min.js"
|
|
196
194
|
></script>
|
|
197
195
|
```
|
|
198
196
|
|
|
@@ -211,7 +209,7 @@ You will need to make sure `react`, `react-dom` is available as shown in the bel
|
|
|
211
209
|
|
|
212
210
|
<script
|
|
213
211
|
type="text/javascript"
|
|
214
|
-
src="https://unpkg.com/@excalidraw/excalidraw
|
|
212
|
+
src="https://unpkg.com/@excalidraw/excalidraw/dist/excalidraw.development.js"
|
|
215
213
|
></script>
|
|
216
214
|
</head>
|
|
217
215
|
|
|
@@ -585,7 +583,7 @@ This callback is triggered when mouse pointer is updated.
|
|
|
585
583
|
Determines the language of the UI. It should be one of the [available language codes](https://github.com/excalidraw/excalidraw/blob/master/src/i18n.ts#L14). Defaults to `en` (English). We also export default language and supported languages which you can import as shown below.
|
|
586
584
|
|
|
587
585
|
```js
|
|
588
|
-
import { defaultLang, languages } from "@excalidraw/excalidraw
|
|
586
|
+
import { defaultLang, languages } from "@excalidraw/excalidraw";
|
|
589
587
|
```
|
|
590
588
|
|
|
591
589
|
| name | type |
|
|
@@ -829,7 +827,7 @@ restoreAppState(appState: <a href="https://github.com/excalidraw/excalidraw/blob
|
|
|
829
827
|
**_How to use_**
|
|
830
828
|
|
|
831
829
|
```js
|
|
832
|
-
import { restoreAppState } from "@excalidraw/excalidraw
|
|
830
|
+
import { restoreAppState } from "@excalidraw/excalidraw";
|
|
833
831
|
```
|
|
834
832
|
|
|
835
833
|
This function will make sure all the keys have appropriate values in [appState](https://github.com/excalidraw/excalidraw/blob/master/src/types.ts#L79) and if any key is missing, it will be set to default value.
|
|
@@ -847,7 +845,7 @@ restoreElements(elements: <a href="https://github.com/excalidraw/excalidraw/blob
|
|
|
847
845
|
**_How to use_**
|
|
848
846
|
|
|
849
847
|
```js
|
|
850
|
-
import { restoreElements } from "@excalidraw/excalidraw
|
|
848
|
+
import { restoreElements } from "@excalidraw/excalidraw";
|
|
851
849
|
```
|
|
852
850
|
|
|
853
851
|
This function will make sure all properties of element is correctly set and if any attribute is missing, it will be set to default value.
|
|
@@ -867,7 +865,7 @@ See [`restoreAppState()`](https://github.com/excalidraw/excalidraw/blob/master/s
|
|
|
867
865
|
**_How to use_**
|
|
868
866
|
|
|
869
867
|
```js
|
|
870
|
-
import { restore } from "@excalidraw/excalidraw
|
|
868
|
+
import { restore } from "@excalidraw/excalidraw";
|
|
871
869
|
```
|
|
872
870
|
|
|
873
871
|
This function makes sure elements and state is set to appropriate values and set to default value if not present. It is a combination of [restoreElements](#restoreElements) and [restoreAppState](#restoreAppState).
|
|
@@ -883,7 +881,7 @@ restoreLibraryItems(libraryItems: <a href="https://github.com/excalidraw/excalid
|
|
|
883
881
|
**_How to use_**
|
|
884
882
|
|
|
885
883
|
```js
|
|
886
|
-
import { restoreLibraryItems } from "@excalidraw/excalidraw
|
|
884
|
+
import { restoreLibraryItems } from "@excalidraw/excalidraw";
|
|
887
885
|
|
|
888
886
|
restoreLibraryItems(libraryItems, "unpublished");
|
|
889
887
|
```
|
|
@@ -916,7 +914,7 @@ This function normalizes library items elements, adding missing values when need
|
|
|
916
914
|
**How to use**
|
|
917
915
|
|
|
918
916
|
```js
|
|
919
|
-
import { exportToCanvas } from "@excalidraw/excalidraw
|
|
917
|
+
import { exportToCanvas } from "@excalidraw/excalidraw";
|
|
920
918
|
```
|
|
921
919
|
|
|
922
920
|
This function returns the canvas with the exported elements, appState and dimensions.
|
|
@@ -942,7 +940,7 @@ exportToBlob(
|
|
|
942
940
|
**How to use**
|
|
943
941
|
|
|
944
942
|
```js
|
|
945
|
-
import { exportToBlob } from "@excalidraw/excalidraw
|
|
943
|
+
import { exportToBlob } from "@excalidraw/excalidraw";
|
|
946
944
|
```
|
|
947
945
|
|
|
948
946
|
Returns a promise which resolves with a [blob](https://developer.mozilla.org/en-US/docs/Web/API/Blob). It internally uses [canvas.ToBlob](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toBlob).
|
|
@@ -993,7 +991,7 @@ exportToClipboard(
|
|
|
993
991
|
**How to use**
|
|
994
992
|
|
|
995
993
|
```js
|
|
996
|
-
import { exportToClipboard } from "@excalidraw/excalidraw
|
|
994
|
+
import { exportToClipboard } from "@excalidraw/excalidraw";
|
|
997
995
|
```
|
|
998
996
|
|
|
999
997
|
Copies the scene data in the specified format (determined by `type`) to clipboard.
|
|
@@ -1042,7 +1040,7 @@ If you want to overwrite the source field in the JSON string, you can set `windo
|
|
|
1042
1040
|
**How to use**
|
|
1043
1041
|
|
|
1044
1042
|
<pre>
|
|
1045
|
-
import { getSceneVersion } from "@excalidraw/excalidraw
|
|
1043
|
+
import { getSceneVersion } from "@excalidraw/excalidraw";
|
|
1046
1044
|
getSceneVersion(elements: <a href="https://github.com/excalidraw/excalidraw/blob/master/src/element/types.ts#L106">ExcalidrawElement[]</a>)
|
|
1047
1045
|
</pre>
|
|
1048
1046
|
|
|
@@ -1059,7 +1057,7 @@ isInvisiblySmallElement(element: <a href="https://github.com/excalidraw/excalid
|
|
|
1059
1057
|
**How to use**
|
|
1060
1058
|
|
|
1061
1059
|
```js
|
|
1062
|
-
import { isInvisiblySmallElement } from "@excalidraw/excalidraw
|
|
1060
|
+
import { isInvisiblySmallElement } from "@excalidraw/excalidraw";
|
|
1063
1061
|
```
|
|
1064
1062
|
|
|
1065
1063
|
Returns `true` if element is invisibly small (e.g. width & height are zero).
|
|
@@ -1067,7 +1065,7 @@ Returns `true` if element is invisibly small (e.g. width & height are zero).
|
|
|
1067
1065
|
#### `loadLibraryFromBlob`
|
|
1068
1066
|
|
|
1069
1067
|
```js
|
|
1070
|
-
import { loadLibraryFromBlob } from "@excalidraw/excalidraw
|
|
1068
|
+
import { loadLibraryFromBlob } from "@excalidraw/excalidraw";
|
|
1071
1069
|
```
|
|
1072
1070
|
|
|
1073
1071
|
**_Signature_**
|
|
@@ -1083,7 +1081,7 @@ This function loads the library from the blob.
|
|
|
1083
1081
|
**How to use**
|
|
1084
1082
|
|
|
1085
1083
|
```js
|
|
1086
|
-
import { loadFromBlob } from "@excalidraw/excalidraw
|
|
1084
|
+
import { loadFromBlob } from "@excalidraw/excalidraw";
|
|
1087
1085
|
|
|
1088
1086
|
const scene = await loadFromBlob(file, null, null);
|
|
1089
1087
|
excalidrawAPI.updateScene(scene);
|
|
@@ -1135,7 +1133,7 @@ This function loads either scene or library data from the supplied blob. If the
|
|
|
1135
1133
|
**How to use**
|
|
1136
1134
|
|
|
1137
1135
|
```js
|
|
1138
|
-
import { getFreeDrawSvgPath } from "@excalidraw/excalidraw
|
|
1136
|
+
import { getFreeDrawSvgPath } from "@excalidraw/excalidraw";
|
|
1139
1137
|
```
|
|
1140
1138
|
|
|
1141
1139
|
**Signature**
|
|
@@ -1151,7 +1149,7 @@ This function returns the free draw svg path for the element.
|
|
|
1151
1149
|
**How to use**
|
|
1152
1150
|
|
|
1153
1151
|
```js
|
|
1154
|
-
import { isLinearElement } from "@excalidraw/excalidraw
|
|
1152
|
+
import { isLinearElement } from "@excalidraw/excalidraw";
|
|
1155
1153
|
```
|
|
1156
1154
|
|
|
1157
1155
|
**Signature**
|
|
@@ -1167,7 +1165,7 @@ This function returns true if the element is linear type (`arrow` |`line`) else
|
|
|
1167
1165
|
**How to use**
|
|
1168
1166
|
|
|
1169
1167
|
```js
|
|
1170
|
-
import { getNonDeletedElements } from "@excalidraw/excalidraw
|
|
1168
|
+
import { getNonDeletedElements } from "@excalidraw/excalidraw";
|
|
1171
1169
|
```
|
|
1172
1170
|
|
|
1173
1171
|
**Signature**
|
|
@@ -1181,7 +1179,7 @@ This function returns an array of deleted elements.
|
|
|
1181
1179
|
#### `mergeLibraryItems`
|
|
1182
1180
|
|
|
1183
1181
|
```js
|
|
1184
|
-
import { mergeLibraryItems } from "@excalidraw/excalidraw
|
|
1182
|
+
import { mergeLibraryItems } from "@excalidraw/excalidraw";
|
|
1185
1183
|
```
|
|
1186
1184
|
|
|
1187
1185
|
**_Signature_**
|
|
@@ -1197,7 +1195,7 @@ This function merges two `LibraryItems` arrays, where unique items from `otherIt
|
|
|
1197
1195
|
**How to use**
|
|
1198
1196
|
|
|
1199
1197
|
```js
|
|
1200
|
-
import { parseLibraryTokensFromUrl } from "@excalidraw/excalidraw
|
|
1198
|
+
import { parseLibraryTokensFromUrl } from "@excalidraw/excalidraw";
|
|
1201
1199
|
```
|
|
1202
1200
|
|
|
1203
1201
|
**Signature**
|
|
@@ -1216,7 +1214,7 @@ Parses library parameters from URL if present (expects the `#addLibrary` hash ke
|
|
|
1216
1214
|
**How to use**
|
|
1217
1215
|
|
|
1218
1216
|
```js
|
|
1219
|
-
import { useHandleLibrary } from "@excalidraw/excalidraw
|
|
1217
|
+
import { useHandleLibrary } from "@excalidraw/excalidraw";
|
|
1220
1218
|
|
|
1221
1219
|
export const App = () => {
|
|
1222
1220
|
// ...
|
|
@@ -1240,7 +1238,7 @@ In the future, we will be adding support for handling library persistence to bro
|
|
|
1240
1238
|
#### `sceneCoordsToViewportCoords`
|
|
1241
1239
|
|
|
1242
1240
|
```js
|
|
1243
|
-
import { sceneCoordsToViewportCoords } from "@excalidraw/excalidraw
|
|
1241
|
+
import { sceneCoordsToViewportCoords } from "@excalidraw/excalidraw";
|
|
1244
1242
|
```
|
|
1245
1243
|
|
|
1246
1244
|
**_Signature_**
|
|
@@ -1254,7 +1252,7 @@ This function returns equivalent viewport coords for the provided scene coords i
|
|
|
1254
1252
|
#### `viewportCoordsToSceneCoords`
|
|
1255
1253
|
|
|
1256
1254
|
```js
|
|
1257
|
-
import { viewportCoordsToSceneCoords } from "@excalidraw/excalidraw
|
|
1255
|
+
import { viewportCoordsToSceneCoords } from "@excalidraw/excalidraw";
|
|
1258
1256
|
```
|
|
1259
1257
|
|
|
1260
1258
|
**_Signature_**
|
|
@@ -1272,7 +1270,7 @@ This function returns equivalent scene coords for the provided viewport coords i
|
|
|
1272
1270
|
**How to use**
|
|
1273
1271
|
|
|
1274
1272
|
```js
|
|
1275
|
-
import { FONT_FAMILY } from "@excalidraw/excalidraw
|
|
1273
|
+
import { FONT_FAMILY } from "@excalidraw/excalidraw";
|
|
1276
1274
|
```
|
|
1277
1275
|
|
|
1278
1276
|
`FONT_FAMILY` contains all the font families used in `Excalidraw` as explained below
|
|
@@ -1290,7 +1288,7 @@ Defaults to `FONT_FAMILY.Virgil` unless passed in `initialData.appState.currentI
|
|
|
1290
1288
|
**How to use**
|
|
1291
1289
|
|
|
1292
1290
|
```js
|
|
1293
|
-
import { THEME } from "@excalidraw/excalidraw
|
|
1291
|
+
import { THEME } from "@excalidraw/excalidraw";
|
|
1294
1292
|
```
|
|
1295
1293
|
|
|
1296
1294
|
`THEME` contains all the themes supported by `Excalidraw` as explained below
|
|
@@ -1307,7 +1305,7 @@ Defaults to `THEME.LIGHT` unless passed in `initialData.appState.theme`
|
|
|
1307
1305
|
**How to use **
|
|
1308
1306
|
|
|
1309
1307
|
```js
|
|
1310
|
-
import { MIME_TYPES } from "@excalidraw/excalidraw
|
|
1308
|
+
import { MIME_TYPES } from "@excalidraw/excalidraw";
|
|
1311
1309
|
```
|
|
1312
1310
|
|
|
1313
1311
|
[`MIME_TYPES`](https://github.com/excalidraw/excalidraw/blob/master/src/constants.ts#L92) contains all the mime types supported by `Excalidraw`.
|
|
@@ -1342,4 +1340,4 @@ You can create a test release by posting the below comment in your pull request
|
|
|
1342
1340
|
@excalibot release package
|
|
1343
1341
|
```
|
|
1344
1342
|
|
|
1345
|
-
Once the version is released `@excalibot` will post a comment with the release version.
|
|
1343
|
+
Once the version is released `@excalibot` will post a comment with the release version.
|