add excalidraw_embed into base repo (#2040)
Co-authored-by: Lipis <lipiridis@gmail.com>pull/2059/head
David Luzar
5 years ago
committed by
GitHub
parent
80cbe13167
commit
ab7073abdb
@ -1,13 +0,0 @@
|
||||
/* http://www.eaglefonts.com/fg-virgil-ttf-131249.htm */
|
||||
@font-face {
|
||||
font-family: "Virgil";
|
||||
src: url("FG_Virgil.woff2");
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
/* https://github.com/microsoft/cascadia-code */
|
||||
@font-face {
|
||||
font-family: "Cascadia";
|
||||
src: url("Cascadia.woff2");
|
||||
font-display: swap;
|
||||
}
|
||||
@ -1,3 +1,17 @@
|
||||
/* http://www.eaglefonts.com/fg-virgil-ttf-131249.htm */
|
||||
@font-face {
|
||||
font-family: "Virgil";
|
||||
src: url("/FG_Virgil.woff2");
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
/* https://github.com/microsoft/cascadia-code */
|
||||
@font-face {
|
||||
font-family: "Cascadia";
|
||||
src: url("/Cascadia.woff2");
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
.visually-hidden {
|
||||
position: absolute !important;
|
||||
height: 1px;
|
||||
@ -0,0 +1,2 @@
|
||||
node_modules
|
||||
dist
|
||||
@ -0,0 +1,71 @@
|
||||
import React, { useEffect } from "react";
|
||||
|
||||
import { InitializeApp } from "../components/InitializeApp";
|
||||
import App from "../components/App";
|
||||
|
||||
import "../css/app.scss";
|
||||
import "../css/styles.scss";
|
||||
|
||||
import { ExcalidrawProps } from "../types";
|
||||
import { IsMobileProvider } from "../is-mobile";
|
||||
|
||||
const Excalidraw = React.memo(
|
||||
(props: ExcalidrawProps) => {
|
||||
const {
|
||||
width,
|
||||
height,
|
||||
onChange,
|
||||
initialData,
|
||||
user,
|
||||
onUsernameChange,
|
||||
} = props;
|
||||
|
||||
useEffect(() => {
|
||||
// Block pinch-zooming on iOS outside of the content area
|
||||
const handleTouchMove = (event: TouchEvent) => {
|
||||
// @ts-ignore
|
||||
if (typeof event.scale === "number" && event.scale !== 1) {
|
||||
event.preventDefault();
|
||||
}
|
||||
};
|
||||
|
||||
document.addEventListener("touchmove", handleTouchMove, {
|
||||
passive: false,
|
||||
});
|
||||
|
||||
return () => {
|
||||
document.removeEventListener("touchmove", handleTouchMove);
|
||||
};
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<InitializeApp>
|
||||
<IsMobileProvider>
|
||||
<App
|
||||
width={width}
|
||||
height={height}
|
||||
onChange={onChange}
|
||||
initialData={initialData}
|
||||
user={user}
|
||||
onUsernameChange={onUsernameChange}
|
||||
/>
|
||||
</IsMobileProvider>
|
||||
</InitializeApp>
|
||||
);
|
||||
},
|
||||
(prevProps: ExcalidrawProps, nextProps: ExcalidrawProps) => {
|
||||
const { initialData: prevInitialData, user: prevUser, ...prev } = prevProps;
|
||||
const { initialData: nextInitialData, user: nextUser, ...next } = nextProps;
|
||||
|
||||
const prevKeys = Object.keys(prevProps) as (keyof typeof prev)[];
|
||||
const nextKeys = Object.keys(nextProps) as (keyof typeof next)[];
|
||||
|
||||
return (
|
||||
prevUser?.name === nextUser?.name &&
|
||||
prevKeys.length === nextKeys.length &&
|
||||
prevKeys.every((key) => prev[key] === next[key])
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
export default Excalidraw;
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,66 @@
|
||||
{
|
||||
"name": "@excalidraw/excalidraw",
|
||||
"version": "0.7.0",
|
||||
"main": "dist/excalidraw.min.js",
|
||||
"files": [
|
||||
"dist/*"
|
||||
],
|
||||
"description": "Excalidraw as a React component",
|
||||
"license": "MIT",
|
||||
"keywords": [
|
||||
"excalidraw",
|
||||
"excalidraw-embed",
|
||||
"react",
|
||||
"npm",
|
||||
"npm excalidraw"
|
||||
],
|
||||
"browserslist": {
|
||||
"production": [
|
||||
">0.2%",
|
||||
"not dead",
|
||||
"not ie <= 11",
|
||||
"not op_mini all",
|
||||
"not safari < 12",
|
||||
"not kaios <= 2.5",
|
||||
"not edge < 79",
|
||||
"not chrome < 70",
|
||||
"not and_uc < 13",
|
||||
"not samsung < 10"
|
||||
],
|
||||
"development": [
|
||||
"last 1 chrome version",
|
||||
"last 1 firefox version",
|
||||
"last 1 safari version"
|
||||
]
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "16.13.1",
|
||||
"react-dom": "16.13.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "7.9.0",
|
||||
"@babel/plugin-transform-arrow-functions": "7.8.3",
|
||||
"@babel/plugin-transform-async-to-generator": "7.8.3",
|
||||
"@babel/plugin-transform-typescript": "7.9.4",
|
||||
"@babel/preset-env": "7.9.5",
|
||||
"@babel/preset-react": "7.9.4",
|
||||
"@babel/preset-typescript": "7.9.0",
|
||||
"babel-loader": "8.1.0",
|
||||
"babel-plugin-transform-class-properties": "6.24.1",
|
||||
"cross-env": "7.0.2",
|
||||
"css-loader": "3.5.2",
|
||||
"file-loader": "6.0.0",
|
||||
"mini-css-extract-plugin": "0.8.0",
|
||||
"sass-loader": "8.0.2",
|
||||
"terser-webpack-plugin": "2.3.5",
|
||||
"ts-loader": "7.0.0",
|
||||
"webpack": "4.42.0",
|
||||
"webpack-cli": "3.3.11"
|
||||
},
|
||||
"bugs": "https://github.com/excalidraw/excalidraw/issues",
|
||||
"repository": "https://github.com/excalidraw/excalidraw",
|
||||
"scripts": {
|
||||
"build:umd": "cross-env NODE_ENV=production webpack --config webpack.prod.config.js",
|
||||
"pack": "npm run build:umd && npm pack"
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,9 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "es5",
|
||||
"module": "es2015",
|
||||
"moduleResolution": "node",
|
||||
"resolveJsonModule": true,
|
||||
"jsx": "react"
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,99 @@
|
||||
const path = require("path");
|
||||
const webpack = require("webpack");
|
||||
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
|
||||
const TerserPlugin = require("terser-webpack-plugin");
|
||||
|
||||
module.exports = {
|
||||
mode: "production",
|
||||
entry: {
|
||||
"excalidraw.min": "./index.tsx",
|
||||
},
|
||||
output: {
|
||||
path: path.resolve(__dirname, "dist"),
|
||||
library: "Excalidraw",
|
||||
libraryTarget: "umd",
|
||||
filename: "[name].js",
|
||||
},
|
||||
resolve: {
|
||||
extensions: [".js", ".ts", ".tsx", ".css", ".scss"],
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.(sa|sc|c)ss$/,
|
||||
exclude: /node_modules/,
|
||||
use: [
|
||||
MiniCssExtractPlugin.loader,
|
||||
{ loader: "css-loader" },
|
||||
"sass-loader",
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /\.(ts|tsx|js|jsx|mjs)$/,
|
||||
exclude: /node_modules\/(?!(roughjs|socket.io-client|browser-nativefs)\/).*/,
|
||||
use: [
|
||||
{
|
||||
loader: "ts-loader",
|
||||
options: {
|
||||
transpileOnly: true,
|
||||
configFile: path.resolve(__dirname, "tsconfig.prod.json"),
|
||||
},
|
||||
},
|
||||
{
|
||||
loader: "babel-loader",
|
||||
options: {
|
||||
presets: [
|
||||
"@babel/preset-env",
|
||||
"@babel/preset-react",
|
||||
"@babel/preset-typescript",
|
||||
],
|
||||
plugins: [
|
||||
"@babel/plugin-proposal-object-rest-spread",
|
||||
"@babel/plugin-transform-arrow-functions",
|
||||
"transform-class-properties",
|
||||
"@babel/plugin-transform-async-to-generator",
|
||||
],
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /\.(woff|woff2|eot|ttf|otf)$/,
|
||||
use: [
|
||||
{
|
||||
loader: "file-loader",
|
||||
options: {
|
||||
name: "[name].[ext]",
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
optimization: {
|
||||
minimize: true,
|
||||
minimizer: [
|
||||
new TerserPlugin({
|
||||
test: /\.js($|\?)/i,
|
||||
}),
|
||||
new webpack.optimize.LimitChunkCountPlugin({
|
||||
maxChunks: 1,
|
||||
}),
|
||||
],
|
||||
},
|
||||
plugins: [new MiniCssExtractPlugin({ filename: "[name].css" })],
|
||||
externals: {
|
||||
react: {
|
||||
root: "React",
|
||||
commonjs2: "react",
|
||||
commonjs: "react",
|
||||
amd: "react",
|
||||
},
|
||||
"react-dom": {
|
||||
root: "ReactDOM",
|
||||
commonjs2: "react-dom",
|
||||
commonjs: "react-dom",
|
||||
amd: "react-dom",
|
||||
},
|
||||
},
|
||||
};
|
||||
Loading…
Reference in New Issue