diff --git a/.gitignore b/.gitignore index f21ef9c00..feb368b8f 100644 --- a/.gitignore +++ b/.gitignore @@ -20,3 +20,4 @@ package-lock.json static yarn-debug.log* yarn-error.log* +src/packages/excalidraw/types diff --git a/src/global.d.ts b/src/global.d.ts index 2730f5f76..3a329e971 100644 --- a/src/global.d.ts +++ b/src/global.d.ts @@ -89,3 +89,5 @@ interface Blob { handle?: import("browser-fs-acces").FileSystemHandle; name?: string; } + +declare module "*.scss"; diff --git a/src/packages/excalidraw/CHANGELOG.md b/src/packages/excalidraw/CHANGELOG.md index b8f55c500..61861e879 100644 --- a/src/packages/excalidraw/CHANGELOG.md +++ b/src/packages/excalidraw/CHANGELOG.md @@ -18,6 +18,7 @@ Please add the latest change on the top under the correct section. ### Features +- Export types for the package so now it can be used with typescript[#3337](https://github.com/excalidraw/excalidraw/pull/3337). The types are available at `@excalidraw/excalirdraw/types`. - Add `renderCustomStats` prop to render extra stats on host, and expose `setToastMessage` API via refs which can be used to show toast with custom message [#3360](https://github.com/excalidraw/excalidraw/pull/3360). - Support passing a CSRF token when importing libraries to prevent prompting before installation. The token is passed from [https://libraries.excalidraw.com](https://libraries.excalidraw.com/) using the `token` URL key [#3329](https://github.com/excalidraw/excalidraw/pull/3329). - #### BREAKING CHANGE diff --git a/src/packages/excalidraw/README_NEXT.md b/src/packages/excalidraw/README_NEXT.md index c56f6388a..075aa4f6c 100644 --- a/src/packages/excalidraw/README_NEXT.md +++ b/src/packages/excalidraw/README_NEXT.md @@ -171,6 +171,8 @@ To view the full example visit :point_down: [![Edit excalidraw](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/excalidraw-ehlz3?fontsize=14&hidenavigation=1&theme=dark) + + Since Excalidraw doesn't support server side rendering yet so you will have to make sure the component is rendered once host is mounted. ```js @@ -184,7 +186,7 @@ export default function IndexPage() { } ``` - +The `types` are available at `@excalidraw/excalidraw/types`, you can view [example for typescript](https://codesandbox.io/s/excalidraw-types-9h2dm) #### In Browser diff --git a/src/packages/excalidraw/package.json b/src/packages/excalidraw/package.json index 20b88b832..0c5d9cd1f 100644 --- a/src/packages/excalidraw/package.json +++ b/src/packages/excalidraw/package.json @@ -2,8 +2,10 @@ "name": "@excalidraw/excalidraw", "version": "0.5.0", "main": "main.js", + "types": "types/packages/excalidraw/index.d.ts", "files": [ - "dist/*" + "dist/*", + "types/*" ], "publishConfig": { "access": "public" @@ -58,6 +60,7 @@ "sass-loader": "11.0.1", "terser-webpack-plugin": "5.1.1", "ts-loader": "8.0.18", + "typescript": "4.2.3", "webpack": "5.28.0", "webpack-bundle-analyzer": "4.4.0", "webpack-cli": "4.6.0" @@ -66,7 +69,8 @@ "repository": "https://github.com/excalidraw/excalidraw", "homepage": "https://github.com/excalidraw/excalidraw/tree/master/src/packages/excalidraw", "scripts": { - "build:umd": "cross-env NODE_ENV=production webpack --config webpack.prod.config.js && cross-env NODE_ENV=development webpack --config webpack.dev.config.js", + "gen:types": "tsc --project ../../../tsconfig-types.json", + "build:umd": "cross-env NODE_ENV=production webpack --config webpack.prod.config.js && cross-env NODE_ENV=development webpack --config webpack.dev.config.js && yarn gen:types", "build:umd:withAnalyzer": "cross-env NODE_ENV=production ANALYZER=true webpack --config webpack.prod.config.js", "pack": "yarn build:umd && yarn pack" } diff --git a/src/packages/excalidraw/yarn.lock b/src/packages/excalidraw/yarn.lock index f1c0a0162..d2e4eaa24 100644 --- a/src/packages/excalidraw/yarn.lock +++ b/src/packages/excalidraw/yarn.lock @@ -2586,6 +2586,11 @@ tslib@^1.9.0: resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00" integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg== +typescript@4.2.3: + version "4.2.3" + resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.2.3.tgz#39062d8019912d43726298f09493d598048c1ce3" + integrity sha512-qOcYwxaByStAWrBf4x0fibwZvMRG+r4cQoTjbPtUlrWjBHbmCAww1i448U0GJ+3cNNEtebDteo/cHOR3xJ4wEw== + unicode-canonical-property-names-ecmascript@^1.0.4: version "1.0.4" resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz#2619800c4c825800efdd8343af7dd9933cbe2818" diff --git a/tsconfig-types.json b/tsconfig-types.json new file mode 100644 index 000000000..148459807 --- /dev/null +++ b/tsconfig-types.json @@ -0,0 +1,18 @@ +{ + "include": ["src/packages/excalidraw", "src/global.d.ts", "src/css.d.ts"], + "compilerOptions": { + "allowJs": true, + "declaration": true, + "emitDeclarationOnly": true, + "outDir": "src/packages/excalidraw/types", + "jsx": "react-jsx", + "target": "es6", + "lib": ["dom", "dom.iterable", "esnext"], + "module": "esnext", + "moduleResolution": "node", + "resolveJsonModule": true, + "skipLibCheck": true, + "allowSyntheticDefaultImports": true, + "strict": true + } +}