├── .babelrc ├── .flowconfig ├── .gitignore ├── .npmignore ├── .travis.yml ├── README.md ├── demo ├── .babelrc ├── .gitignore ├── README.md ├── package-lock.json ├── package.json ├── public │ ├── favicon.ico │ ├── index.html │ └── manifest.json └── src │ ├── App.css │ ├── App.js │ ├── App.test.js │ ├── Paper │ ├── Layers │ │ ├── Item.css │ │ ├── Item.js │ │ ├── Label.css │ │ ├── Label.js │ │ ├── Layers.css │ │ └── Layers.js │ ├── Loader │ │ ├── Loader.css │ │ └── Loader.js │ ├── Menu │ │ ├── Menu.css │ │ └── Menu.js │ ├── Paper.css │ ├── Paper.js │ ├── Toolbar │ │ ├── Button.css │ │ ├── Button.js │ │ ├── Menu │ │ │ ├── Dropdown.css │ │ │ ├── Dropdown.js │ │ │ ├── Item.css │ │ │ ├── Item.js │ │ │ ├── List.css │ │ │ ├── List.js │ │ │ ├── Menu.css │ │ │ └── Menu.js │ │ ├── Toolbar.css │ │ └── Toolbar.js │ └── hoc │ │ ├── withAnimation.js │ │ ├── withCircleTool.js │ │ ├── withDeleteTool.js │ │ ├── withFullscreen.js │ │ ├── withHistory.js │ │ ├── withMoveTool.js │ │ ├── withPenTool.js │ │ ├── withRectangleTool.js │ │ ├── withSelectTool.js │ │ └── withTools.js │ ├── index.css │ ├── index.js │ ├── mr-bubbles-1080.jpg │ ├── mr-bubbles-480.jpg │ ├── mr-bubbles-720.jpg │ ├── mr-bubbles.json │ └── registerServiceWorker.js ├── flow-typed └── npm │ ├── @babel │ ├── cli_vx.x.x.js │ ├── core_vx.x.x.js │ ├── plugin-proposal-class-properties_vx.x.x.js │ ├── plugin-proposal-object-rest-spread_vx.x.x.js │ ├── preset-env_vx.x.x.js │ ├── preset-flow_vx.x.x.js │ └── preset-react_vx.x.x.js │ ├── babel-core_vx.x.x.js │ ├── babel-eslint_vx.x.x.js │ ├── babel-jest_vx.x.x.js │ ├── canvas_vx.x.x.js │ ├── enzyme-adapter-react-16_vx.x.x.js │ ├── enzyme_v3.x.x.js │ ├── eslint-plugin-flowtype_vx.x.x.js │ ├── eslint-plugin-import_vx.x.x.js │ ├── eslint-plugin-jsx-a11y_vx.x.x.js │ ├── eslint-plugin-react_vx.x.x.js │ ├── eslint_vx.x.x.js │ ├── flow-bin_v0.x.x.js │ ├── flow-copy-source_vx.x.x.js │ ├── jest_v23.x.x.js │ ├── jsdom_vx.x.x.js │ ├── paper_vx.x.x.js │ ├── prettier_v1.x.x.js │ ├── react-reconciler_vx.x.x.js │ ├── scheduler_vx.x.x.js │ ├── semantic-release_vx.x.x.js │ ├── sinon_vx.x.x.js │ └── travis-deploy-once_vx.x.x.js ├── package.json ├── src ├── PaperRenderer.js ├── View.js ├── index.js ├── types.js └── utils.js ├── test ├── components │ ├── App.js │ ├── Grid.js │ └── Paper.js ├── index.test.js └── setup.js └── yarn.lock /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | [ 4 | "@babel/preset-env", 5 | { 6 | "targets": { 7 | "browsers": ["ie >= 11"] 8 | }, 9 | "loose": true 10 | } 11 | ], 12 | [ 13 | "@babel/preset-react", 14 | { 15 | "useBuiltIns": true, 16 | "pragma": "React.createElement" 17 | } 18 | ], 19 | "@babel/preset-flow" 20 | ], 21 | "plugins": [ 22 | [ 23 | "@babel/plugin-proposal-class-properties", 24 | { 25 | "loose": true 26 | } 27 | ], 28 | "@babel/plugin-proposal-object-rest-spread" 29 | ] 30 | } 31 | -------------------------------------------------------------------------------- /.flowconfig: -------------------------------------------------------------------------------- 1 | [ignore] 2 | /demo/ 3 | /lib/ 4 | .*/node_modules/.*\.json$ 5 | 6 | [libs] 7 | /flow/interfaces 8 | 9 | [options] 10 | module.system.node.resolve_dirname=src 11 | module.system.node.resolve_dirname=node_modules 12 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | /node_modules 2 | /coverage 3 | /lib 4 | 5 | .DS_Store 6 | .env.local 7 | .env.development.local 8 | .env.test.local 9 | .env.production.local 10 | 11 | npm-debug.log* 12 | yarn-debug.log* 13 | yarn-error.log* 14 | -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | *.log 3 | test 4 | demo 5 | coverage 6 | node_modules 7 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | # https://github.com/paperjs/paper.js/blob/develop/.travis.yml 2 | # https://github.com/sapics/paper.js/blob/127c1a669a95811c5d7691cab1f8f55a676542bd/.travis.yml 3 | language: node_js 4 | node_js: '10' 5 | cache: yarn 6 | env: 7 | #- CXX=g++-4.9 8 | - NPM_TOKEN=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 9 | notifications: 10 | email: false 11 | addons: 12 | apt: 13 | sources: 14 | - ubuntu-toolchain-r-test 15 | packages: 16 | - build-essential 17 | - g++-4.9 18 | - libcairo2-dev 19 | - libpango1.0-dev 20 | - libssl-dev 21 | - libjpeg62-dev 22 | - libgif-dev 23 | - pkg-config 24 | after_success: 25 | - yarn travis-deploy-once "yarn semantic-release" 26 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Paper.js bindings for React Fiber 2 | 3 | ## Demo 4 | 5 | http://react-paper.github.io/react-paper-bindings/ 6 | 7 | ## Development 8 | 9 | Start watching `src` with babel 10 | ``` 11 | cd react-paper-bindings 12 | npm start 13 | ``` 14 | 15 | Link the library to the demo 16 | ``` 17 | # npm link the library 18 | cd react-paper-bindings 19 | npm link 20 | 21 | cd demo 22 | npm link react-paper-bindings 23 | ``` 24 | 25 | Start demo with `create-react-app` 26 | ``` 27 | cd demo 28 | npm start 29 | ``` 30 | 31 | If someone knows a better way, please let me know ;) 32 | 33 | ## Similar projects 34 | 35 | - [react-paperjs](https://github.com/psychobolt/react-paperjs) 36 | 37 | ## Example 38 | 39 | ```jsx 40 | import React, { Component } from 'react' 41 | 42 | import { 43 | View, 44 | Layer, 45 | Group, 46 | Path, 47 | Circle, 48 | Ellipse, 49 | Rectangle, 50 | PointText, 51 | Tool, 52 | } from 'react-paper-bindings' 53 | 54 | const ReactLogo = ({ rotation, x, y }) => { 55 | return ( 56 | 57 | 63 | 70 | 77 | 82 | 83 | ) 84 | } 85 | 86 | const Paper = ({ activeTool, circles, rectangles, width, height }) => { 87 | return ( 88 | 89 | 90 | {circles.map(circle => )} 91 | 92 | 93 | {rectangles.map(rectangle => )} 94 | 95 | 96 | 102 | 111 | 116 | 117 | 124 | 131 | 136 | 141 | 142 | ) 143 | } 144 | ``` 145 | -------------------------------------------------------------------------------- /demo/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["react-app"] 3 | } 4 | -------------------------------------------------------------------------------- /demo/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/ignore-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | 6 | # testing 7 | /coverage 8 | 9 | # production 10 | /build 11 | 12 | # misc 13 | .DS_Store 14 | .env.local 15 | .env.development.local 16 | .env.test.local 17 | .env.production.local 18 | 19 | npm-debug.log* 20 | yarn-debug.log* 21 | yarn-error.log* 22 | -------------------------------------------------------------------------------- /demo/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-paper-bindings", 3 | "version": "0.0.1", 4 | "license": "MIT", 5 | "homepage": "http://hribb.github.io/react-paper-bindings/", 6 | "dependencies": { 7 | "immutability-helper": "^2.8.1", 8 | "lodash.omit": "^4.5.0", 9 | "lodash.pick": "^4.4.0", 10 | "lodash.range": "^3.2.0", 11 | "material-design-icons": "^3.0.1", 12 | "object-assign": "^4.1.1", 13 | "paper": "^0.11.8", 14 | "prop-types": "^15.6.2", 15 | "random-int": "^1.0.0", 16 | "randomcolor": "^0.5.3", 17 | "react": "^16.6.0", 18 | "react-dom": "^16.6.0", 19 | "react-motion": "^0.5.2", 20 | "react-portal": "^4.1.5", 21 | "react-treeview": "^0.4.7", 22 | "recompose": "^0.30.0", 23 | "tether": "^1.4.5" 24 | }, 25 | "devDependencies": { 26 | "gh-pages": "^2.0.1", 27 | "react-scripts": "^2.0.5" 28 | }, 29 | "scripts": { 30 | "start": "react-scripts start", 31 | "build": "react-scripts build", 32 | "test": "react-scripts test --env=jsdom", 33 | "eject": "react-scripts eject", 34 | "predeploy": "npm run build", 35 | "deploy": "gh-pages -d build" 36 | }, 37 | "browserslist": [ 38 | ">0.2%", 39 | "not dead", 40 | "not ie <= 11", 41 | "not op_mini all" 42 | ] 43 | } 44 | -------------------------------------------------------------------------------- /demo/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/react-paper/react-paper-bindings/3e6b9cb952ed286c233a419f310909d15a8396d7/demo/public/favicon.ico -------------------------------------------------------------------------------- /demo/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 11 | 12 | 13 | 16 | 25 | Paper.js bindings for React 26 | 27 | 28 | 31 |
32 | 42 | 43 | 44 | -------------------------------------------------------------------------------- /demo/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React Paper.js", 3 | "name": "Paper.js bindings for React", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "192x192", 8 | "type": "image/png" 9 | } 10 | ], 11 | "start_url": "./index.html", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /demo/src/App.css: -------------------------------------------------------------------------------- 1 | .App { 2 | width: 100%; 3 | height: 100%; 4 | text-align: center; 5 | overflow: hidden; 6 | } 7 | -------------------------------------------------------------------------------- /demo/src/App.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import Paper from './Paper/Paper' 3 | 4 | // for development without internet connection 5 | import 'material-design-icons/iconfont/material-icons.css' 6 | 7 | import './App.css' 8 | 9 | import MR_BUBBLES_JSON from './mr-bubbles.json' 10 | import MR_BUBBLES_IMAGE_480 from './mr-bubbles-480.jpg' 11 | import MR_BUBBLES_IMAGE_720 from './mr-bubbles-720.jpg' 12 | import MR_BUBBLES_IMAGE_1080 from './mr-bubbles-1080.jpg' 13 | 14 | const IMAGE_WIDTH = 1920 15 | const IMAGE_HEIGHT = 870 16 | 17 | const IMAGES = { 18 | 480: MR_BUBBLES_IMAGE_480, 19 | 720: MR_BUBBLES_IMAGE_720, 20 | 1080: MR_BUBBLES_IMAGE_1080, 21 | } 22 | 23 | class App extends Component { 24 | 25 | constructor(props) { 26 | super(props) 27 | this.state = { 28 | imageSize: 720, 29 | mounted: false, 30 | } 31 | this._box = null 32 | this._request = null 33 | } 34 | 35 | resizeWindow = () => { 36 | if (!this._request) { 37 | this._request = requestAnimationFrame(this.resizePaper) 38 | } 39 | } 40 | 41 | resizePaper = () => { 42 | this.forceUpdate() 43 | this._request = null 44 | } 45 | 46 | setImageSize = ({ size }) => { 47 | this.setState({ imageSize: size }) 48 | } 49 | 50 | componentDidMount() { 51 | this.setState({ mounted: true }) 52 | window.addEventListener('resize', this.resizeWindow) 53 | } 54 | 55 | componentWillUnmount() { 56 | if (this._request) { 57 | cancelAnimationFrame(this._request) 58 | this._request = null 59 | } 60 | window.removeEventListener('resize', this.resizeWindow) 61 | } 62 | 63 | render() { 64 | const { imageSize, mounted } = this.state 65 | const box = this._box && this._box.getBoundingClientRect() 66 | return ( 67 |
this._box = ref}> 68 | {mounted && 69 | } 79 |
80 | ) 81 | } 82 | 83 | } 84 | 85 | export default App 86 | -------------------------------------------------------------------------------- /demo/src/App.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import App from './App' 4 | 5 | it('renders without crashing', () => { 6 | const div = document.createElement('div') 7 | ReactDOM.render(, div) 8 | }) 9 | -------------------------------------------------------------------------------- /demo/src/Paper/Layers/Item.css: -------------------------------------------------------------------------------- 1 | .Layers .tree-view_item { 2 | display: flex; 3 | cursor: pointer; 4 | padding-left: 4px; 5 | } 6 | -------------------------------------------------------------------------------- /demo/src/Paper/Layers/Item.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import PropTypes from 'prop-types' 3 | import Tree from 'react-treeview' 4 | 5 | import Label from './Label' 6 | 7 | import './Item.css' 8 | 9 | function getIcon(type) { 10 | switch (type) { 11 | case 'Layer': return 'layers' 12 | case 'Group': return 'folder' 13 | case 'Path': return 'timeline' 14 | case 'Circle': return 'lens' 15 | case 'Rectangle': return 'crop_square' 16 | case 'Raster': return 'photo' 17 | default: return 'insert_drive_file' 18 | } 19 | } 20 | 21 | export default class Item extends Component { 22 | 23 | static propTypes = { 24 | id: PropTypes.any.isRequired, 25 | type: PropTypes.string.isRequired, 26 | expanded: PropTypes.object.isRequired, 27 | activeLayer: PropTypes.number, 28 | selectedItem: PropTypes.number, 29 | onArrowClick: PropTypes.func, 30 | onLabelClick: PropTypes.func, 31 | } 32 | 33 | handleArrowClick = () => { 34 | if (this.props.onArrowClick) { 35 | this.props.onArrowClick(this.props) 36 | } 37 | } 38 | 39 | render() { 40 | const { 41 | id, type, children, expanded, 42 | activeLayer, selectedItem, onLabelClick, 43 | } = this.props 44 | const isGroup = type === 'Group' || type === 'Layer' 45 | const hasChildren = children && children.length > 0 46 | const labelProps = { 47 | id, type, 48 | icon: getIcon(type), 49 | onClick: onLabelClick, 50 | selected: id === selectedItem || (id === activeLayer && !selectedItem), 51 | } 52 | const treeProps = { 53 | collapsed: expanded[id] === false, 54 | onClick: this.handleArrowClick, 55 | nodeLabel: , 56 | } 57 | return ( 58 | 59 | {hasChildren && children.map(({ id, type }) => 60 | 69 | )} 70 | {!hasChildren && isGroup && 71 | } 72 | 73 | ) 74 | } 75 | 76 | } 77 | -------------------------------------------------------------------------------- /demo/src/Paper/Layers/Label.css: -------------------------------------------------------------------------------- 1 | .Layers .tree-view_label { 2 | display: flex; 3 | flex: 1; 4 | white-space: nowrap; 5 | text-overflow: ellipsis; 6 | cursor: pointer; 7 | margin-left: 2px; 8 | } 9 | 10 | .Layers .tree-view_label:hover { 11 | background: #eee; 12 | background: #2a2a2a; 13 | } 14 | 15 | .Layers .tree-view_label-selected, 16 | .Layers .tree-view_label-selected:hover { 17 | background: #ddd; 18 | background: #323232; 19 | } 20 | 21 | .Layers .tree-view_label .material-icons { 22 | display: inline-block; 23 | margin: 0 2px 0 3px; 24 | padding: 0; 25 | width: 16px; 26 | height: 20px; 27 | line-height: 20px; 28 | font-size: 16px; 29 | } 30 | 31 | .Layers .tree-view_label span { 32 | display: inline-block; 33 | height: 20px; 34 | line-height: 20px; 35 | font-size: 12px; 36 | } 37 | -------------------------------------------------------------------------------- /demo/src/Paper/Layers/Label.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import PropTypes from 'prop-types' 3 | 4 | import './Label.css' 5 | 6 | export default class Label extends Component { 7 | 8 | static propTypes = { 9 | children: PropTypes.node, 10 | icon: PropTypes.node, 11 | onClick: PropTypes.func, 12 | selected: PropTypes.bool, 13 | } 14 | 15 | handleLabelClick = () => { 16 | if (this.props.onClick) { 17 | this.props.onClick(this.props) 18 | } 19 | } 20 | 21 | render() { 22 | const { children, icon, selected } = this.props 23 | const className = `tree-view_label${selected ? ' tree-view_label-selected': ''}` 24 | return ( 25 |
26 | {icon && {icon}} 27 | {children} 28 |
29 | ) 30 | } 31 | 32 | } 33 | -------------------------------------------------------------------------------- /demo/src/Paper/Layers/Layers.css: -------------------------------------------------------------------------------- 1 | .Layers { 2 | position: absolute; 3 | display: flex; 4 | flex-direction: column; 5 | z-index: 50; 6 | width: 200px; 7 | height: 260px; 8 | bottom: 10px; 9 | right: 10px; 10 | background: rgba(255,255,255,0.9); 11 | background: rgba(0,0,0,0.8); 12 | box-shadow: 1px 2px 3px 0px rgba(0,0,0,0.3); 13 | user-select: none; 14 | color: #fff; 15 | } 16 | 17 | /* title */ 18 | .Layers__title { 19 | display: flex; 20 | margin: 0; 21 | padding: 6px; 22 | font-size: 16px; 23 | text-align: left; 24 | border-bottom: 1px solid #eee; 25 | border-bottom: 1px solid #292929; 26 | } 27 | .Layers__title .material-icons { 28 | font-size: 18px; 29 | margin-right: 5px; 30 | } 31 | 32 | /* body */ 33 | .Layers__body { 34 | flex: 1; 35 | overflow: auto; 36 | padding: 6px; 37 | } 38 | 39 | /* arrow */ 40 | .Layers .tree-view_arrow { 41 | cursor: pointer; 42 | display: inline-block; 43 | transition: all 0.2s; 44 | user-select: none; 45 | } 46 | .Layers .tree-view_arrow:after { 47 | position: relative; 48 | content: '▾'; 49 | } 50 | .Layers .tree-view_arrow-collapsed { 51 | transform: rotate(-90deg); 52 | } 53 | 54 | /* children */ 55 | .Layers .tree-view_children { 56 | margin-left: 30px; 57 | } 58 | .Layers .tree-view_children-collapsed { 59 | height: 0px; 60 | } 61 | -------------------------------------------------------------------------------- /demo/src/Paper/Layers/Layers.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import PropTypes from 'prop-types' 3 | import assign from 'object-assign' 4 | 5 | import Item from './Item' 6 | 7 | import './Layers.css' 8 | 9 | export default class Layers extends Component { 10 | 11 | static propTypes = { 12 | activeLayer: PropTypes.number, 13 | data: PropTypes.array.isRequired, 14 | selectedItem: PropTypes.number, 15 | selectItem: PropTypes.func, 16 | } 17 | 18 | constructor(props) { 19 | super(props) 20 | this.state = { 21 | expanded: {}, 22 | } 23 | } 24 | 25 | handleArrowClick = ({ id }) => { 26 | const { expanded } = this.state 27 | this.setState({ 28 | expanded: assign({}, expanded, { 29 | [id]: typeof expanded[id] === 'undefined' ? false : !expanded[id] 30 | }) 31 | }) 32 | } 33 | 34 | handleLabelClick = (item) => { 35 | if (typeof this.props.selectItem === 'function') { 36 | this.props.selectItem(item) 37 | } 38 | } 39 | 40 | render() { 41 | const { activeLayer, data, selectedItem } = this.props 42 | const { expanded } = this.state 43 | const itemProps = { 44 | activeLayer, 45 | expanded, 46 | selectedItem, 47 | onArrowClick: this.handleArrowClick, 48 | onLabelClick: this.handleLabelClick, 49 | } 50 | return ( 51 |
52 |

53 | layers 54 | Layers 55 |

56 |
57 | {data.map(({ id, type, children }) => 58 | 65 | )} 66 |
67 |
68 | ) 69 | } 70 | 71 | } 72 | -------------------------------------------------------------------------------- /demo/src/Paper/Loader/Loader.css: -------------------------------------------------------------------------------- 1 | .Loader { 2 | position: absolute; 3 | top: 50%; 4 | left: 50%; 5 | height: 22px; 6 | margin-top: -11px; 7 | margin-left: -28px; 8 | animation: fade-in 1s; 9 | /*animation: fade-in 1s;*/ 10 | /*animation: fade-in 0.5s;*/ 11 | z-index: 9999; 12 | } 13 | 14 | .Loader > div { 15 | background-color: #fff; 16 | width: 15px; 17 | height: 15px; 18 | border-radius: 100%; 19 | margin: 2px; 20 | animation-fill-mode: both; 21 | display: inline-block; 22 | } 23 | 24 | .Loader > div:nth-child(0) { 25 | animation: scale 0.75s -0.36s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); 26 | } 27 | 28 | .Loader > div:nth-child(1) { 29 | animation: scale 0.75s -0.24s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); 30 | } 31 | 32 | .Loader > div:nth-child(2) { 33 | animation: scale 0.75s -0.12s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); 34 | } 35 | 36 | .Loader > div:nth-child(3) { 37 | animation: scale 0.75s 0s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08); 38 | } 39 | 40 | @keyframes fade-in { 41 | 0% { 42 | opacity: 0; 43 | } 44 | 50% { 45 | opacity: 0; 46 | } 47 | 100% { 48 | opacity: 1; 49 | } 50 | } 51 | 52 | @keyframes scale { 53 | 0% { 54 | transform: scale(1); 55 | opacity: 1; 56 | } 57 | 45% { 58 | transform: scale(0.1); 59 | opacity: 0.7; 60 | } 61 | 80% { 62 | transform: scale(1); 63 | opacity: 1; 64 | } 65 | } 66 | -------------------------------------------------------------------------------- /demo/src/Paper/Loader/Loader.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import PropTypes from 'prop-types' 3 | import assign from 'object-assign' 4 | 5 | import './Loader.css' 6 | 7 | const Loader = ({ color, size }) => { 8 | const style = assign({}, 9 | color && { backgroundColor: color }, 10 | size && { width: size, height: size }, 11 | ) 12 | return ( 13 |
14 |
15 |
16 |
17 |
18 | ) 19 | } 20 | 21 | Loader.propTypes = { 22 | color: PropTypes.string, 23 | size: PropTypes.number, 24 | } 25 | 26 | export default Loader 27 | -------------------------------------------------------------------------------- /demo/src/Paper/Menu/Menu.css: -------------------------------------------------------------------------------- 1 | .Menu { 2 | z-index: 888; 3 | position: absolute; 4 | } 5 | 6 | .Menu__MainButton { 7 | position: absolute; 8 | width: 64px; 9 | height: 64px; 10 | border-radius: 100%; 11 | background: #68AEF0; 12 | cursor: pointer; 13 | display: flex; 14 | justify-content : center; 15 | align-items: center; 16 | color: #fff; 17 | font-weight: lighter; 18 | border: 1px solid rgba(0, 0, 0, 0.1); 19 | user-select: none; 20 | -webkit-tap-highlight-color: rgba(0,0,0,0); 21 | } 22 | 23 | .Menu__MainButton:hover { 24 | background: #4994da; 25 | } 26 | 27 | .Menu__MainButton i { 28 | font-size: 30px; 29 | } 30 | 31 | .Menu__ChildButton { 32 | position: absolute; 33 | display: flex; 34 | justify-content: center; 35 | align-items: center; 36 | width: 48; 37 | height: 48; 38 | border-radius: 100%; 39 | background: #fff; 40 | box-shadow: rgba(0, 0, 0, 0.2) 0px 1px 3px; 41 | color: #8898A5; 42 | cursor: pointer; 43 | user-select: none; 44 | -webkit-tap-highlight-color: rgba(0,0,0,0); 45 | } 46 | 47 | .Menu__ChildButton i { 48 | width: 48; 49 | height: 48; 50 | line-height: 48; 51 | } 52 | 53 | .Menu__ChildButton i:hover { 54 | color: orange; 55 | } 56 | -------------------------------------------------------------------------------- /demo/src/Paper/Menu/Menu.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import { Motion, StaggeredMotion, spring } from 'react-motion'; 3 | import range from 'lodash.range'; 4 | 5 | import './Menu.css' 6 | 7 | // Diameter of the main button in pixels 8 | const MAIN_BUTTON_DIAM = 64; 9 | const CHILD_BUTTON_DIAM = 48; 10 | 11 | // The number of child buttons that fly out from the main button 12 | const NUM_CHILDREN = 6; 13 | 14 | // should be between 0 and 0.5 (its maximum value is difference between scale in 15 | // finalChildButtonStyles and initialChildButtonStyles) 16 | const OFFSET = 0.05; 17 | 18 | const SPRING_CONFIG = { stiffness: 400, damping: 28 }; 19 | 20 | // How far away from the main button does the child buttons go 21 | const FLY_OUT_RADIUS = 90, 22 | SEPARATION_ANGLE = 42, //degrees 23 | FAN_ANGLE = (NUM_CHILDREN - 1) * SEPARATION_ANGLE, //degrees 24 | BASE_ANGLE = ((180 - FAN_ANGLE) / 2); // degrees 25 | 26 | // Utility functions 27 | 28 | function toRadians(degrees) { 29 | return degrees * (Math.PI / 180) 30 | } 31 | 32 | function finalChildDeltaPositions(index) { 33 | let angle = BASE_ANGLE + (index * SEPARATION_ANGLE); 34 | return { 35 | deltaX: FLY_OUT_RADIUS * Math.cos(toRadians(angle)) - (CHILD_BUTTON_DIAM / 2), 36 | deltaY: FLY_OUT_RADIUS * Math.sin(toRadians(angle)) + (CHILD_BUTTON_DIAM / 2) 37 | }; 38 | } 39 | 40 | 41 | export default class Menu extends Component { 42 | 43 | constructor(props) { 44 | super(props); 45 | 46 | this.state = { 47 | isOpen: false, 48 | childButtons: [] 49 | }; 50 | 51 | // Bind this to the functions 52 | this.toggleMenu = this.toggleMenu.bind(this); 53 | this.closeMenu = this.closeMenu.bind(this); 54 | this.setTool = this.setTool.bind(this); 55 | } 56 | 57 | componentDidMount() { 58 | window.addEventListener('click', this.closeMenu); 59 | let childButtons = []; 60 | 61 | this.setState({ childButtons: childButtons.slice(0) }); 62 | } 63 | 64 | componentWillUnmount() { 65 | window.removeEventListener('click', this.closeMenu); 66 | } 67 | 68 | mainButtonStyles() { 69 | return { 70 | width: MAIN_BUTTON_DIAM, 71 | height: MAIN_BUTTON_DIAM, 72 | top: this.props.y - (MAIN_BUTTON_DIAM / 2), 73 | left: this.props.x - (MAIN_BUTTON_DIAM / 2) 74 | }; 75 | } 76 | 77 | initialChildButtonStyles() { 78 | return { 79 | width: CHILD_BUTTON_DIAM, 80 | height: CHILD_BUTTON_DIAM, 81 | top: spring(this.props.y - (CHILD_BUTTON_DIAM / 2), SPRING_CONFIG), 82 | left: spring(this.props.x - (CHILD_BUTTON_DIAM / 2), SPRING_CONFIG), 83 | rotate: spring(-180, SPRING_CONFIG), 84 | scale: spring(0.5, SPRING_CONFIG) 85 | }; 86 | } 87 | 88 | initialChildButtonStylesInit() { 89 | return { 90 | width: CHILD_BUTTON_DIAM, 91 | height: CHILD_BUTTON_DIAM, 92 | top: this.props.y - (CHILD_BUTTON_DIAM / 2), 93 | left: this.props.x - (CHILD_BUTTON_DIAM / 2), 94 | rotate: -180, 95 | scale: 0.5 96 | }; 97 | } 98 | 99 | finalChildButtonStylesInit(childIndex) { 100 | let { deltaX, deltaY } = finalChildDeltaPositions(childIndex); 101 | return { 102 | width: CHILD_BUTTON_DIAM, 103 | height: CHILD_BUTTON_DIAM, 104 | top: this.props.y - deltaY, 105 | left: this.props.x + deltaX, 106 | rotate: 0, 107 | scale: 1 108 | }; 109 | } 110 | 111 | finalChildButtonStyles(childIndex) { 112 | let { deltaX, deltaY } = finalChildDeltaPositions(childIndex); 113 | return { 114 | width: CHILD_BUTTON_DIAM, 115 | height: CHILD_BUTTON_DIAM, 116 | top: spring(this.props.y - deltaY, SPRING_CONFIG), 117 | left: spring(this.props.x + deltaX, SPRING_CONFIG), 118 | rotate: spring(0, SPRING_CONFIG), 119 | scale: spring(1, SPRING_CONFIG) 120 | }; 121 | } 122 | 123 | toggleMenu(e) { 124 | e.stopPropagation(); 125 | let { isOpen } = this.state; 126 | this.setState({ 127 | isOpen: !isOpen 128 | }); 129 | } 130 | 131 | closeMenu() { 132 | this.setState({ isOpen: false }); 133 | } 134 | 135 | renderChildButtons() { 136 | const { isOpen } = this.state; 137 | const { tools } = this.props 138 | const targetButtonStylesInitObject = range(tools.length).map(i => { 139 | return isOpen 140 | ? this.finalChildButtonStylesInit(i) 141 | : this.initialChildButtonStylesInit(); 142 | }); 143 | 144 | //StaggeredMotion now takes an Array of object 145 | const targetButtonStylesInit = Object.keys(targetButtonStylesInitObject).map( 146 | key => targetButtonStylesInitObject[key] 147 | ); 148 | 149 | const targetButtonStyles = range(tools.length).map(i => { 150 | return isOpen 151 | ? this.finalChildButtonStyles(i) 152 | : this.initialChildButtonStyles(); 153 | }); 154 | 155 | const scaleMin = this.initialChildButtonStyles().scale.val; 156 | const scaleMax = this.finalChildButtonStyles(0).scale.val; 157 | 158 | //This function returns target styles for each child button in current animation frame 159 | //according to actual styles in previous animation frame. 160 | //Each button could have one of two target styles 161 | // - defined in initialChildButtonStyles (for collapsed buttons) 162 | // - defined in finalChildButtonStyles (for expanded buttons) 163 | // To decide which target style should be applied function uses css 'scale' property 164 | // for previous button in previous animation frame. 165 | // When 'scale' for previous button passes some 'border' which is a simple combination one of 166 | // two 'scale' values and some OFFSET the target style for next button should be changed. 167 | // 168 | // For example let's set the OFFSET for 0.3 - it this case border's value for closed buttons will be 0.8. 169 | // 170 | // All buttons are closed 171 | // INITIAL-BUTTON-SCALE-(0.5)-----------BORDER-(0.8)------FINAL-BUTTON-SCALE-(1) 172 | // |------------------------------------------|--------------------------------| 173 | // BUTTON NO 1 o------------------------------------------|--------------------------------- 174 | // BUTTON NO 2 o------------------------------------------|--------------------------------- 175 | // 176 | // When user clicks on menu button no 1 changes its target style according to finalChildButtonStyles method 177 | // and starts growing up. In this frame this button doesn't pass the border so target style for button no 2 178 | // stays as it was in previous animation frame 179 | // BUTTON NO 1 -----------------------------------o-------|--------------------------------- 180 | // BUTTON NO 2 o------------------------------------------|--------------------------------- 181 | // 182 | // 183 | // 184 | // (...few frames later) 185 | // In previous frame button no 1 passes the border so target style for button no 2 could be changed. 186 | // BUTTON NO 1 -------------------------------------------|-o------------------------------- 187 | // BUTTON NO 2 -----o-------------------------------------|--------------------------------- 188 | // 189 | // 190 | // All buttons are expanded - in this case border value is 0.7 (OFFSET = 0.3) 191 | // INITIAL-BUTTON-SCALE-(0.5)---BORDER-(0.7)--------------FINAL-BUTTON-SCALE-(1) 192 | // |------------------------------|--------------------------------------------| 193 | // BUTTON NO 1 -------------------------------|--------------------------------------------O 194 | // BUTTON NO 2 -------------------------------|--------------------------------------------O 195 | // 196 | // When user clicks on menu button no 1 changes its target style according to initialChildButtonStyles method 197 | // and starts shrinking down. In this frame this button doesn't pass the border so target style for button no 2 198 | // stays as it was defined in finalChildButtonStyles method 199 | // BUTTON NO 1 -------------------------------|------------------------------------O-------- 200 | // BUTTON NO 2 -------------------------------|--------------------------------------------O 201 | // 202 | // 203 | // 204 | // (...few frames later) 205 | // In previous frame button no 1 passes the border so target style for button no 2 could be changed 206 | // and this button starts to animate to its default state. 207 | // BUTTON NO 1 -----------------------------o-|--------------------------------------------- 208 | // BUTTON NO 2 -------------------------------|------------------------------------O-------- 209 | let calculateStylesForNextFrame = prevFrameStyles => { 210 | prevFrameStyles = isOpen ? prevFrameStyles : prevFrameStyles.reverse(); 211 | 212 | let nextFrameTargetStyles = prevFrameStyles.map((buttonStyleInPreviousFrame, i) => { 213 | //animation always starts from first button 214 | if (i === 0) { 215 | return targetButtonStyles[i]; 216 | } 217 | 218 | const prevButtonScale = prevFrameStyles[i - 1].scale; 219 | const shouldApplyTargetStyle = () => { 220 | if (isOpen) { 221 | return prevButtonScale >= scaleMin + OFFSET; 222 | } else { 223 | return prevButtonScale <= scaleMax - OFFSET; 224 | } 225 | }; 226 | 227 | return shouldApplyTargetStyle() ? targetButtonStyles[i] : buttonStyleInPreviousFrame; 228 | }); 229 | 230 | return isOpen ? nextFrameTargetStyles : nextFrameTargetStyles.reverse(); 231 | }; 232 | 233 | return ( 234 | 237 | {interpolatedStyles => 238 |
239 | {interpolatedStyles.map(({height, left, rotate, scale, top, width}, index) => 240 |
251 | 257 | {tools[index].icon} 258 | 259 |
260 | )} 261 |
262 | } 263 | 264 | ); 265 | } 266 | 267 | setTool(e) { 268 | if (this.props.setTool) { 269 | this.props.setTool(e.target.dataset.tool) 270 | } 271 | } 272 | 273 | render() { 274 | const { activeTool, tools } = this.props 275 | const { isOpen } = this.state; 276 | const tool = tools.find(t => t.tool === activeTool) 277 | const mainButtonRotation = isOpen 278 | ? { rotate: spring(-135, { stiffness: 500, damping: 30 }) } 279 | : { rotate: spring(0, { stiffness: 500, damping: 30 }) } 280 | return ( 281 |
282 | {this.renderChildButtons()} 283 | 284 | {({rotate}) => 285 |
291 | {tool.icon} 292 |
293 | } 294 | 295 |
296 | ); 297 | } 298 | }; 299 | -------------------------------------------------------------------------------- /demo/src/Paper/Paper.css: -------------------------------------------------------------------------------- 1 | .Paper { 2 | position: relative; 3 | width: 100%; 4 | height: 100%; 5 | background: #363636; 6 | } 7 | 8 | .Paper canvas { 9 | position: absolute; 10 | top: 0; 11 | left: 0; 12 | right: 0; 13 | bottom: 0; 14 | } 15 | 16 | .Paper.tool-move canvas { cursor: grab; } 17 | .Paper.tool-select canvas { cursor: pointer; } 18 | .Paper.tool-pen canvas { cursor: crosshair; } 19 | .Paper.tool-circle canvas { cursor: copy; } 20 | .Paper.tool-rectangle canvas { cursor: copy; } 21 | .Paper.tool-delete canvas { cursor: pointer; } 22 | -------------------------------------------------------------------------------- /demo/src/Paper/Paper.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import PropTypes from 'prop-types' 3 | import { compose } from 'recompose' 4 | import assign from 'object-assign' 5 | import pick from 'lodash.pick' 6 | import randomInt from 'random-int' 7 | 8 | import { Motion, spring } from 'react-motion' 9 | 10 | import { 11 | Layer, Raster, Tool, View, 12 | Circle, Path, Rectangle, PointText, // eslint-disable-line no-unused-vars 13 | } from 'react-paper-bindings' 14 | 15 | import Loader from './Loader/Loader' 16 | import Toolbar from './Toolbar/Toolbar' 17 | import Menu from './Menu/Menu' 18 | import Layers from './Layers/Layers' 19 | 20 | import withHistory from './hoc/withHistory' 21 | import withFullscreen from './hoc/withFullscreen' 22 | import withTools from './hoc/withTools' 23 | import withMoveTool from './hoc/withMoveTool' 24 | import withSelectTool from './hoc/withSelectTool' 25 | import withPenTool from './hoc/withPenTool' 26 | import withCircleTool from './hoc/withCircleTool' 27 | import withRectangleTool from './hoc/withRectangleTool' 28 | import withDeleteTool from './hoc/withDeleteTool' 29 | 30 | import './Paper.css' 31 | 32 | class Paper extends Component { 33 | 34 | static propTypes = { 35 | image: PropTypes.any.isRequired, 36 | imageWidth: PropTypes.number.isRequired, 37 | imageHeight: PropTypes.number.isRequired, 38 | imageSize: PropTypes.number.isRequired, 39 | initialData: PropTypes.any.isRequired, 40 | width: PropTypes.number.isRequired, 41 | height: PropTypes.number.isRequired, 42 | activeTool: PropTypes.string.isRequired, 43 | activeLayer: PropTypes.number.isRequired, 44 | data: PropTypes.array.isRequired, 45 | selectedItem: PropTypes.number.isRequired, 46 | fitImage: PropTypes.func.isRequired, 47 | setTool: PropTypes.func.isRequired, 48 | selectItem: PropTypes.func.isRequired, 49 | setImageSize: PropTypes.func.isRequired, 50 | selectToolKeyDown: PropTypes.func.isRequired, 51 | selectToolKeyUp: PropTypes.func.isRequired, 52 | selectToolMouseDown: PropTypes.func.isRequired, 53 | selectToolMouseDrag: PropTypes.func.isRequired, 54 | selectToolMouseUp: PropTypes.func.isRequired, 55 | moveToolMouseDown: PropTypes.func.isRequired, 56 | moveToolMouseDrag: PropTypes.func.isRequired, 57 | moveToolMouseUp: PropTypes.func.isRequired, 58 | moveToolMouseWheel: PropTypes.func.isRequired, 59 | penToolMouseDown: PropTypes.func.isRequired, 60 | penToolMouseDrag: PropTypes.func.isRequired, 61 | penToolMouseUp: PropTypes.func.isRequired, 62 | circleToolMouseDown: PropTypes.func.isRequired, 63 | rectangleToolMouseDown: PropTypes.func.isRequired, 64 | deleteToolMouseDown: PropTypes.func.isRequired, 65 | } 66 | 67 | constructor(props) { 68 | super(props) 69 | this.state = { 70 | imageLoaded: false, 71 | loaded: false, 72 | showLayers: true, 73 | size: [randomInt(40,320),randomInt(40,320)], 74 | open: false, 75 | } 76 | this._view = null 77 | } 78 | 79 | save = () => { 80 | const json = this._view._scope.project.exportJSON() 81 | const svg = this._view._scope.project.exportSVG({ embedImages: false }) 82 | console.log(json) 83 | console.log(svg) 84 | } 85 | 86 | toggleLayers = () => { 87 | this.setState({ 88 | showLayers: !this.state.showLayers, 89 | }) 90 | } 91 | 92 | imageLoaded = (image) => { 93 | this._loaded = true 94 | this.props.fitImage(image) 95 | this.setState({ imageLoaded: true, loaded: true }) 96 | } 97 | 98 | componentDidUpdate(nextProps) { 99 | const { image } = this.props 100 | if (image !== nextProps.image) { 101 | this.setState({ imageLoaded: false }) 102 | } 103 | } 104 | 105 | render() { 106 | const { 107 | activeTool, activeLayer, image, data, 108 | selectedItem, setTool, width, height, 109 | } = this.props 110 | 111 | const { loaded, imageLoaded, showLayers, } = this.state 112 | 113 | const toolbarProps = assign(pick(this.props, [ 114 | 'activeTool', 'animate', 'fullscreen', 'imageSize', 115 | 'canUndo', 'canRedo', 'undo', 'redo', 'clearHistory', 116 | 'setTool', 'setImageSize', 'toggleAnimation', 'toggleFullscreen', 117 | ]), { 118 | showLayers, 119 | save: this.save, 120 | toggleLayers: this.toggleLayers, 121 | }) 122 | 123 | const layerProps = { 124 | data, 125 | activeLayer, 126 | selectedItem, 127 | selectItem: this.props.selectItem, 128 | } 129 | 130 | const menuProps = { 131 | activeTool, 132 | setTool, 133 | x: width / 2, 134 | y: height - 60, 135 | tools: [ 136 | { tool: 'delete', icon: 'delete', title: 'Delete Tool (D)' }, 137 | { tool: 'pen', icon: 'create', title: 'Pen Tool (P)' }, 138 | { tool: 'select', icon: 'touch_app', title: 'Select Tool (A)' }, 139 | { tool: 'move', icon: 'pan_tool', title: 'Move Tool (V)' }, 140 | { tool: 'circle', icon: 'add_circle', title: 'Circle Tool (C)' }, 141 | { tool: 'rectangle', icon: 'add_box', title: 'Rectangle Tool (R)' }, 142 | ], 143 | } 144 | 145 | const viewProps = assign( 146 | pick(this.props, ['activeTool', 'activeLayer', 'width', 'height']), 147 | { 148 | ref: ref => this._view = ref, 149 | onWheel: this.props.moveToolMouseWheel, 150 | matrix: pick(this.props, ['sx', 'sy', 'tx', 'ty', 'x', 'y', 'zoom']) 151 | } 152 | ) 153 | 154 | return ( 155 |
156 | 157 | {loaded && 158 | } 159 | {!imageLoaded && 160 | } 161 | {loaded && showLayers && 162 | } 163 | 164 | 165 | 166 | 167 | 168 | 169 | {({size}) => 170 | this.setState({ open: !this.state.open })} 176 | /> 177 | } 178 | 179 | this.setState({ open: !this.state.open })} 185 | /> 186 | 187 | {data.map(({ id: layerId, type, children }) => 188 | 193 | {children.map(({ id: itemId, type: Item, ...props }) => 194 | 203 | )} 204 | 205 | )} 206 | 216 | 224 | 232 | 238 | 244 | 250 | 251 |
252 | ) 253 | } 254 | } 255 | 256 | export default compose( 257 | withHistory, 258 | withFullscreen, 259 | withTools, 260 | withMoveTool, 261 | withSelectTool, 262 | withPenTool, 263 | withCircleTool, 264 | withRectangleTool, 265 | withDeleteTool, 266 | )(Paper) 267 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Button.css: -------------------------------------------------------------------------------- 1 | .Button { 2 | width: 32px; 3 | height: 32px; 4 | padding: 2px 0 0 0; 5 | border: none; 6 | text-align: center; 7 | border-radius: 1px; 8 | color: #fff; 9 | background: none; 10 | cursor: pointer; 11 | } 12 | 13 | .Button:hover { 14 | color: #ccc; 15 | } 16 | 17 | .Button:disabled, 18 | .Button:disabled:hover { 19 | color: #777; 20 | } 21 | 22 | .Button:active, 23 | .Button-active, 24 | .Button-active:hover { 25 | color: orange; 26 | } 27 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Button.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import PropTypes from 'prop-types' 3 | 4 | import './Button.css' 5 | 6 | export default class Button extends Component { 7 | 8 | static propTypes = { 9 | active: PropTypes.bool, 10 | children: PropTypes.node, 11 | onClick: PropTypes.func, 12 | setTool: PropTypes.func, 13 | tool: PropTypes.string, 14 | } 15 | 16 | handleClick = (e) => { 17 | if (this.props.onClick) { 18 | this.props.onClick(e) 19 | } else if (this.props.setTool) { 20 | this.props.setTool(this.props.tool) 21 | } 22 | } 23 | 24 | render() { 25 | const { active, children, onClick, setTool, tool, ...rest } = this.props 26 | const props = { 27 | className: `Button${active ? ' Button-active' : ''}`, 28 | onClick: this.handleClick, 29 | } 30 | return ( 31 | 34 | ) 35 | } 36 | 37 | } 38 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Menu/Dropdown.css: -------------------------------------------------------------------------------- 1 | .Dropdown { 2 | position: absolute; 3 | display: flex; 4 | z-index: 9999; 5 | opacity: 0; 6 | margin: 0; 7 | border-radius: 2px; 8 | background: #fff; 9 | box-sizing: border-box; 10 | box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 11 | 0 3px 1px -2px rgba(0, 0, 0, 0.2), 12 | 0 1px 5px 0 rgba(0, 0, 0, 0.12); 13 | transition: opacity 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); 14 | } 15 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Menu/Dropdown.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import PropTypes from 'prop-types' 3 | import { Portal } from 'react-portal' 4 | import Tether from 'tether' 5 | 6 | import './Dropdown.css' 7 | 8 | const POS = { 9 | t: 'top', 10 | b: 'bottom', 11 | l: 'left', 12 | r: 'right', 13 | m: 'middle', 14 | c: 'center', 15 | } 16 | 17 | export default class Dropdown extends Component { 18 | 19 | constructor(props) { 20 | super(props); 21 | this.ref = React.createRef() 22 | } 23 | 24 | static propTypes = { 25 | align: function(props, propName, componentName) { 26 | if (!/[btm][lrc] [btm][lrc]/.test(props[propName])) { 27 | return new Error( 28 | `Invalid prop ${propName} (${props[propName]}) ` + 29 | `supplied to ${componentName}. Validation failed.` 30 | ) 31 | } 32 | }, 33 | children: PropTypes.any.isRequired, 34 | closeOnEsc: PropTypes.bool, 35 | closeOnOutsideClick: PropTypes.bool, 36 | offset: PropTypes.string, 37 | target: PropTypes.element.isRequired, 38 | } 39 | 40 | static defaultProps = { 41 | align: 'tl bl', 42 | closeOnEsc: true, 43 | closeOnOutsideClick: true, 44 | offset: '0 0', 45 | } 46 | 47 | onOpen = (portalNode) => { 48 | const { align, offset } = this.props 49 | const [ay,ax,ty,tx] = align.split('').map(a => a && POS[a]).filter(a => a) 50 | const [oy,ox] = offset.split(' ').map(o => parseInt(o, 10)) 51 | 52 | portalNode.classList.add('Dropdown') 53 | 54 | this._tether = new Tether({ 55 | element: portalNode, 56 | target: this.ref, 57 | attachment: `${ay} ${ax}`, 58 | targetAttachment: `${ty} ${tx}`, 59 | offset: `${oy} ${ox}`, 60 | constraints: [{ 61 | to: 'window', 62 | pin: true, 63 | }], 64 | }) 65 | 66 | portalNode.style.opacity = 1 67 | } 68 | 69 | beforeClose = (portalNode, remove) => { 70 | if (this._tether) { 71 | this._tether.destroy() 72 | } 73 | this._timeout = setTimeout(remove) 74 | } 75 | 76 | componentWillUnmount() { 77 | if (this._timeout) { 78 | clearTimeout(this._timeout) 79 | } 80 | } 81 | render() { 82 | const { children, closeOnEsc, closeOnOutsideClick, target } = this.props 83 | return ( 84 | 92 | {children} 93 | 94 | ) 95 | } 96 | 97 | } 98 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Menu/Item.css: -------------------------------------------------------------------------------- 1 | .PortalMenu__Item { 2 | cursor: pointer; 3 | height: 32px; 4 | line-height: 32px; 5 | padding: 0 10px; 6 | white-space: nowrap; 7 | overflow: hidden; 8 | text-overflow: ellipsis; 9 | display: flex; 10 | align-items: center; 11 | font-size: 14px; 12 | } 13 | 14 | .PortalMenu__Item:hover { 15 | background: #eee; 16 | } 17 | 18 | .PortalMenu__Item:focus { 19 | background: #eee; 20 | } 21 | 22 | .PortalMenu__Item .material-icons { 23 | font-size: 18px; 24 | margin-right: 4px; 25 | height: 32px; 26 | line-height: 32px; 27 | } 28 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Menu/Item.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import PropTypes from 'prop-types' 3 | 4 | import './Item.css' 5 | 6 | export default class Item extends Component { 7 | 8 | static propTypes = { 9 | children: PropTypes.any.isRequired, 10 | closeMenu: PropTypes.func, 11 | onClick: PropTypes.func, 12 | tabIndex: PropTypes.number, 13 | } 14 | 15 | handleClick = () => { 16 | if (this.props.onClick) { 17 | this.props.onClick(this.props) 18 | } 19 | this.props.closeMenu() 20 | } 21 | 22 | render() { 23 | const { children, tabIndex } = this.props 24 | const props = { 25 | className: 'PortalMenu__Item', 26 | onClick: this.handleClick, 27 | tabIndex, 28 | } 29 | return ( 30 |
  • 31 | {children} 32 |
    • 33 | ) 34 | } 35 | 36 | } 37 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Menu/List.css: -------------------------------------------------------------------------------- 1 | .PortalMenu__List { 2 | display: block; 3 | min-width: 80px; 4 | margin: 0; 5 | padding: 0; 6 | overflow-x: hidden; 7 | overflow-y: auto; 8 | } 9 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Menu/List.js: -------------------------------------------------------------------------------- 1 | import React, { Component, Children, cloneElement } from 'react' 2 | import PropTypes from 'prop-types' 3 | 4 | import './List.css' 5 | 6 | export default class List extends Component { 7 | 8 | static propTypes = { 9 | children: PropTypes.any.isRequired, 10 | closePortal: PropTypes.func, 11 | } 12 | 13 | render() { 14 | const { closePortal } = this.props 15 | const children = Children.toArray(this.props.children).filter(c => c) 16 | return ( 17 |
      this.list = ref}> 18 | {Children.map(children, (child, index) => cloneElement(child, { 19 | tabIndex: index + 1, 20 | closeMenu: closePortal, 21 | }))} 22 |
    23 | ) 24 | } 25 | 26 | } 27 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Menu/Menu.css: -------------------------------------------------------------------------------- 1 | .Menu { 2 | box-sizing: border-box; 3 | } 4 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Menu/Menu.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import PropTypes from 'prop-types' 3 | 4 | import Dropdown from './Dropdown' 5 | import List from './List' 6 | 7 | import './Menu.css' 8 | 9 | export default class Menu extends Component { 10 | 11 | static propTypes = { 12 | align: PropTypes.string, 13 | children: PropTypes.any.isRequired, 14 | offset: PropTypes.string, 15 | target: PropTypes.element.isRequired, 16 | } 17 | 18 | render() { 19 | const { children, ...rest } = this.props 20 | return ( 21 | 22 | 23 | {children} 24 | 25 | 26 | ) 27 | } 28 | 29 | } 30 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Toolbar.css: -------------------------------------------------------------------------------- 1 | .Toolbar { 2 | position: absolute; 3 | 4 | z-index: 50; 5 | top: 0; 6 | left: 0; 7 | right: 0; 8 | padding: 11px 11px 12px 11px; 9 | background: rgba(0,0,0,0.8); 10 | box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.3); 11 | user-select: none; 12 | } 13 | 14 | .Toolbar > div { 15 | display: inline-block; 16 | } 17 | 18 | /* separator */ 19 | .Toolbar > span { 20 | position: relative; 21 | bottom: 2px; 22 | display: inline-block; 23 | width: 2px; 24 | height: 18px; 25 | background: #fff; 26 | margin: 0 10px; 27 | } 28 | 29 | /* svg icon */ 30 | .Toolbar a { 31 | display: inline-block; 32 | margin: 0 4px; 33 | } 34 | .Toolbar a svg path { 35 | fill: #fff; 36 | } 37 | .Toolbar a:hover svg path { 38 | fill: #ccc; 39 | } 40 | .Toolbar a:active svg path { 41 | fill: orange; 42 | } 43 | -------------------------------------------------------------------------------- /demo/src/Paper/Toolbar/Toolbar.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import PropTypes from 'prop-types' 3 | 4 | import Button from './Button' 5 | import Menu from './Menu/Menu' 6 | import MenuItem from './Menu/Item' 7 | 8 | import './Toolbar.css' 9 | 10 | const Toolbar = (props) => { 11 | const { activeTool, fullscreen, imageSize, showLayers } = props 12 | console.log(activeTool) 13 | return ( 14 |
    15 |
    16 | 23 | 30 | 37 | 44 | 51 | 58 |
    59 | 60 |
    61 | 69 | 77 | 84 |
    85 | 86 |
    87 | 89 | photo_size_select_large 90 | 91 | }> 92 | 93 | 94 | {imageSize === 480 ? 'radio_button_checked' : 'radio_button_unchecked'} 95 | 96 | 480p 97 | 98 | 99 | 100 | {imageSize === 720 ? 'radio_button_checked' : 'radio_button_unchecked'} 101 | 102 | 720p 103 | 104 | 105 | 106 | {imageSize === 1080 ? 'radio_button_checked' : 'radio_button_unchecked'} 107 | 108 | 1080p 109 | 110 | 111 | 120 | 128 |
    129 | 130 |
    131 | 138 |
    139 | 140 | 147 |
    148 | ) 149 | } 150 | 151 | Toolbar.propTypes = { 152 | activeTool: PropTypes.string, 153 | canUndo: PropTypes.bool, 154 | canRedo: PropTypes.bool, 155 | fullscreen: PropTypes.bool, 156 | imageSize: PropTypes.number, 157 | showLayers: PropTypes.bool, 158 | save: PropTypes.func, 159 | setTool: PropTypes.func, 160 | undo: PropTypes.func, 161 | redo: PropTypes.func, 162 | clearHistory: PropTypes.func, 163 | toggleFullscreen: PropTypes.func, 164 | toggleLayers: PropTypes.func, 165 | setImageSize: PropTypes.func, 166 | } 167 | 168 | export default Toolbar 169 | -------------------------------------------------------------------------------- /demo/src/Paper/hoc/withAnimation.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | 3 | export default function withAnimation(WrappedComponent) { 4 | 5 | return class extends Component { 6 | 7 | constructor(props) { 8 | super(props) 9 | this.state = { 10 | animate: false, 11 | rotation: 0, 12 | } 13 | } 14 | 15 | rotate = () => { 16 | this.setState({ 17 | animate: requestAnimationFrame(this.rotate), 18 | rotation: this.state.rotation + .5, 19 | }) 20 | } 21 | 22 | toggleAnimation = () => { 23 | if (this.state.animate) { 24 | this.stopAnimation() 25 | } else { 26 | this.startAnimation() 27 | } 28 | } 29 | 30 | startAnimation = () => { 31 | this.setState({ 32 | animate: requestAnimationFrame(this.rotate), 33 | }) 34 | } 35 | 36 | stopAnimation = () => { 37 | cancelAnimationFrame(this.state.animate) 38 | this.setState({ animate: false }) 39 | } 40 | 41 | componentDidMount() { 42 | if (this.state.animate) { 43 | this.startAnimation() 44 | } 45 | } 46 | 47 | componentWillUnmount() { 48 | if (this.state.animate) { 49 | this.stopAnimation() 50 | } 51 | } 52 | 53 | render() { 54 | return ( 55 | 62 | ) 63 | } 64 | 65 | } 66 | 67 | } 68 | -------------------------------------------------------------------------------- /demo/src/Paper/hoc/withCircleTool.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import randomColor from 'randomcolor' 3 | import randomInt from 'random-int' 4 | 5 | export default function withCircleTool(WrappedComponent) { 6 | 7 | return class extends Component { 8 | 9 | mouseDown = (e) => { 10 | console.log('circle mouseDown') 11 | this.props.deselectItem() 12 | const paper = e.tool._scope 13 | const circle = new paper.Path.Circle({ 14 | center: e.point, 15 | fillColor: randomColor(), 16 | radius: randomInt(10, 60), 17 | }) 18 | const item = this.props.addItem(circle.layer, { 19 | type: 'Circle', 20 | pathData: circle.getPathData(), 21 | fillColor: circle.fillColor.toCSS(true), 22 | }) 23 | console.log(circle) 24 | console.log(circle.getPathData()) 25 | circle.remove() 26 | this.props.selectItem(item) 27 | } 28 | 29 | render() { 30 | return ( 31 | 35 | ) 36 | } 37 | 38 | } 39 | 40 | } 41 | -------------------------------------------------------------------------------- /demo/src/Paper/hoc/withDeleteTool.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | 3 | const HIT_TEST_OPTIONS = { 4 | segments: true, 5 | stroke: true, 6 | fill: true, 7 | tolerance: 12, 8 | } 9 | 10 | export default function withDeleteTool(WrappedComponent) { 11 | 12 | return class extends Component { 13 | 14 | mouseDown = (e) => { 15 | this.props.deselectItem() 16 | const hit = e.tool.view._project.hitTest(e.point, HIT_TEST_OPTIONS) 17 | if (hit && hit.item && !hit.item.locked) { 18 | this.props.removeItem(hit.item) 19 | this.props.deselectItem() 20 | } 21 | } 22 | 23 | render() { 24 | return ( 25 | 29 | ) 30 | } 31 | 32 | } 33 | 34 | } 35 | -------------------------------------------------------------------------------- /demo/src/Paper/hoc/withFullscreen.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | 3 | export default function withFullscreen(WrappedComponent) { 4 | 5 | return class extends Component { 6 | 7 | constructor(props) { 8 | super(props) 9 | this.state = { 10 | fullscreen: false, 11 | } 12 | } 13 | 14 | toggleFullscreen = () => { 15 | if (!this.state.fullscreen) { 16 | if (document.documentElement.requestFullscreen) { 17 | document.documentElement.requestFullscreen() 18 | } else if (document.documentElement.msRequestFullscreen) { 19 | document.documentElement.msRequestFullscreen() 20 | } else if (document.documentElement.mozRequestFullScreen) { 21 | document.documentElement.mozRequestFullScreen() 22 | } else if (document.documentElement.webkitRequestFullscreen) { 23 | document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT) 24 | } 25 | } else { 26 | if (document.exitFullscreen) { 27 | document.exitFullscreen() 28 | } else if (document.msExitFullscreen) { 29 | document.msExitFullscreen() 30 | } else if (document.mozCancelFullScreen) { 31 | document.mozCancelFullScreen() 32 | } else if (document.webkitExitFullscreen) { 33 | document.webkitExitFullscreen() 34 | } 35 | } 36 | } 37 | 38 | fullScreenChange = () => { 39 | this.setState({ fullscreen: !this.state.fullscreen }) 40 | } 41 | 42 | componentDidMount() { 43 | document.addEventListener('webkitfullscreenchange', this.fullScreenChange) 44 | document.addEventListener('mozfullscreenchange', this.fullScreenChange) 45 | document.addEventListener('fullscreenchange', this.fullScreenChange) 46 | document.addEventListener('MSFullscreenChange', this.fullScreenChange) 47 | } 48 | 49 | componentWillUnmount() { 50 | document.addEventListener('webkitfullscreenchange', this.fullScreenChange) 51 | document.addEventListener('mozfullscreenchange', this.fullScreenChange) 52 | document.addEventListener('fullscreenchange', this.fullScreenChange) 53 | document.addEventListener('MSFullscreenChange', this.fullScreenChange) 54 | } 55 | 56 | render() { 57 | return ( 58 | 63 | ) 64 | } 65 | 66 | } 67 | 68 | } 69 | -------------------------------------------------------------------------------- /demo/src/Paper/hoc/withHistory.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import assign from 'object-assign' 3 | import update from 'immutability-helper' 4 | 5 | function getInitialId(data, id = 1) { 6 | data.forEach(item => { 7 | if (item.id > id) { 8 | id = item.id + 1 9 | } 10 | if (item.children) { 11 | id = getInitialId(item.children, id) 12 | } 13 | }) 14 | return id 15 | } 16 | 17 | export default function withHistory(WrappedComponent) { 18 | 19 | return class extends Component { 20 | 21 | constructor(props) { 22 | super(props) 23 | this.state = { 24 | historyIndex: 0, 25 | history: [props.initialData], 26 | } 27 | this._id = getInitialId(props.initialData) 28 | } 29 | 30 | keyDown = (e) => { 31 | if (e.key === 'ArrowLeft') { 32 | this.undo() 33 | } else if (e.key === 'ArrowRight') { 34 | this.redo() 35 | } 36 | } 37 | 38 | addItem = (layer, data) => { 39 | const history = this.getPrevHistory() 40 | const layerIndex = history.findIndex(l => l.id === layer.data.id) 41 | const nextItem = assign(data, { id: this._id }) 42 | const nextHistory = update(history, { 43 | [layerIndex]: { children: { $push: [nextItem] } } 44 | }) 45 | this.addHistory(nextHistory) 46 | this._id++ 47 | return nextItem 48 | } 49 | 50 | updateItem = (item, data) => { 51 | const history = this.getPrevHistory() 52 | const layerIndex = history.findIndex(l => l.id === item.layer.data.id) 53 | const children = history[layerIndex].children 54 | const itemIndex = children.findIndex(i => i.id === item.data.id) 55 | const nextItem = assign({}, children[itemIndex], data) 56 | const nextHistory = update(history, { 57 | [layerIndex]: { children: { [itemIndex]: { $set: nextItem } } } 58 | }) 59 | this.addHistory(nextHistory) 60 | return nextItem 61 | } 62 | 63 | removeItem = (item) => { 64 | const history = this.getPrevHistory() 65 | const layerIndex = history.findIndex(l => l.id === item.layer.data.id) 66 | const children = history[layerIndex].children 67 | const itemIndex = children.findIndex(i => i.id === item.data.id) 68 | const nextHistory = update(history, { 69 | [layerIndex]: { children: { $splice: [[itemIndex, 1]] } } 70 | }) 71 | this.addHistory(nextHistory) 72 | } 73 | 74 | addHistory = (nextHistory) => { 75 | const historyIndex = this.state.historyIndex+1 76 | const history = [ 77 | ...this.state.history.slice(0, historyIndex), 78 | nextHistory, 79 | ] 80 | this.setState({ historyIndex, history }) 81 | } 82 | 83 | getPrevHistory = () => { 84 | return this.state.history[this.state.historyIndex] 85 | } 86 | 87 | clearHistory = () => { 88 | this.setState({ 89 | historyIndex: 0, 90 | history: [this.props.initialData], 91 | }) 92 | } 93 | 94 | undo = () => { 95 | const { historyIndex, history } = this.state 96 | if (historyIndex <= 0) { 97 | return 98 | } 99 | this.setState({ 100 | historyIndex: historyIndex - 1, 101 | items: history[historyIndex], 102 | }) 103 | } 104 | 105 | redo = () => { 106 | const { historyIndex, history } = this.state 107 | if (historyIndex >= (history.length - 1)) { 108 | return 109 | } 110 | this.setState({ 111 | historyIndex: historyIndex + 1, 112 | items: history[historyIndex + 1], 113 | }) 114 | } 115 | 116 | componentDidMount() { 117 | document.addEventListener('keydown', this.keyDown) 118 | } 119 | 120 | componentWillUnmount() { 121 | document.removeEventListener('keydown', this.keyDown) 122 | } 123 | 124 | render() { 125 | const { historyIndex, history } = this.state 126 | return ( 127 | 0} 136 | canRedo={history.length > 1 && historyIndex + 1 < history.length} 137 | 138 | undo={this.undo} 139 | redo={this.redo} 140 | clearHistory={this.clearHistory} 141 | /> 142 | ) 143 | } 144 | 145 | } 146 | 147 | } 148 | -------------------------------------------------------------------------------- /demo/src/Paper/hoc/withMoveTool.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | 3 | const ZOOM_FACTOR = 1.1 4 | 5 | export default function withMoveTool(WrappedComponent) { 6 | 7 | return class extends Component { 8 | state = { 9 | sx: 0, // scale center x 10 | sy: 0, // scale center y 11 | tx: 0, // translate x 12 | ty: 0, // translate y 13 | x: 0, 14 | y: 0, 15 | zoom: 1, 16 | } 17 | 18 | _pan = null 19 | _pinch = null 20 | _raster = null 21 | _view = null 22 | 23 | /** 24 | * Fit image into viewport 25 | * 26 | * @param {Raster} raster Paper.js Raster instance 27 | */ 28 | fitImage = (raster) => { 29 | this._raster = raster 30 | this._view = raster.view 31 | const { imageWidth, imageHeight, width, height } = this.props 32 | // fit raster into original image size 33 | raster.fitBounds(0, 0, imageWidth, imageHeight) 34 | // if image is already loaded 35 | // do not attempt to fit it again 36 | if (this._imageLoaded) { 37 | return 38 | } 39 | // calculate zoom 40 | const wr = width / imageWidth 41 | const hr = height / imageHeight 42 | const zoom = wr < hr ? wr : hr 43 | // calculate new image size 44 | const iw = imageWidth * zoom 45 | const ih = imageHeight * zoom 46 | // calculate needed translation xy 47 | const tx = (width-iw) / 2 / zoom 48 | const ty = (height-ih) / 2 / zoom 49 | // calculate center xy 50 | const x = this.state.x + tx 51 | const y = this.state.y + ty 52 | // center the image in the middle 53 | this.setState({ tx, ty, x, y, zoom }, () => { 54 | // TODO: try to find a better solution 55 | // reset translation xy to prevent zoom problems 56 | this.setState({ tx: 0, ty: 0 }) 57 | }) 58 | // set image loaded 59 | this._imageLoaded = true 60 | } 61 | 62 | /** 63 | * Get pinch zoom event data 64 | * 65 | * @param {ToolEvent} e Paper.js ToolEvent 66 | * @return {Object} Object representing pinch zoom event 67 | */ 68 | getPinchEventData(e) { 69 | const { event: { target: { offsetLeft, offsetTop }, touches } } = e 70 | // touch points 71 | const x0 = touches[0].pageX - offsetLeft 72 | const y0 = touches[0].pageY - offsetTop 73 | const x1 = touches[1].pageX - offsetLeft 74 | const y1 = touches[1].pageY - offsetTop 75 | // center point between fingers 76 | const center = [(x0 + x1) / 2, (y0 + y1) / 2] 77 | // distance between fingers 78 | const distance = Math.sqrt(Math.pow(x1 - x0, 2) + Math.pow(y1 - y0, 2)) 79 | // return object describing touch state 80 | return { center, distance } 81 | } 82 | 83 | /** 84 | * Get pinch zoom state data 85 | * 86 | * @param {Object} prev Previous pinch zoom event data 87 | * @param {Object} next Next pinch zoom event data 88 | * @return {Object} Next pinch zoom state 89 | */ 90 | getPinchEventState(e, prev, next) { 91 | const { x, y, zoom } = this.state 92 | const { tool: { view } } = e 93 | const center = view.viewToProject(next.center) 94 | const t = center.subtract(view.viewToProject(prev.center)) 95 | const scale = next.distance / prev.distance 96 | return { 97 | tx: t.x, 98 | ty: t.y, 99 | sx: center.x, 100 | sy: center.y, 101 | x: x + t.x, 102 | y: y + t.y, 103 | zoom: zoom * scale, 104 | } 105 | } 106 | 107 | /** 108 | * Get pan event data 109 | * 110 | * @param {ToolEvent} e Paper.js ToolEvent 111 | * @return {Object} Object representing pan event 112 | */ 113 | getPanEventData(e) { 114 | const { point, event: { touches, pageX, pageY }, tool: { view } } = e 115 | return { 116 | point: view.projectToView(point), 117 | x: (touches) ? touches[0].pageX : pageX, 118 | y: (touches) ? touches[0].pageY : pageY, 119 | } 120 | } 121 | 122 | /** 123 | * Get pan event state 124 | * 125 | * @param {ToolEvent} e Paper.js ToolEvent 126 | * @param {Object} prev Previous pan event data 127 | * @param {Object} next Next pan event data 128 | * @return {Object} Next pan state data 129 | */ 130 | getPanEventState(e, prev, next) { 131 | const { x, y } = this.state 132 | const { point, tool: { view } } = e 133 | const t = point.subtract(view.viewToProject(prev.point)) 134 | return { 135 | tx: t.x, 136 | ty: t.y, 137 | x: x + t.x, 138 | y: y + t.y, 139 | } 140 | } 141 | 142 | /** 143 | * Mouse wheel handler 144 | * 145 | * @param {SyntheticEvent} e React's SyntheticEvent 146 | * @param {PaperScope} view Paper.js PaperScope instance 147 | */ 148 | mouseWheel = (e) => { 149 | if (!this._imageLoaded) { 150 | return 151 | } 152 | const view = this._view 153 | const { clientX, clientY, nativeEvent } = e 154 | const { offsetLeft, offsetTop } = nativeEvent.target 155 | // get wheel delta 156 | const delta = -e.deltaY || e.wheelDelta 157 | // calculate new zoom from wheel event delta 158 | const newZoom = delta > 0 ? 1 * ZOOM_FACTOR : 1 / ZOOM_FACTOR 159 | // convert mouse point to project space 160 | const center = view.viewToProject(clientX - offsetLeft, clientY - offsetTop) 161 | // transform view 162 | view.scale(newZoom, center) 163 | // stop event 164 | e.preventDefault() 165 | } 166 | 167 | /** 168 | * Mouse down handler 169 | * 170 | * @param {ToolEvent} e Paper.js ToolEvent 171 | */ 172 | mouseDown = (e) => { 173 | //this._pan = this.getPanEventData(e) 174 | } 175 | 176 | /** 177 | * Mouse drag handler 178 | * 179 | * @TODO: fix start pan glitch 180 | * @TODO: transforming view manually is much faster, 181 | * figure out how to do it fast with react 182 | * 183 | * @param {ToolEvent} e Paper.js ToolEvent 184 | */ 185 | mouseDrag = (e) => { 186 | const { event: { touches }, tool: { view } } = e 187 | if (touches && touches.length === 2) { 188 | // pinch zoom 189 | if (!this._pinch) { 190 | this._pinch = this.getPinchEventData(e) 191 | return 192 | } 193 | const prev = this._pinch 194 | const next = this.getPinchEventData(e) 195 | //this.setState(this.getPinchEventState(e, prev, next)) 196 | const { sx, sy, tx, ty, zoom } = this.getPinchEventState(e, prev, next) 197 | view.scale(zoom / this.state.zoom, [sx, sy]) 198 | view.translate(tx, ty) 199 | this._pinch = next 200 | } else { 201 | // pan 202 | if (!this._pan) { 203 | this._pan = this.getPanEventData(e) 204 | return 205 | } 206 | const prev = this._pan 207 | const next = this.getPanEventData(e) 208 | //this.setState(this.getPanEventState(e, prev, next)) 209 | // transform view manually 210 | const { tx, ty } = this.getPanEventState(e, prev, next) 211 | view.translate(tx, ty) 212 | this._pan = next 213 | } 214 | } 215 | 216 | /** 217 | * Mouse up handler 218 | * 219 | * @param {ToolEvent} e Paper.js ToolEvent 220 | */ 221 | mouseUp = (e) => { 222 | this._pan = null 223 | this._pinch = null 224 | } 225 | 226 | render() { 227 | return ( 228 | 240 | ) 241 | } 242 | 243 | } 244 | 245 | } 246 | -------------------------------------------------------------------------------- /demo/src/Paper/hoc/withPenTool.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | 3 | export default function withPenTool(WrappedComponent) { 4 | 5 | return class extends Component { 6 | 7 | constructor(props) { 8 | super(props) 9 | this._path = null 10 | } 11 | 12 | mouseDown = (e) => { 13 | this.props.deselectItem() 14 | } 15 | 16 | mouseDrag = (e) => { 17 | const paper = e.tool._scope 18 | if (!this._path) { 19 | this._path = new paper.Path({ 20 | segments: [e.point], 21 | selected: true, 22 | strokeColor: 'red', 23 | strokeScaling: false, 24 | strokeWidth: 2, 25 | }) 26 | } else { 27 | this._path.add(e.point) 28 | } 29 | } 30 | 31 | mouseUp = (e) => { 32 | if (this._path) { 33 | this._path.simplify(6) 34 | const item = this.props.addItem(this._path.layer, { 35 | type: 'Path', 36 | pathData: this._path.getPathData(), 37 | strokeColor: this._path.style.strokeColor.toCSS(true), 38 | strokeScaling: this._path.strokeScaling, 39 | strokeWidth: this._path.strokeWidth, 40 | }) 41 | console.log(this._path) 42 | console.log(this._path.getPathData()) 43 | this.props.selectItem(item) 44 | this._path.remove() 45 | this._path = null 46 | } 47 | } 48 | 49 | render() { 50 | return ( 51 | 57 | ) 58 | } 59 | 60 | } 61 | 62 | } 63 | -------------------------------------------------------------------------------- /demo/src/Paper/hoc/withRectangleTool.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | import randomColor from 'randomcolor' 3 | import randomInt from 'random-int' 4 | 5 | export default function withRectangleTool(WrappedComponent) { 6 | 7 | return class extends Component { 8 | 9 | mouseDown = (e) => { 10 | this.props.deselectItem() 11 | const paper = e.tool._scope 12 | const rectangle = new paper.Path.Rectangle({ 13 | center: e.point, 14 | fillColor: randomColor(), 15 | size: randomInt(20,120), 16 | }) 17 | const item = this.props.addItem(rectangle.layer, { 18 | type: 'Rectangle', 19 | pathData: rectangle.getPathData(), 20 | fillColor: rectangle.fillColor.toCSS(true), 21 | }) 22 | console.log(rectangle) 23 | console.log(rectangle.getPathData()) 24 | rectangle.remove() 25 | this.props.selectItem(item) 26 | } 27 | 28 | render() { 29 | return ( 30 | 34 | ) 35 | } 36 | 37 | } 38 | 39 | } 40 | -------------------------------------------------------------------------------- /demo/src/Paper/hoc/withSelectTool.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | 3 | const HIT_TEST_OPTIONS = { 4 | segments: true, 5 | stroke: true, 6 | fill: true, 7 | tolerance: 12, 8 | } 9 | 10 | export default function withSelectTool(WrappedComponent) { 11 | 12 | return class SelectTool extends Component { 13 | 14 | constructor(props) { 15 | super(props) 16 | const d = props.initialData 17 | const id = d && d[0] && d[0].id 18 | this.state = { 19 | activeLayer: id, 20 | selectedItem: id, 21 | } 22 | this._changed = false 23 | this._item = null 24 | this._point = null 25 | } 26 | 27 | selectItem = ({ id, type }) => { 28 | if (id === this.state.selectedItem) { 29 | return 30 | } 31 | switch (type) { 32 | case 'Layer': 33 | this.setState({ activeLayer: id, selectedItem: id }) 34 | break 35 | case 'Path': 36 | case 'Circle': 37 | case 'Rectangle': 38 | this.setState({ selectedItem: id }) 39 | break 40 | default: 41 | break 42 | } 43 | } 44 | 45 | deselectItem = () => { 46 | this.setState({ selectedItem: null }) 47 | } 48 | 49 | keyDown = (e) => { 50 | if (this._item) { 51 | const { key, modifiers: { shift } } = e 52 | switch (key) { 53 | case 'delete': 54 | this.props.removeItem(this._item) 55 | this._changed = false 56 | this._item = null 57 | this._point = null 58 | break 59 | case 'up': 60 | this._item.translate(0, shift ? -10 : -1) 61 | this._changed = true 62 | break 63 | case 'down': 64 | this._item.translate(0, shift ? 10 : 1) 65 | this._changed = true 66 | break 67 | case 'left': 68 | this._item.translate(shift ? -10 : -1, 0) 69 | this._changed = true 70 | break 71 | case 'right': 72 | this._item.translate(shift ? 10 : 1, 0) 73 | this._changed = true 74 | break 75 | default: 76 | break 77 | } 78 | } 79 | } 80 | 81 | keyUp = (e) => { 82 | const { key } = e 83 | if (this._item && this._changed && key !== 'shift') { 84 | // debounce keyup item update 85 | // when user preses some key multiple times 86 | // we don't immediately record history change 87 | // because we would end up with many small changes 88 | if (this._updateTimeout) { 89 | clearTimeout(this._updateTimeout) 90 | } 91 | this._updateTimeout = setTimeout(() => { 92 | this.props.updateItem(this._item, { 93 | pathData: this._item.getPathData(), 94 | selected: true, 95 | }) 96 | this._changed = false 97 | this._updateTimeout = null 98 | }, 350) 99 | } 100 | } 101 | 102 | mouseDown = (e) => { 103 | this.deselectItem() 104 | const hit = e.tool.view._project.hitTest(e.point, HIT_TEST_OPTIONS) 105 | if (hit && hit.item && !hit.item.locked) { 106 | this.selectItem(hit.item.data) 107 | hit.item.bringToFront() 108 | this._item = hit.item 109 | this._point = e.point 110 | console.log(this._item) 111 | console.log(this._item.getPathData && this._item.getPathData()) 112 | } else { 113 | this._item = null 114 | this._point = null 115 | } 116 | } 117 | 118 | mouseDrag = (e) => { 119 | if (this._item && this._point) { 120 | this._item.translate(e.point.subtract(this._point)) 121 | this._changed = true 122 | this._point = e.point 123 | } 124 | } 125 | 126 | mouseUp = (e) => { 127 | if (this._item && this._changed) { 128 | this.props.updateItem(this._item, { 129 | pathData: this._item.getPathData(), 130 | selected: true, 131 | }) 132 | } 133 | this._changed = false 134 | this._point = null 135 | } 136 | 137 | render() { 138 | return ( 139 | 150 | ) 151 | } 152 | 153 | } 154 | 155 | } 156 | -------------------------------------------------------------------------------- /demo/src/Paper/hoc/withTools.js: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react' 2 | 3 | export default function withTools(WrappedComponent) { 4 | 5 | return class extends Component { 6 | 7 | constructor(props) { 8 | super(props) 9 | this.state = { 10 | activeTool: 'move', 11 | } 12 | this._prevTool = null 13 | } 14 | 15 | setTool = (activeTool) => { 16 | this.setState({ activeTool }) 17 | } 18 | 19 | keyDown = (e) => { 20 | if (e.code === 'Space' && this.state.activeTool !== 'move') { 21 | this._prevTool = this.state.activeTool 22 | this.setState({ activeTool: 'move' }) 23 | } else if (e.key === 'v') { 24 | this.setState({ activeTool: 'move' }) 25 | } else if (e.key === 'a') { 26 | this.setState({ activeTool: 'select' }) 27 | } else if (e.key === 'p') { 28 | this.setState({ activeTool: 'pen' }) 29 | } else if (e.key === 'c') { 30 | this.setState({ activeTool: 'circle' }) 31 | } else if (e.key === 'r') { 32 | this.setState({ activeTool: 'rectangle' }) 33 | } else if (e.key === 'd') { 34 | this.setState({ activeTool: 'delete' }) 35 | } 36 | } 37 | 38 | keyUp = (e) => { 39 | if (e.code === 'Space' && this.state.activeTool === 'move' && this._prevTool !== 'move') { 40 | this.setTool(this._prevTool) 41 | this._prevTool = null 42 | } 43 | } 44 | 45 | componentDidMount() { 46 | document.addEventListener('keydown', this.keyDown) 47 | document.addEventListener('keyup', this.keyUp) 48 | } 49 | 50 | componentWillUnmount() { 51 | document.removeEventListener('keydown', this.keyDown) 52 | document.removeEventListener('keyup', this.keyUp) 53 | } 54 | 55 | render() { 56 | return ( 57 | 62 | ) 63 | } 64 | 65 | } 66 | 67 | } 68 | -------------------------------------------------------------------------------- /demo/src/index.css: -------------------------------------------------------------------------------- 1 | body, 2 | html { 3 | width: 100%; 4 | height: 100%; 5 | } 6 | 7 | body { 8 | margin: 0; 9 | padding: 0; 10 | font-family: sans-serif; 11 | } 12 | 13 | #root { 14 | width: 100%; 15 | height: 100%; 16 | } 17 | -------------------------------------------------------------------------------- /demo/src/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom' 3 | import App from './App' 4 | import './index.css' 5 | import registerServiceWorker from './registerServiceWorker' 6 | 7 | ReactDOM.render(, document.getElementById('root')) 8 | registerServiceWorker() 9 | -------------------------------------------------------------------------------- /demo/src/mr-bubbles-1080.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/react-paper/react-paper-bindings/3e6b9cb952ed286c233a419f310909d15a8396d7/demo/src/mr-bubbles-1080.jpg -------------------------------------------------------------------------------- /demo/src/mr-bubbles-480.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/react-paper/react-paper-bindings/3e6b9cb952ed286c233a419f310909d15a8396d7/demo/src/mr-bubbles-480.jpg -------------------------------------------------------------------------------- /demo/src/mr-bubbles-720.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/react-paper/react-paper-bindings/3e6b9cb952ed286c233a419f310909d15a8396d7/demo/src/mr-bubbles-720.jpg -------------------------------------------------------------------------------- /demo/src/mr-bubbles.json: -------------------------------------------------------------------------------- 1 | [{ 2 | "id":1, 3 | "type":"Layer", 4 | "children":[{ 5 | "id":2, 6 | "type":"Path", 7 | "strokeColor":"red", 8 | "strokeScaling":false, 9 | "strokeWidth":2, 10 | "pathData":"M177.02128,699.17021c14.25138,-14.25138 31.86427,-36.4945 40.85106,-54.46809c3.12112,-6.24223 0.90261,-39.93287 2.7234,-43.57447c6.67805,-13.3561 6.94469,-30.2298 13.61702,-43.57447c19.24589,-38.49177 46.93214,-79.61299 76.25532,-108.93617c0.9078,-0.9078 1.8156,-7.26241 2.7234,-8.17021c5.44352,-5.44352 15.59321,-15.59321 21.78723,-21.78723c0.9078,-0.9078 1.8156,-7.26241 2.7234,-8.17021c5.25033,-5.25033 19.26031,-8.36669 24.51064,-13.61702c8.71923,-8.71923 36.0829,-28.93507 49.02128,-35.40426c2.17872,-1.08936 5.99149,1.08936 8.17021,0c11.23195,-5.61598 18.72549,-18.89466 29.95745,-24.51064c5.37154,-2.68577 10.83304,-5.41652 16.34043,-8.17021c1.64432,-0.82216 6.91128,1.25893 8.17021,0c4.99894,-4.99894 14.04119,-9.744 21.78723,-13.61702c11.08241,-5.5412 24.60593,-21.83488 35.40426,-27.23404c1.65055,-0.82527 7.02899,-1.58218 8.17021,-2.7234c6.44051,-6.44051 19.68055,-22.09559 29.95745,-27.23404c2.47043,-1.23521 9.11605,-3.66924 10.89362,-5.44681c4.5806,-4.5806 9.0661,-15.42667 16.34043,-19.06383c13.35675,-6.67838 26.62094,-21.48068 38.12766,-27.23404c2.80818,-1.40409 20.90203,-7.28501 21.78723,-8.17021c21.266,-21.266 40.61421,-35.1674 59.91489,-54.46809c7.55898,-7.55898 22.41113,-30.26939 32.68085,-35.40426c14.6744,-7.3372 26.80547,-18.63526 38.12766,-29.95745c14.0874,-14.0874 26.92826,-23.89908 35.40426,-40.85106c1.86848,-3.73695 7.1589,-13.61702 10.89362,-13.61702" 11 | },{ 12 | "id":3, 13 | "type":"Circle", 14 | "fillColor":"red", 15 | "pathData":"M140.02128,693.7234c0,-20.43454 16.56546,-37 37,-37c20.43454,0 37,16.56546 37,37c0,20.43454 -16.56546,37 -37,37c-20.43454,0 -37,-16.56546 -37,-37z" 16 | }] 17 | },{ 18 | "id":4, 19 | "type":"Layer", 20 | "children":[{ 21 | "id":5, 22 | "type":"Path", 23 | "strokeColor":"blue", 24 | "strokeScaling":false, 25 | "strokeWidth":2, 26 | "pathData":"M1481.53191,671.93617c0,-15.22643 -15.38771,-33.49883 -21.78723,-46.29787c-3.68828,-7.37656 -1.62558,-15.2426 -8.17021,-21.78723c-1.3617,-1.3617 1.3617,-6.80851 0,-8.17021c-3.18275,-3.18275 -10.17312,-7.44972 -13.61702,-10.89362c-3.61158,-3.61158 -5.90581,-11.81162 -8.17021,-16.34043c-3.4958,-6.9916 -12.27251,-14.99591 -16.34043,-19.06383c-1.28383,-1.28383 1.28383,-4.16298 0,-5.44681c-6.70708,-6.70708 -14.18438,-19.63118 -19.06383,-24.51064c-3.75349,-3.75349 -5.72983,-14.18307 -8.17021,-19.06383c-3.25972,-6.51943 -32.28249,-40.65189 -38.12766,-43.57447c-11.66067,-5.83034 -37.29955,3.67105 -46.29787,8.17021c-6.78981,3.3949 -17.81671,-0.62356 -24.51064,2.7234c-11.72649,5.86325 -60.70265,10.89362 -76.25532,10.89362c-7.92044,0 -25.75036,3.46524 -32.68085,0c-5.11088,-2.55544 -3.91631,-8.76667 -8.17021,-10.89362c-8.59932,-4.29966 -24.9638,-22.69355 -29.95745,-32.68085c-1.62244,-3.24488 -2.98742,-11.15763 -5.44681,-13.61702c-4.76092,-4.76092 -15.94967,-15.94967 -21.78723,-21.78723c-2.4151,-2.4151 -1.08214,-7.61108 -2.7234,-10.89362c-0.85319,-1.70638 -9.86975,-9.86975 -10.89362,-10.89362c-2.4277,-2.4277 -1.27724,-8.00129 -2.7234,-10.89362c-0.78331,-1.56662 -19.24945,-20.51834 -21.78723,-21.78723c-5.80993,-2.90496 -15.9773,2.90496 -21.78723,0c-9.44213,-4.72106 -60.26317,-5.27267 -70.80851,0c-2.85723,1.42862 -11.44331,-2.17372 -13.61702,0c-0.64191,0.64191 0.81196,2.31742 0,2.7234c-6.53617,3.26809 -17.97447,-3.26809 -24.51064,0c-4.90906,2.45453 -37.91212,5.55458 -43.57447,2.7234c-11.8988,-5.9494 -20.06284,-31.81866 -27.23404,-35.40426c-5.00704,-2.50352 -14.59806,-10.13229 -19.06383,-19.06383c-0.82527,-1.65055 -1.58218,-7.02899 -2.7234,-8.17021c-6.26156,-6.26156 -11.64263,-14.36604 -16.34043,-19.06383c-1.20622,-1.20622 -6.26576,-20.70173 -8.17021,-24.51064c-1.8156,-3.63121 1.8156,-9.98582 0,-13.61702c-4.40905,-8.8181 -16.34043,-71.21626 -16.34043,-81.70213c0,-15.83637 1.94661,-40.07426 10.89362,-49.02128c1.9013,-1.9013 -0.05808,-19.00575 5.44681,-24.51064c0.64191,-0.64191 0,-1.8156 0,-2.7234c0,-10.39875 3.95772,-21.53247 8.17021,-29.95745c0.81142,-1.62284 2.7234,-15.2005 2.7234,-8.17021" 27 | },{ 28 | "id":6, 29 | "type":"Circle", 30 | "fillColor":"blue", 31 | "pathData":"M1440.3617,674.65957c0,-20.43454 16.56546,-37 37,-37c20.43454,0 37,16.56546 37,37c0,20.43454 -16.56546,37 -37,37c-20.43454,0 -37,-16.56546 -37,-37z" 32 | }] 33 | }] 34 | -------------------------------------------------------------------------------- /demo/src/registerServiceWorker.js: -------------------------------------------------------------------------------- 1 | // In production, we register a service worker to serve assets from local cache. 2 | 3 | // This lets the app load faster on subsequent visits in production, and gives 4 | // it offline capabilities. However, it also means that developers (and users) 5 | // will only see deployed updates on the "N+1" visit to a page, since previously 6 | // cached resources are updated in the background. 7 | 8 | // To learn more about the benefits of this model, read https://goo.gl/KwvDNy. 9 | // This link also includes instructions on opting out of this behavior. 10 | 11 | const isLocalhost = Boolean( 12 | window.location.hostname === 'localhost' || 13 | // [::1] is the IPv6 localhost address. 14 | window.location.hostname === '[::1]' || 15 | // 127.0.0.1/8 is considered localhost for IPv4. 16 | window.location.hostname.match( 17 | /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/ 18 | ) 19 | ); 20 | 21 | export default function register() { 22 | if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) { 23 | // The URL constructor is available in all browsers that support SW. 24 | const publicUrl = new URL(process.env.PUBLIC_URL, window.location); 25 | if (publicUrl.origin !== window.location.origin) { 26 | // Our service worker won't work if PUBLIC_URL is on a different origin 27 | // from what our page is served on. This might happen if a CDN is used to 28 | // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374 29 | return; 30 | } 31 | 32 | window.addEventListener('load', () => { 33 | const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`; 34 | 35 | if (!isLocalhost) { 36 | // Is not local host. Just register service worker 37 | registerValidSW(swUrl); 38 | } else { 39 | // This is running on localhost. Lets check if a service worker still exists or not. 40 | checkValidServiceWorker(swUrl); 41 | } 42 | }); 43 | } 44 | } 45 | 46 | function registerValidSW(swUrl) { 47 | navigator.serviceWorker 48 | .register(swUrl) 49 | .then(registration => { 50 | registration.onupdatefound = () => { 51 | const installingWorker = registration.installing; 52 | installingWorker.onstatechange = () => { 53 | if (installingWorker.state === 'installed') { 54 | if (navigator.serviceWorker.controller) { 55 | // At this point, the old content will have been purged and 56 | // the fresh content will have been added to the cache. 57 | // It's the perfect time to display a "New content is 58 | // available; please refresh." message in your web app. 59 | console.log('New content is available; please refresh.'); 60 | } else { 61 | // At this point, everything has been precached. 62 | // It's the perfect time to display a 63 | // "Content is cached for offline use." message. 64 | console.log('Content is cached for offline use.'); 65 | } 66 | } 67 | }; 68 | }; 69 | }) 70 | .catch(error => { 71 | console.error('Error during service worker registration:', error); 72 | }); 73 | } 74 | 75 | function checkValidServiceWorker(swUrl) { 76 | // Check if the service worker can be found. If it can't reload the page. 77 | fetch(swUrl) 78 | .then(response => { 79 | // Ensure service worker exists, and that we really are getting a JS file. 80 | if ( 81 | response.status === 404 || 82 | response.headers.get('content-type').indexOf('javascript') === -1 83 | ) { 84 | // No service worker found. Probably a different app. Reload the page. 85 | navigator.serviceWorker.ready.then(registration => { 86 | registration.unregister().then(() => { 87 | window.location.reload(); 88 | }); 89 | }); 90 | } else { 91 | // Service worker found. Proceed as normal. 92 | registerValidSW(swUrl); 93 | } 94 | }) 95 | .catch(() => { 96 | console.log( 97 | 'No internet connection found. App is running in offline mode.' 98 | ); 99 | }); 100 | } 101 | 102 | export function unregister() { 103 | if ('serviceWorker' in navigator) { 104 | navigator.serviceWorker.ready.then(registration => { 105 | registration.unregister(); 106 | }); 107 | } 108 | } 109 | -------------------------------------------------------------------------------- /flow-typed/npm/@babel/cli_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 19857a56ed2c46685f86f44144d59e51 2 | // flow-typed version: <>/@babel/cli_v^7.1.2/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * '@babel/cli' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module '@babel/cli' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module '@babel/cli/bin/babel-external-helpers' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module '@babel/cli/bin/babel' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module '@babel/cli/lib/babel-external-helpers' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module '@babel/cli/lib/babel/dir' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module '@babel/cli/lib/babel/file' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module '@babel/cli/lib/babel/index' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module '@babel/cli/lib/babel/options' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module '@babel/cli/lib/babel/util' { 54 | declare module.exports: any; 55 | } 56 | 57 | // Filename aliases 58 | declare module '@babel/cli/bin/babel-external-helpers.js' { 59 | declare module.exports: $Exports<'@babel/cli/bin/babel-external-helpers'>; 60 | } 61 | declare module '@babel/cli/bin/babel.js' { 62 | declare module.exports: $Exports<'@babel/cli/bin/babel'>; 63 | } 64 | declare module '@babel/cli/index' { 65 | declare module.exports: $Exports<'@babel/cli'>; 66 | } 67 | declare module '@babel/cli/index.js' { 68 | declare module.exports: $Exports<'@babel/cli'>; 69 | } 70 | declare module '@babel/cli/lib/babel-external-helpers.js' { 71 | declare module.exports: $Exports<'@babel/cli/lib/babel-external-helpers'>; 72 | } 73 | declare module '@babel/cli/lib/babel/dir.js' { 74 | declare module.exports: $Exports<'@babel/cli/lib/babel/dir'>; 75 | } 76 | declare module '@babel/cli/lib/babel/file.js' { 77 | declare module.exports: $Exports<'@babel/cli/lib/babel/file'>; 78 | } 79 | declare module '@babel/cli/lib/babel/index.js' { 80 | declare module.exports: $Exports<'@babel/cli/lib/babel/index'>; 81 | } 82 | declare module '@babel/cli/lib/babel/options.js' { 83 | declare module.exports: $Exports<'@babel/cli/lib/babel/options'>; 84 | } 85 | declare module '@babel/cli/lib/babel/util.js' { 86 | declare module.exports: $Exports<'@babel/cli/lib/babel/util'>; 87 | } 88 | -------------------------------------------------------------------------------- /flow-typed/npm/@babel/core_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 38bcc30154a522e7c347dfaf13d99c30 2 | // flow-typed version: <>/@babel/core_v^7.1.2/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * '@babel/core' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module '@babel/core' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module '@babel/core/lib/config/caching' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module '@babel/core/lib/config/config-chain' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module '@babel/core/lib/config/config-descriptors' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module '@babel/core/lib/config/files/configuration' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module '@babel/core/lib/config/files/index-browser' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module '@babel/core/lib/config/files/index' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module '@babel/core/lib/config/files/package' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module '@babel/core/lib/config/files/plugins' { 54 | declare module.exports: any; 55 | } 56 | 57 | declare module '@babel/core/lib/config/files/types' { 58 | declare module.exports: any; 59 | } 60 | 61 | declare module '@babel/core/lib/config/files/utils' { 62 | declare module.exports: any; 63 | } 64 | 65 | declare module '@babel/core/lib/config/full' { 66 | declare module.exports: any; 67 | } 68 | 69 | declare module '@babel/core/lib/config/helpers/config-api' { 70 | declare module.exports: any; 71 | } 72 | 73 | declare module '@babel/core/lib/config/helpers/environment' { 74 | declare module.exports: any; 75 | } 76 | 77 | declare module '@babel/core/lib/config/index' { 78 | declare module.exports: any; 79 | } 80 | 81 | declare module '@babel/core/lib/config/item' { 82 | declare module.exports: any; 83 | } 84 | 85 | declare module '@babel/core/lib/config/partial' { 86 | declare module.exports: any; 87 | } 88 | 89 | declare module '@babel/core/lib/config/pattern-to-regex' { 90 | declare module.exports: any; 91 | } 92 | 93 | declare module '@babel/core/lib/config/plugin' { 94 | declare module.exports: any; 95 | } 96 | 97 | declare module '@babel/core/lib/config/util' { 98 | declare module.exports: any; 99 | } 100 | 101 | declare module '@babel/core/lib/config/validation/option-assertions' { 102 | declare module.exports: any; 103 | } 104 | 105 | declare module '@babel/core/lib/config/validation/options' { 106 | declare module.exports: any; 107 | } 108 | 109 | declare module '@babel/core/lib/config/validation/plugins' { 110 | declare module.exports: any; 111 | } 112 | 113 | declare module '@babel/core/lib/config/validation/removed' { 114 | declare module.exports: any; 115 | } 116 | 117 | declare module '@babel/core/lib/index' { 118 | declare module.exports: any; 119 | } 120 | 121 | declare module '@babel/core/lib/parse' { 122 | declare module.exports: any; 123 | } 124 | 125 | declare module '@babel/core/lib/tools/build-external-helpers' { 126 | declare module.exports: any; 127 | } 128 | 129 | declare module '@babel/core/lib/transform-ast' { 130 | declare module.exports: any; 131 | } 132 | 133 | declare module '@babel/core/lib/transform-file-browser' { 134 | declare module.exports: any; 135 | } 136 | 137 | declare module '@babel/core/lib/transform-file-sync-browser' { 138 | declare module.exports: any; 139 | } 140 | 141 | declare module '@babel/core/lib/transform-file' { 142 | declare module.exports: any; 143 | } 144 | 145 | declare module '@babel/core/lib/transform' { 146 | declare module.exports: any; 147 | } 148 | 149 | declare module '@babel/core/lib/transformation/block-hoist-plugin' { 150 | declare module.exports: any; 151 | } 152 | 153 | declare module '@babel/core/lib/transformation/file/file' { 154 | declare module.exports: any; 155 | } 156 | 157 | declare module '@babel/core/lib/transformation/file/generate' { 158 | declare module.exports: any; 159 | } 160 | 161 | declare module '@babel/core/lib/transformation/file/merge-map' { 162 | declare module.exports: any; 163 | } 164 | 165 | declare module '@babel/core/lib/transformation/index' { 166 | declare module.exports: any; 167 | } 168 | 169 | declare module '@babel/core/lib/transformation/normalize-file' { 170 | declare module.exports: any; 171 | } 172 | 173 | declare module '@babel/core/lib/transformation/normalize-opts' { 174 | declare module.exports: any; 175 | } 176 | 177 | declare module '@babel/core/lib/transformation/plugin-pass' { 178 | declare module.exports: any; 179 | } 180 | 181 | declare module '@babel/core/lib/transformation/util/missing-plugin-helper' { 182 | declare module.exports: any; 183 | } 184 | 185 | // Filename aliases 186 | declare module '@babel/core/lib/config/caching.js' { 187 | declare module.exports: $Exports<'@babel/core/lib/config/caching'>; 188 | } 189 | declare module '@babel/core/lib/config/config-chain.js' { 190 | declare module.exports: $Exports<'@babel/core/lib/config/config-chain'>; 191 | } 192 | declare module '@babel/core/lib/config/config-descriptors.js' { 193 | declare module.exports: $Exports<'@babel/core/lib/config/config-descriptors'>; 194 | } 195 | declare module '@babel/core/lib/config/files/configuration.js' { 196 | declare module.exports: $Exports<'@babel/core/lib/config/files/configuration'>; 197 | } 198 | declare module '@babel/core/lib/config/files/index-browser.js' { 199 | declare module.exports: $Exports<'@babel/core/lib/config/files/index-browser'>; 200 | } 201 | declare module '@babel/core/lib/config/files/index.js' { 202 | declare module.exports: $Exports<'@babel/core/lib/config/files/index'>; 203 | } 204 | declare module '@babel/core/lib/config/files/package.js' { 205 | declare module.exports: $Exports<'@babel/core/lib/config/files/package'>; 206 | } 207 | declare module '@babel/core/lib/config/files/plugins.js' { 208 | declare module.exports: $Exports<'@babel/core/lib/config/files/plugins'>; 209 | } 210 | declare module '@babel/core/lib/config/files/types.js' { 211 | declare module.exports: $Exports<'@babel/core/lib/config/files/types'>; 212 | } 213 | declare module '@babel/core/lib/config/files/utils.js' { 214 | declare module.exports: $Exports<'@babel/core/lib/config/files/utils'>; 215 | } 216 | declare module '@babel/core/lib/config/full.js' { 217 | declare module.exports: $Exports<'@babel/core/lib/config/full'>; 218 | } 219 | declare module '@babel/core/lib/config/helpers/config-api.js' { 220 | declare module.exports: $Exports<'@babel/core/lib/config/helpers/config-api'>; 221 | } 222 | declare module '@babel/core/lib/config/helpers/environment.js' { 223 | declare module.exports: $Exports<'@babel/core/lib/config/helpers/environment'>; 224 | } 225 | declare module '@babel/core/lib/config/index.js' { 226 | declare module.exports: $Exports<'@babel/core/lib/config/index'>; 227 | } 228 | declare module '@babel/core/lib/config/item.js' { 229 | declare module.exports: $Exports<'@babel/core/lib/config/item'>; 230 | } 231 | declare module '@babel/core/lib/config/partial.js' { 232 | declare module.exports: $Exports<'@babel/core/lib/config/partial'>; 233 | } 234 | declare module '@babel/core/lib/config/pattern-to-regex.js' { 235 | declare module.exports: $Exports<'@babel/core/lib/config/pattern-to-regex'>; 236 | } 237 | declare module '@babel/core/lib/config/plugin.js' { 238 | declare module.exports: $Exports<'@babel/core/lib/config/plugin'>; 239 | } 240 | declare module '@babel/core/lib/config/util.js' { 241 | declare module.exports: $Exports<'@babel/core/lib/config/util'>; 242 | } 243 | declare module '@babel/core/lib/config/validation/option-assertions.js' { 244 | declare module.exports: $Exports<'@babel/core/lib/config/validation/option-assertions'>; 245 | } 246 | declare module '@babel/core/lib/config/validation/options.js' { 247 | declare module.exports: $Exports<'@babel/core/lib/config/validation/options'>; 248 | } 249 | declare module '@babel/core/lib/config/validation/plugins.js' { 250 | declare module.exports: $Exports<'@babel/core/lib/config/validation/plugins'>; 251 | } 252 | declare module '@babel/core/lib/config/validation/removed.js' { 253 | declare module.exports: $Exports<'@babel/core/lib/config/validation/removed'>; 254 | } 255 | declare module '@babel/core/lib/index.js' { 256 | declare module.exports: $Exports<'@babel/core/lib/index'>; 257 | } 258 | declare module '@babel/core/lib/parse.js' { 259 | declare module.exports: $Exports<'@babel/core/lib/parse'>; 260 | } 261 | declare module '@babel/core/lib/tools/build-external-helpers.js' { 262 | declare module.exports: $Exports<'@babel/core/lib/tools/build-external-helpers'>; 263 | } 264 | declare module '@babel/core/lib/transform-ast.js' { 265 | declare module.exports: $Exports<'@babel/core/lib/transform-ast'>; 266 | } 267 | declare module '@babel/core/lib/transform-file-browser.js' { 268 | declare module.exports: $Exports<'@babel/core/lib/transform-file-browser'>; 269 | } 270 | declare module '@babel/core/lib/transform-file-sync-browser.js' { 271 | declare module.exports: $Exports<'@babel/core/lib/transform-file-sync-browser'>; 272 | } 273 | declare module '@babel/core/lib/transform-file.js' { 274 | declare module.exports: $Exports<'@babel/core/lib/transform-file'>; 275 | } 276 | declare module '@babel/core/lib/transform.js' { 277 | declare module.exports: $Exports<'@babel/core/lib/transform'>; 278 | } 279 | declare module '@babel/core/lib/transformation/block-hoist-plugin.js' { 280 | declare module.exports: $Exports<'@babel/core/lib/transformation/block-hoist-plugin'>; 281 | } 282 | declare module '@babel/core/lib/transformation/file/file.js' { 283 | declare module.exports: $Exports<'@babel/core/lib/transformation/file/file'>; 284 | } 285 | declare module '@babel/core/lib/transformation/file/generate.js' { 286 | declare module.exports: $Exports<'@babel/core/lib/transformation/file/generate'>; 287 | } 288 | declare module '@babel/core/lib/transformation/file/merge-map.js' { 289 | declare module.exports: $Exports<'@babel/core/lib/transformation/file/merge-map'>; 290 | } 291 | declare module '@babel/core/lib/transformation/index.js' { 292 | declare module.exports: $Exports<'@babel/core/lib/transformation/index'>; 293 | } 294 | declare module '@babel/core/lib/transformation/normalize-file.js' { 295 | declare module.exports: $Exports<'@babel/core/lib/transformation/normalize-file'>; 296 | } 297 | declare module '@babel/core/lib/transformation/normalize-opts.js' { 298 | declare module.exports: $Exports<'@babel/core/lib/transformation/normalize-opts'>; 299 | } 300 | declare module '@babel/core/lib/transformation/plugin-pass.js' { 301 | declare module.exports: $Exports<'@babel/core/lib/transformation/plugin-pass'>; 302 | } 303 | declare module '@babel/core/lib/transformation/util/missing-plugin-helper.js' { 304 | declare module.exports: $Exports<'@babel/core/lib/transformation/util/missing-plugin-helper'>; 305 | } 306 | -------------------------------------------------------------------------------- /flow-typed/npm/@babel/plugin-proposal-class-properties_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: a57cf5125d146d77f7fbd34365264f52 2 | // flow-typed version: <>/@babel/plugin-proposal-class-properties_v^7.1.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * '@babel/plugin-proposal-class-properties' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module '@babel/plugin-proposal-class-properties' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module '@babel/plugin-proposal-class-properties/lib/index' { 26 | declare module.exports: any; 27 | } 28 | 29 | // Filename aliases 30 | declare module '@babel/plugin-proposal-class-properties/lib/index.js' { 31 | declare module.exports: $Exports<'@babel/plugin-proposal-class-properties/lib/index'>; 32 | } 33 | -------------------------------------------------------------------------------- /flow-typed/npm/@babel/plugin-proposal-object-rest-spread_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 69203fbc8a5a763114f935862008d366 2 | // flow-typed version: <>/@babel/plugin-proposal-object-rest-spread_v^7.0.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * '@babel/plugin-proposal-object-rest-spread' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module '@babel/plugin-proposal-object-rest-spread' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module '@babel/plugin-proposal-object-rest-spread/lib/index' { 26 | declare module.exports: any; 27 | } 28 | 29 | // Filename aliases 30 | declare module '@babel/plugin-proposal-object-rest-spread/lib/index.js' { 31 | declare module.exports: $Exports<'@babel/plugin-proposal-object-rest-spread/lib/index'>; 32 | } 33 | -------------------------------------------------------------------------------- /flow-typed/npm/@babel/preset-env_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 58a85534241bef7dbe10a290289570c4 2 | // flow-typed version: <>/@babel/preset-env_v^7.1.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * '@babel/preset-env' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module '@babel/preset-env' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module '@babel/preset-env/data/built-in-features' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module '@babel/preset-env/data/plugin-features' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module '@babel/preset-env/data/shipped-proposals' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module '@babel/preset-env/data/unreleased-labels' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module '@babel/preset-env/lib/available-plugins' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module '@babel/preset-env/lib/built-in-definitions' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module '@babel/preset-env/lib/debug' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module '@babel/preset-env/lib/default-includes' { 54 | declare module.exports: any; 55 | } 56 | 57 | declare module '@babel/preset-env/lib/defaults' { 58 | declare module.exports: any; 59 | } 60 | 61 | declare module '@babel/preset-env/lib/index' { 62 | declare module.exports: any; 63 | } 64 | 65 | declare module '@babel/preset-env/lib/module-transformations' { 66 | declare module.exports: any; 67 | } 68 | 69 | declare module '@babel/preset-env/lib/normalize-options' { 70 | declare module.exports: any; 71 | } 72 | 73 | declare module '@babel/preset-env/lib/options' { 74 | declare module.exports: any; 75 | } 76 | 77 | declare module '@babel/preset-env/lib/targets-parser' { 78 | declare module.exports: any; 79 | } 80 | 81 | declare module '@babel/preset-env/lib/use-built-ins-entry-plugin' { 82 | declare module.exports: any; 83 | } 84 | 85 | declare module '@babel/preset-env/lib/use-built-ins-plugin' { 86 | declare module.exports: any; 87 | } 88 | 89 | declare module '@babel/preset-env/lib/utils' { 90 | declare module.exports: any; 91 | } 92 | 93 | // Filename aliases 94 | declare module '@babel/preset-env/data/built-in-features.js' { 95 | declare module.exports: $Exports<'@babel/preset-env/data/built-in-features'>; 96 | } 97 | declare module '@babel/preset-env/data/plugin-features.js' { 98 | declare module.exports: $Exports<'@babel/preset-env/data/plugin-features'>; 99 | } 100 | declare module '@babel/preset-env/data/shipped-proposals.js' { 101 | declare module.exports: $Exports<'@babel/preset-env/data/shipped-proposals'>; 102 | } 103 | declare module '@babel/preset-env/data/unreleased-labels.js' { 104 | declare module.exports: $Exports<'@babel/preset-env/data/unreleased-labels'>; 105 | } 106 | declare module '@babel/preset-env/lib/available-plugins.js' { 107 | declare module.exports: $Exports<'@babel/preset-env/lib/available-plugins'>; 108 | } 109 | declare module '@babel/preset-env/lib/built-in-definitions.js' { 110 | declare module.exports: $Exports<'@babel/preset-env/lib/built-in-definitions'>; 111 | } 112 | declare module '@babel/preset-env/lib/debug.js' { 113 | declare module.exports: $Exports<'@babel/preset-env/lib/debug'>; 114 | } 115 | declare module '@babel/preset-env/lib/default-includes.js' { 116 | declare module.exports: $Exports<'@babel/preset-env/lib/default-includes'>; 117 | } 118 | declare module '@babel/preset-env/lib/defaults.js' { 119 | declare module.exports: $Exports<'@babel/preset-env/lib/defaults'>; 120 | } 121 | declare module '@babel/preset-env/lib/index.js' { 122 | declare module.exports: $Exports<'@babel/preset-env/lib/index'>; 123 | } 124 | declare module '@babel/preset-env/lib/module-transformations.js' { 125 | declare module.exports: $Exports<'@babel/preset-env/lib/module-transformations'>; 126 | } 127 | declare module '@babel/preset-env/lib/normalize-options.js' { 128 | declare module.exports: $Exports<'@babel/preset-env/lib/normalize-options'>; 129 | } 130 | declare module '@babel/preset-env/lib/options.js' { 131 | declare module.exports: $Exports<'@babel/preset-env/lib/options'>; 132 | } 133 | declare module '@babel/preset-env/lib/targets-parser.js' { 134 | declare module.exports: $Exports<'@babel/preset-env/lib/targets-parser'>; 135 | } 136 | declare module '@babel/preset-env/lib/use-built-ins-entry-plugin.js' { 137 | declare module.exports: $Exports<'@babel/preset-env/lib/use-built-ins-entry-plugin'>; 138 | } 139 | declare module '@babel/preset-env/lib/use-built-ins-plugin.js' { 140 | declare module.exports: $Exports<'@babel/preset-env/lib/use-built-ins-plugin'>; 141 | } 142 | declare module '@babel/preset-env/lib/utils.js' { 143 | declare module.exports: $Exports<'@babel/preset-env/lib/utils'>; 144 | } 145 | -------------------------------------------------------------------------------- /flow-typed/npm/@babel/preset-flow_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 4caeeefb3ef2393af06d22ecdab1c99b 2 | // flow-typed version: <>/@babel/preset-flow_v^7.0.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * '@babel/preset-flow' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module '@babel/preset-flow' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module '@babel/preset-flow/lib/index' { 26 | declare module.exports: any; 27 | } 28 | 29 | // Filename aliases 30 | declare module '@babel/preset-flow/lib/index.js' { 31 | declare module.exports: $Exports<'@babel/preset-flow/lib/index'>; 32 | } 33 | -------------------------------------------------------------------------------- /flow-typed/npm/@babel/preset-react_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: a26f6bb2e97b856f731851547cf095a9 2 | // flow-typed version: <>/@babel/preset-react_v^7.0.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * '@babel/preset-react' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module '@babel/preset-react' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module '@babel/preset-react/lib/index' { 26 | declare module.exports: any; 27 | } 28 | 29 | // Filename aliases 30 | declare module '@babel/preset-react/lib/index.js' { 31 | declare module.exports: $Exports<'@babel/preset-react/lib/index'>; 32 | } 33 | -------------------------------------------------------------------------------- /flow-typed/npm/babel-core_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 4a45552b52bc364ed028a5558c8e166b 2 | // flow-typed version: <>/babel-core_v7.0.0-bridge.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'babel-core' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'babel-core' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | 26 | 27 | // Filename aliases 28 | declare module 'babel-core/index' { 29 | declare module.exports: $Exports<'babel-core'>; 30 | } 31 | declare module 'babel-core/index.js' { 32 | declare module.exports: $Exports<'babel-core'>; 33 | } 34 | -------------------------------------------------------------------------------- /flow-typed/npm/babel-eslint_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 78404c37cd17ffa2a5832effa628cc7b 2 | // flow-typed version: <>/babel-eslint_v=9.0.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'babel-eslint' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'babel-eslint' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'babel-eslint/lib/analyze-scope' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module 'babel-eslint/lib/babylon-to-espree/attachComments' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module 'babel-eslint/lib/babylon-to-espree/convertComments' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module 'babel-eslint/lib/babylon-to-espree/convertTemplateType' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module 'babel-eslint/lib/babylon-to-espree/index' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module 'babel-eslint/lib/babylon-to-espree/toAST' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module 'babel-eslint/lib/babylon-to-espree/toToken' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module 'babel-eslint/lib/babylon-to-espree/toTokens' { 54 | declare module.exports: any; 55 | } 56 | 57 | declare module 'babel-eslint/lib/index' { 58 | declare module.exports: any; 59 | } 60 | 61 | declare module 'babel-eslint/lib/parse-with-patch' { 62 | declare module.exports: any; 63 | } 64 | 65 | declare module 'babel-eslint/lib/parse-with-scope' { 66 | declare module.exports: any; 67 | } 68 | 69 | declare module 'babel-eslint/lib/parse' { 70 | declare module.exports: any; 71 | } 72 | 73 | declare module 'babel-eslint/lib/patch-eslint-scope' { 74 | declare module.exports: any; 75 | } 76 | 77 | declare module 'babel-eslint/lib/visitor-keys' { 78 | declare module.exports: any; 79 | } 80 | 81 | // Filename aliases 82 | declare module 'babel-eslint/lib/analyze-scope.js' { 83 | declare module.exports: $Exports<'babel-eslint/lib/analyze-scope'>; 84 | } 85 | declare module 'babel-eslint/lib/babylon-to-espree/attachComments.js' { 86 | declare module.exports: $Exports<'babel-eslint/lib/babylon-to-espree/attachComments'>; 87 | } 88 | declare module 'babel-eslint/lib/babylon-to-espree/convertComments.js' { 89 | declare module.exports: $Exports<'babel-eslint/lib/babylon-to-espree/convertComments'>; 90 | } 91 | declare module 'babel-eslint/lib/babylon-to-espree/convertTemplateType.js' { 92 | declare module.exports: $Exports<'babel-eslint/lib/babylon-to-espree/convertTemplateType'>; 93 | } 94 | declare module 'babel-eslint/lib/babylon-to-espree/index.js' { 95 | declare module.exports: $Exports<'babel-eslint/lib/babylon-to-espree/index'>; 96 | } 97 | declare module 'babel-eslint/lib/babylon-to-espree/toAST.js' { 98 | declare module.exports: $Exports<'babel-eslint/lib/babylon-to-espree/toAST'>; 99 | } 100 | declare module 'babel-eslint/lib/babylon-to-espree/toToken.js' { 101 | declare module.exports: $Exports<'babel-eslint/lib/babylon-to-espree/toToken'>; 102 | } 103 | declare module 'babel-eslint/lib/babylon-to-espree/toTokens.js' { 104 | declare module.exports: $Exports<'babel-eslint/lib/babylon-to-espree/toTokens'>; 105 | } 106 | declare module 'babel-eslint/lib/index.js' { 107 | declare module.exports: $Exports<'babel-eslint/lib/index'>; 108 | } 109 | declare module 'babel-eslint/lib/parse-with-patch.js' { 110 | declare module.exports: $Exports<'babel-eslint/lib/parse-with-patch'>; 111 | } 112 | declare module 'babel-eslint/lib/parse-with-scope.js' { 113 | declare module.exports: $Exports<'babel-eslint/lib/parse-with-scope'>; 114 | } 115 | declare module 'babel-eslint/lib/parse.js' { 116 | declare module.exports: $Exports<'babel-eslint/lib/parse'>; 117 | } 118 | declare module 'babel-eslint/lib/patch-eslint-scope.js' { 119 | declare module.exports: $Exports<'babel-eslint/lib/patch-eslint-scope'>; 120 | } 121 | declare module 'babel-eslint/lib/visitor-keys.js' { 122 | declare module.exports: $Exports<'babel-eslint/lib/visitor-keys'>; 123 | } 124 | -------------------------------------------------------------------------------- /flow-typed/npm/babel-jest_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 4562d96298d6d40eb5becff5405da437 2 | // flow-typed version: <>/babel-jest_v^23.6.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'babel-jest' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'babel-jest' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'babel-jest/build/index' { 26 | declare module.exports: any; 27 | } 28 | 29 | // Filename aliases 30 | declare module 'babel-jest/build/index.js' { 31 | declare module.exports: $Exports<'babel-jest/build/index'>; 32 | } 33 | -------------------------------------------------------------------------------- /flow-typed/npm/canvas_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 285ab3098bb7f62e4bacfa2e67b13d47 2 | // flow-typed version: <>/canvas_v^1.3.5/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'canvas' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'canvas' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'canvas/lib/bindings' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module 'canvas/lib/canvas' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module 'canvas/lib/context2d' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module 'canvas/lib/image' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module 'canvas/lib/jpegstream' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module 'canvas/lib/parse-font' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module 'canvas/lib/pdfstream' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module 'canvas/lib/pngstream' { 54 | declare module.exports: any; 55 | } 56 | 57 | // Filename aliases 58 | declare module 'canvas/index' { 59 | declare module.exports: $Exports<'canvas'>; 60 | } 61 | declare module 'canvas/index.js' { 62 | declare module.exports: $Exports<'canvas'>; 63 | } 64 | declare module 'canvas/lib/bindings.js' { 65 | declare module.exports: $Exports<'canvas/lib/bindings'>; 66 | } 67 | declare module 'canvas/lib/canvas.js' { 68 | declare module.exports: $Exports<'canvas/lib/canvas'>; 69 | } 70 | declare module 'canvas/lib/context2d.js' { 71 | declare module.exports: $Exports<'canvas/lib/context2d'>; 72 | } 73 | declare module 'canvas/lib/image.js' { 74 | declare module.exports: $Exports<'canvas/lib/image'>; 75 | } 76 | declare module 'canvas/lib/jpegstream.js' { 77 | declare module.exports: $Exports<'canvas/lib/jpegstream'>; 78 | } 79 | declare module 'canvas/lib/parse-font.js' { 80 | declare module.exports: $Exports<'canvas/lib/parse-font'>; 81 | } 82 | declare module 'canvas/lib/pdfstream.js' { 83 | declare module.exports: $Exports<'canvas/lib/pdfstream'>; 84 | } 85 | declare module 'canvas/lib/pngstream.js' { 86 | declare module.exports: $Exports<'canvas/lib/pngstream'>; 87 | } 88 | -------------------------------------------------------------------------------- /flow-typed/npm/enzyme-adapter-react-16_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 3f1710f90781fd1859f39dd32a7529e1 2 | // flow-typed version: <>/enzyme-adapter-react-16_v^1.6.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'enzyme-adapter-react-16' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'enzyme-adapter-react-16' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'enzyme-adapter-react-16/build/detectFiberTags' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module 'enzyme-adapter-react-16/build/findCurrentFiberUsingSlowPath' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module 'enzyme-adapter-react-16/build/index' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module 'enzyme-adapter-react-16/build/ReactSixteenAdapter' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module 'enzyme-adapter-react-16/src/detectFiberTags' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module 'enzyme-adapter-react-16/src/findCurrentFiberUsingSlowPath' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module 'enzyme-adapter-react-16/src/index' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module 'enzyme-adapter-react-16/src/ReactSixteenAdapter' { 54 | declare module.exports: any; 55 | } 56 | 57 | // Filename aliases 58 | declare module 'enzyme-adapter-react-16/build/detectFiberTags.js' { 59 | declare module.exports: $Exports<'enzyme-adapter-react-16/build/detectFiberTags'>; 60 | } 61 | declare module 'enzyme-adapter-react-16/build/findCurrentFiberUsingSlowPath.js' { 62 | declare module.exports: $Exports<'enzyme-adapter-react-16/build/findCurrentFiberUsingSlowPath'>; 63 | } 64 | declare module 'enzyme-adapter-react-16/build/index.js' { 65 | declare module.exports: $Exports<'enzyme-adapter-react-16/build/index'>; 66 | } 67 | declare module 'enzyme-adapter-react-16/build/ReactSixteenAdapter.js' { 68 | declare module.exports: $Exports<'enzyme-adapter-react-16/build/ReactSixteenAdapter'>; 69 | } 70 | declare module 'enzyme-adapter-react-16/src/detectFiberTags.js' { 71 | declare module.exports: $Exports<'enzyme-adapter-react-16/src/detectFiberTags'>; 72 | } 73 | declare module 'enzyme-adapter-react-16/src/findCurrentFiberUsingSlowPath.js' { 74 | declare module.exports: $Exports<'enzyme-adapter-react-16/src/findCurrentFiberUsingSlowPath'>; 75 | } 76 | declare module 'enzyme-adapter-react-16/src/index.js' { 77 | declare module.exports: $Exports<'enzyme-adapter-react-16/src/index'>; 78 | } 79 | declare module 'enzyme-adapter-react-16/src/ReactSixteenAdapter.js' { 80 | declare module.exports: $Exports<'enzyme-adapter-react-16/src/ReactSixteenAdapter'>; 81 | } 82 | -------------------------------------------------------------------------------- /flow-typed/npm/enzyme_v3.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: e50486ad88c5bbfcdfde9fef4fc4c5d1 2 | // flow-typed version: ab187b275b/enzyme_v3.x.x/flow_>=v0.53.x 3 | 4 | import * as React from "react"; 5 | 6 | declare module "enzyme" { 7 | declare type PredicateFunction = ( 8 | wrapper: T, 9 | index: number 10 | ) => boolean; 11 | declare type NodeOrNodes = React.Node | Array; 12 | declare type EnzymeSelector = string | Class> | Object; 13 | 14 | // CheerioWrapper is a type alias for an actual cheerio instance 15 | // TODO: Reference correct type from cheerio's type declarations 16 | declare type CheerioWrapper = any; 17 | 18 | declare class Wrapper { 19 | find(selector: EnzymeSelector): this, 20 | findWhere(predicate: PredicateFunction): this, 21 | filter(selector: EnzymeSelector): this, 22 | filterWhere(predicate: PredicateFunction): this, 23 | hostNodes(): this, 24 | contains(nodeOrNodes: NodeOrNodes): boolean, 25 | containsMatchingElement(node: React.Node): boolean, 26 | containsAllMatchingElements(nodes: NodeOrNodes): boolean, 27 | containsAnyMatchingElements(nodes: NodeOrNodes): boolean, 28 | dive(option?: { context?: Object }): this, 29 | exists(): boolean, 30 | isEmptyRender(): boolean, 31 | matchesElement(node: React.Node): boolean, 32 | hasClass(className: string): boolean, 33 | is(selector: EnzymeSelector): boolean, 34 | isEmpty(): boolean, 35 | not(selector: EnzymeSelector): this, 36 | children(selector?: EnzymeSelector): this, 37 | childAt(index: number): this, 38 | parents(selector?: EnzymeSelector): this, 39 | parent(): this, 40 | closest(selector: EnzymeSelector): this, 41 | render(): CheerioWrapper, 42 | unmount(): this, 43 | text(): string, 44 | html(): string, 45 | get(index: number): React.Node, 46 | getDOMNode(): HTMLElement | HTMLInputElement, 47 | at(index: number): this, 48 | first(): this, 49 | last(): this, 50 | state(key?: string): any, 51 | context(key?: string): any, 52 | props(): Object, 53 | prop(key: string): any, 54 | key(): string, 55 | simulate(event: string, ...args: Array): this, 56 | slice(begin?: number, end?: number): this, 57 | setState(state: {}, callback?: Function): this, 58 | setProps(props: {}): this, 59 | setContext(context: Object): this, 60 | instance(): React.Component<*, *>, 61 | update(): this, 62 | debug(options?: Object): string, 63 | type(): string | Function | null, 64 | name(): string, 65 | forEach(fn: (node: this, index: number) => mixed): this, 66 | map(fn: (node: this, index: number) => T): Array, 67 | reduce( 68 | fn: (value: T, node: this, index: number) => T, 69 | initialValue?: T 70 | ): Array, 71 | reduceRight( 72 | fn: (value: T, node: this, index: number) => T, 73 | initialValue?: T 74 | ): Array, 75 | some(selector: EnzymeSelector): boolean, 76 | someWhere(predicate: PredicateFunction): boolean, 77 | every(selector: EnzymeSelector): boolean, 78 | everyWhere(predicate: PredicateFunction): boolean, 79 | length: number 80 | } 81 | 82 | declare class ReactWrapper extends Wrapper { 83 | constructor(nodes: NodeOrNodes, root: any, options?: ?Object): ReactWrapper, 84 | mount(): this, 85 | ref(refName: string): this, 86 | detach(): void 87 | } 88 | 89 | declare class ShallowWrapper extends Wrapper { 90 | constructor( 91 | nodes: NodeOrNodes, 92 | root: any, 93 | options?: ?Object 94 | ): ShallowWrapper, 95 | equals(node: React.Node): boolean, 96 | shallow(options?: { context?: Object }): ShallowWrapper, 97 | getElement(): React.Node, 98 | getElements(): Array 99 | } 100 | 101 | declare function shallow( 102 | node: React.Node, 103 | options?: { context?: Object, disableLifecycleMethods?: boolean } 104 | ): ShallowWrapper; 105 | declare function mount( 106 | node: React.Node, 107 | options?: { 108 | context?: Object, 109 | attachTo?: HTMLElement, 110 | childContextTypes?: Object 111 | } 112 | ): ReactWrapper; 113 | declare function render( 114 | node: React.Node, 115 | options?: { context?: Object } 116 | ): CheerioWrapper; 117 | 118 | declare module.exports: { 119 | configure(options: { 120 | Adapter?: any, 121 | disableLifecycleMethods?: boolean 122 | }): void, 123 | render: typeof render, 124 | mount: typeof mount, 125 | shallow: typeof shallow, 126 | ShallowWrapper: typeof ShallowWrapper, 127 | ReactWrapper: typeof ReactWrapper 128 | }; 129 | } 130 | -------------------------------------------------------------------------------- /flow-typed/npm/eslint-plugin-import_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 410efb1747ed369fcc24fa91d4fd5d86 2 | // flow-typed version: <>/eslint-plugin-import_v^2.12.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'eslint-plugin-import' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'eslint-plugin-import' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'eslint-plugin-import/config/electron' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module 'eslint-plugin-import/config/errors' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module 'eslint-plugin-import/config/react-native' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module 'eslint-plugin-import/config/react' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module 'eslint-plugin-import/config/recommended' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module 'eslint-plugin-import/config/stage-0' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module 'eslint-plugin-import/config/warnings' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module 'eslint-plugin-import/lib/core/importType' { 54 | declare module.exports: any; 55 | } 56 | 57 | declare module 'eslint-plugin-import/lib/core/staticRequire' { 58 | declare module.exports: any; 59 | } 60 | 61 | declare module 'eslint-plugin-import/lib/docsUrl' { 62 | declare module.exports: any; 63 | } 64 | 65 | declare module 'eslint-plugin-import/lib/ExportMap' { 66 | declare module.exports: any; 67 | } 68 | 69 | declare module 'eslint-plugin-import/lib/importDeclaration' { 70 | declare module.exports: any; 71 | } 72 | 73 | declare module 'eslint-plugin-import/lib/index' { 74 | declare module.exports: any; 75 | } 76 | 77 | declare module 'eslint-plugin-import/lib/rules/default' { 78 | declare module.exports: any; 79 | } 80 | 81 | declare module 'eslint-plugin-import/lib/rules/dynamic-import-chunkname' { 82 | declare module.exports: any; 83 | } 84 | 85 | declare module 'eslint-plugin-import/lib/rules/export' { 86 | declare module.exports: any; 87 | } 88 | 89 | declare module 'eslint-plugin-import/lib/rules/exports-last' { 90 | declare module.exports: any; 91 | } 92 | 93 | declare module 'eslint-plugin-import/lib/rules/extensions' { 94 | declare module.exports: any; 95 | } 96 | 97 | declare module 'eslint-plugin-import/lib/rules/first' { 98 | declare module.exports: any; 99 | } 100 | 101 | declare module 'eslint-plugin-import/lib/rules/group-exports' { 102 | declare module.exports: any; 103 | } 104 | 105 | declare module 'eslint-plugin-import/lib/rules/imports-first' { 106 | declare module.exports: any; 107 | } 108 | 109 | declare module 'eslint-plugin-import/lib/rules/max-dependencies' { 110 | declare module.exports: any; 111 | } 112 | 113 | declare module 'eslint-plugin-import/lib/rules/named' { 114 | declare module.exports: any; 115 | } 116 | 117 | declare module 'eslint-plugin-import/lib/rules/namespace' { 118 | declare module.exports: any; 119 | } 120 | 121 | declare module 'eslint-plugin-import/lib/rules/newline-after-import' { 122 | declare module.exports: any; 123 | } 124 | 125 | declare module 'eslint-plugin-import/lib/rules/no-absolute-path' { 126 | declare module.exports: any; 127 | } 128 | 129 | declare module 'eslint-plugin-import/lib/rules/no-amd' { 130 | declare module.exports: any; 131 | } 132 | 133 | declare module 'eslint-plugin-import/lib/rules/no-anonymous-default-export' { 134 | declare module.exports: any; 135 | } 136 | 137 | declare module 'eslint-plugin-import/lib/rules/no-commonjs' { 138 | declare module.exports: any; 139 | } 140 | 141 | declare module 'eslint-plugin-import/lib/rules/no-cycle' { 142 | declare module.exports: any; 143 | } 144 | 145 | declare module 'eslint-plugin-import/lib/rules/no-default-export' { 146 | declare module.exports: any; 147 | } 148 | 149 | declare module 'eslint-plugin-import/lib/rules/no-deprecated' { 150 | declare module.exports: any; 151 | } 152 | 153 | declare module 'eslint-plugin-import/lib/rules/no-duplicates' { 154 | declare module.exports: any; 155 | } 156 | 157 | declare module 'eslint-plugin-import/lib/rules/no-dynamic-require' { 158 | declare module.exports: any; 159 | } 160 | 161 | declare module 'eslint-plugin-import/lib/rules/no-extraneous-dependencies' { 162 | declare module.exports: any; 163 | } 164 | 165 | declare module 'eslint-plugin-import/lib/rules/no-internal-modules' { 166 | declare module.exports: any; 167 | } 168 | 169 | declare module 'eslint-plugin-import/lib/rules/no-mutable-exports' { 170 | declare module.exports: any; 171 | } 172 | 173 | declare module 'eslint-plugin-import/lib/rules/no-named-as-default-member' { 174 | declare module.exports: any; 175 | } 176 | 177 | declare module 'eslint-plugin-import/lib/rules/no-named-as-default' { 178 | declare module.exports: any; 179 | } 180 | 181 | declare module 'eslint-plugin-import/lib/rules/no-named-default' { 182 | declare module.exports: any; 183 | } 184 | 185 | declare module 'eslint-plugin-import/lib/rules/no-namespace' { 186 | declare module.exports: any; 187 | } 188 | 189 | declare module 'eslint-plugin-import/lib/rules/no-nodejs-modules' { 190 | declare module.exports: any; 191 | } 192 | 193 | declare module 'eslint-plugin-import/lib/rules/no-relative-parent-imports' { 194 | declare module.exports: any; 195 | } 196 | 197 | declare module 'eslint-plugin-import/lib/rules/no-restricted-paths' { 198 | declare module.exports: any; 199 | } 200 | 201 | declare module 'eslint-plugin-import/lib/rules/no-self-import' { 202 | declare module.exports: any; 203 | } 204 | 205 | declare module 'eslint-plugin-import/lib/rules/no-unassigned-import' { 206 | declare module.exports: any; 207 | } 208 | 209 | declare module 'eslint-plugin-import/lib/rules/no-unresolved' { 210 | declare module.exports: any; 211 | } 212 | 213 | declare module 'eslint-plugin-import/lib/rules/no-useless-path-segments' { 214 | declare module.exports: any; 215 | } 216 | 217 | declare module 'eslint-plugin-import/lib/rules/no-webpack-loader-syntax' { 218 | declare module.exports: any; 219 | } 220 | 221 | declare module 'eslint-plugin-import/lib/rules/order' { 222 | declare module.exports: any; 223 | } 224 | 225 | declare module 'eslint-plugin-import/lib/rules/prefer-default-export' { 226 | declare module.exports: any; 227 | } 228 | 229 | declare module 'eslint-plugin-import/lib/rules/unambiguous' { 230 | declare module.exports: any; 231 | } 232 | 233 | declare module 'eslint-plugin-import/memo-parser/index' { 234 | declare module.exports: any; 235 | } 236 | 237 | // Filename aliases 238 | declare module 'eslint-plugin-import/config/electron.js' { 239 | declare module.exports: $Exports<'eslint-plugin-import/config/electron'>; 240 | } 241 | declare module 'eslint-plugin-import/config/errors.js' { 242 | declare module.exports: $Exports<'eslint-plugin-import/config/errors'>; 243 | } 244 | declare module 'eslint-plugin-import/config/react-native.js' { 245 | declare module.exports: $Exports<'eslint-plugin-import/config/react-native'>; 246 | } 247 | declare module 'eslint-plugin-import/config/react.js' { 248 | declare module.exports: $Exports<'eslint-plugin-import/config/react'>; 249 | } 250 | declare module 'eslint-plugin-import/config/recommended.js' { 251 | declare module.exports: $Exports<'eslint-plugin-import/config/recommended'>; 252 | } 253 | declare module 'eslint-plugin-import/config/stage-0.js' { 254 | declare module.exports: $Exports<'eslint-plugin-import/config/stage-0'>; 255 | } 256 | declare module 'eslint-plugin-import/config/warnings.js' { 257 | declare module.exports: $Exports<'eslint-plugin-import/config/warnings'>; 258 | } 259 | declare module 'eslint-plugin-import/lib/core/importType.js' { 260 | declare module.exports: $Exports<'eslint-plugin-import/lib/core/importType'>; 261 | } 262 | declare module 'eslint-plugin-import/lib/core/staticRequire.js' { 263 | declare module.exports: $Exports<'eslint-plugin-import/lib/core/staticRequire'>; 264 | } 265 | declare module 'eslint-plugin-import/lib/docsUrl.js' { 266 | declare module.exports: $Exports<'eslint-plugin-import/lib/docsUrl'>; 267 | } 268 | declare module 'eslint-plugin-import/lib/ExportMap.js' { 269 | declare module.exports: $Exports<'eslint-plugin-import/lib/ExportMap'>; 270 | } 271 | declare module 'eslint-plugin-import/lib/importDeclaration.js' { 272 | declare module.exports: $Exports<'eslint-plugin-import/lib/importDeclaration'>; 273 | } 274 | declare module 'eslint-plugin-import/lib/index.js' { 275 | declare module.exports: $Exports<'eslint-plugin-import/lib/index'>; 276 | } 277 | declare module 'eslint-plugin-import/lib/rules/default.js' { 278 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/default'>; 279 | } 280 | declare module 'eslint-plugin-import/lib/rules/dynamic-import-chunkname.js' { 281 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/dynamic-import-chunkname'>; 282 | } 283 | declare module 'eslint-plugin-import/lib/rules/export.js' { 284 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/export'>; 285 | } 286 | declare module 'eslint-plugin-import/lib/rules/exports-last.js' { 287 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/exports-last'>; 288 | } 289 | declare module 'eslint-plugin-import/lib/rules/extensions.js' { 290 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/extensions'>; 291 | } 292 | declare module 'eslint-plugin-import/lib/rules/first.js' { 293 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/first'>; 294 | } 295 | declare module 'eslint-plugin-import/lib/rules/group-exports.js' { 296 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/group-exports'>; 297 | } 298 | declare module 'eslint-plugin-import/lib/rules/imports-first.js' { 299 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/imports-first'>; 300 | } 301 | declare module 'eslint-plugin-import/lib/rules/max-dependencies.js' { 302 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/max-dependencies'>; 303 | } 304 | declare module 'eslint-plugin-import/lib/rules/named.js' { 305 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/named'>; 306 | } 307 | declare module 'eslint-plugin-import/lib/rules/namespace.js' { 308 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/namespace'>; 309 | } 310 | declare module 'eslint-plugin-import/lib/rules/newline-after-import.js' { 311 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/newline-after-import'>; 312 | } 313 | declare module 'eslint-plugin-import/lib/rules/no-absolute-path.js' { 314 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-absolute-path'>; 315 | } 316 | declare module 'eslint-plugin-import/lib/rules/no-amd.js' { 317 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-amd'>; 318 | } 319 | declare module 'eslint-plugin-import/lib/rules/no-anonymous-default-export.js' { 320 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-anonymous-default-export'>; 321 | } 322 | declare module 'eslint-plugin-import/lib/rules/no-commonjs.js' { 323 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-commonjs'>; 324 | } 325 | declare module 'eslint-plugin-import/lib/rules/no-cycle.js' { 326 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-cycle'>; 327 | } 328 | declare module 'eslint-plugin-import/lib/rules/no-default-export.js' { 329 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-default-export'>; 330 | } 331 | declare module 'eslint-plugin-import/lib/rules/no-deprecated.js' { 332 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-deprecated'>; 333 | } 334 | declare module 'eslint-plugin-import/lib/rules/no-duplicates.js' { 335 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-duplicates'>; 336 | } 337 | declare module 'eslint-plugin-import/lib/rules/no-dynamic-require.js' { 338 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-dynamic-require'>; 339 | } 340 | declare module 'eslint-plugin-import/lib/rules/no-extraneous-dependencies.js' { 341 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-extraneous-dependencies'>; 342 | } 343 | declare module 'eslint-plugin-import/lib/rules/no-internal-modules.js' { 344 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-internal-modules'>; 345 | } 346 | declare module 'eslint-plugin-import/lib/rules/no-mutable-exports.js' { 347 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-mutable-exports'>; 348 | } 349 | declare module 'eslint-plugin-import/lib/rules/no-named-as-default-member.js' { 350 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-named-as-default-member'>; 351 | } 352 | declare module 'eslint-plugin-import/lib/rules/no-named-as-default.js' { 353 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-named-as-default'>; 354 | } 355 | declare module 'eslint-plugin-import/lib/rules/no-named-default.js' { 356 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-named-default'>; 357 | } 358 | declare module 'eslint-plugin-import/lib/rules/no-namespace.js' { 359 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-namespace'>; 360 | } 361 | declare module 'eslint-plugin-import/lib/rules/no-nodejs-modules.js' { 362 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-nodejs-modules'>; 363 | } 364 | declare module 'eslint-plugin-import/lib/rules/no-relative-parent-imports.js' { 365 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-relative-parent-imports'>; 366 | } 367 | declare module 'eslint-plugin-import/lib/rules/no-restricted-paths.js' { 368 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-restricted-paths'>; 369 | } 370 | declare module 'eslint-plugin-import/lib/rules/no-self-import.js' { 371 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-self-import'>; 372 | } 373 | declare module 'eslint-plugin-import/lib/rules/no-unassigned-import.js' { 374 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-unassigned-import'>; 375 | } 376 | declare module 'eslint-plugin-import/lib/rules/no-unresolved.js' { 377 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-unresolved'>; 378 | } 379 | declare module 'eslint-plugin-import/lib/rules/no-useless-path-segments.js' { 380 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-useless-path-segments'>; 381 | } 382 | declare module 'eslint-plugin-import/lib/rules/no-webpack-loader-syntax.js' { 383 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/no-webpack-loader-syntax'>; 384 | } 385 | declare module 'eslint-plugin-import/lib/rules/order.js' { 386 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/order'>; 387 | } 388 | declare module 'eslint-plugin-import/lib/rules/prefer-default-export.js' { 389 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/prefer-default-export'>; 390 | } 391 | declare module 'eslint-plugin-import/lib/rules/unambiguous.js' { 392 | declare module.exports: $Exports<'eslint-plugin-import/lib/rules/unambiguous'>; 393 | } 394 | declare module 'eslint-plugin-import/memo-parser/index.js' { 395 | declare module.exports: $Exports<'eslint-plugin-import/memo-parser/index'>; 396 | } 397 | -------------------------------------------------------------------------------- /flow-typed/npm/flow-bin_v0.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 6a5610678d4b01e13bbfbbc62bdaf583 2 | // flow-typed version: 3817bc6980/flow-bin_v0.x.x/flow_>=v0.25.x 3 | 4 | declare module "flow-bin" { 5 | declare module.exports: string; 6 | } 7 | -------------------------------------------------------------------------------- /flow-typed/npm/flow-copy-source_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: ce5d46cf2738048a48f98d6d1ff09722 2 | // flow-typed version: <>/flow-copy-source_v^2.0.2/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'flow-copy-source' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'flow-copy-source' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'flow-copy-source/bin/flow-copy-source' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module 'flow-copy-source/src/index' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module 'flow-copy-source/src/kefir-copy-file' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module 'flow-copy-source/src/kefir-glob' { 38 | declare module.exports: any; 39 | } 40 | 41 | // Filename aliases 42 | declare module 'flow-copy-source/bin/flow-copy-source.js' { 43 | declare module.exports: $Exports<'flow-copy-source/bin/flow-copy-source'>; 44 | } 45 | declare module 'flow-copy-source/src/index.js' { 46 | declare module.exports: $Exports<'flow-copy-source/src/index'>; 47 | } 48 | declare module 'flow-copy-source/src/kefir-copy-file.js' { 49 | declare module.exports: $Exports<'flow-copy-source/src/kefir-copy-file'>; 50 | } 51 | declare module 'flow-copy-source/src/kefir-glob.js' { 52 | declare module.exports: $Exports<'flow-copy-source/src/kefir-glob'>; 53 | } 54 | -------------------------------------------------------------------------------- /flow-typed/npm/prettier_v1.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 066c92e9ccb5f0711df8d73cbca837d6 2 | // flow-typed version: 9e32affdbd/prettier_v1.x.x/flow_>=v0.56.x 3 | 4 | declare module "prettier" { 5 | declare export type AST = Object; 6 | declare export type Doc = Object; 7 | declare export type FastPath = Object; 8 | 9 | declare export type PrettierParserName = 10 | | "babylon" 11 | | "flow" 12 | | "typescript" 13 | | "postcss" 14 | | "css" 15 | | "less" 16 | | "scss" 17 | | "json" 18 | | "graphql" 19 | | "markdown" 20 | | "vue"; 21 | 22 | declare export type PrettierParser = { 23 | [name: PrettierParserName]: (text: string, options?: Object) => AST 24 | }; 25 | 26 | declare export type CustomParser = ( 27 | text: string, 28 | parsers: PrettierParser, 29 | options: Options 30 | ) => AST; 31 | 32 | declare export type Options = {| 33 | printWidth?: number, 34 | tabWidth?: number, 35 | useTabs?: boolean, 36 | semi?: boolean, 37 | singleQuote?: boolean, 38 | trailingComma?: "none" | "es5" | "all", 39 | bracketSpacing?: boolean, 40 | jsxBracketSameLine?: boolean, 41 | arrowParens?: "avoid" | "always", 42 | rangeStart?: number, 43 | rangeEnd?: number, 44 | parser?: PrettierParserName | CustomParser, 45 | filepath?: string, 46 | requirePragma?: boolean, 47 | insertPragma?: boolean, 48 | proseWrap?: "always" | "never" | "preserve", 49 | plugins?: Array 50 | |}; 51 | 52 | declare export type Plugin = { 53 | languages: SupportLanguage, 54 | parsers: { [parserName: string]: Parser }, 55 | printers: { [astFormat: string]: Printer } 56 | }; 57 | 58 | declare export type Parser = { 59 | parse: ( 60 | text: string, 61 | parsers: { [parserName: string]: Parser }, 62 | options: Object 63 | ) => AST, 64 | astFormat: string 65 | }; 66 | 67 | declare export type Printer = { 68 | print: ( 69 | path: FastPath, 70 | options: Object, 71 | print: (path: FastPath) => Doc 72 | ) => Doc, 73 | embed: ( 74 | path: FastPath, 75 | print: (path: FastPath) => Doc, 76 | textToDoc: (text: string, options: Object) => Doc, 77 | options: Object 78 | ) => ?Doc 79 | }; 80 | 81 | declare export type CursorOptions = {| 82 | cursorOffset: number, 83 | printWidth?: $PropertyType, 84 | tabWidth?: $PropertyType, 85 | useTabs?: $PropertyType, 86 | semi?: $PropertyType, 87 | singleQuote?: $PropertyType, 88 | trailingComma?: $PropertyType, 89 | bracketSpacing?: $PropertyType, 90 | jsxBracketSameLine?: $PropertyType, 91 | arrowParens?: $PropertyType, 92 | parser?: $PropertyType, 93 | filepath?: $PropertyType, 94 | requirePragma?: $PropertyType, 95 | insertPragma?: $PropertyType, 96 | proseWrap?: $PropertyType, 97 | plugins?: $PropertyType 98 | |}; 99 | 100 | declare export type CursorResult = {| 101 | formatted: string, 102 | cursorOffset: number 103 | |}; 104 | 105 | declare export type ResolveConfigOptions = {| 106 | useCache?: boolean, 107 | config?: string, 108 | editorconfig?: boolean 109 | |}; 110 | 111 | declare export type SupportLanguage = { 112 | name: string, 113 | since: string, 114 | parsers: Array, 115 | group?: string, 116 | tmScope: string, 117 | aceMode: string, 118 | codemirrorMode: string, 119 | codemirrorMimeType: string, 120 | aliases?: Array, 121 | extensions: Array, 122 | filenames?: Array, 123 | linguistLanguageId: number, 124 | vscodeLanguageIds: Array 125 | }; 126 | 127 | declare export type SupportOption = {| 128 | since: string, 129 | type: "int" | "boolean" | "choice" | "path", 130 | deprecated?: string, 131 | redirect?: SupportOptionRedirect, 132 | description: string, 133 | oppositeDescription?: string, 134 | default: SupportOptionValue, 135 | range?: SupportOptionRange, 136 | choices?: SupportOptionChoice 137 | |}; 138 | 139 | declare export type SupportOptionRedirect = {| 140 | options: string, 141 | value: SupportOptionValue 142 | |}; 143 | 144 | declare export type SupportOptionRange = {| 145 | start: number, 146 | end: number, 147 | step: number 148 | |}; 149 | 150 | declare export type SupportOptionChoice = {| 151 | value: boolean | string, 152 | description?: string, 153 | since?: string, 154 | deprecated?: string, 155 | redirect?: SupportOptionValue 156 | |}; 157 | 158 | declare export type SupportOptionValue = number | boolean | string; 159 | 160 | declare export type SupportInfo = {| 161 | languages: Array, 162 | options: Array 163 | |}; 164 | 165 | declare export type Prettier = {| 166 | format: (source: string, options?: Options) => string, 167 | check: (source: string, options?: Options) => boolean, 168 | formatWithCursor: (source: string, options: CursorOptions) => CursorResult, 169 | resolveConfig: { 170 | (filePath: string, options?: ResolveConfigOptions): Promise, 171 | sync(filePath: string, options?: ResolveConfigOptions): ?Options 172 | }, 173 | clearConfigCache: () => void, 174 | getSupportInfo: (version?: string) => SupportInfo 175 | |}; 176 | 177 | declare export default Prettier; 178 | } 179 | -------------------------------------------------------------------------------- /flow-typed/npm/react-reconciler_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: d913fefc6cd15448af5e3f1615fe18f6 2 | // flow-typed version: <>/react-reconciler_v^0.16.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'react-reconciler' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'react-reconciler' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'react-reconciler/cjs/react-reconciler-persistent.development' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module 'react-reconciler/cjs/react-reconciler-persistent.production.min' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module 'react-reconciler/cjs/react-reconciler-reflection.development' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module 'react-reconciler/cjs/react-reconciler-reflection.production.min' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module 'react-reconciler/cjs/react-reconciler.development' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module 'react-reconciler/cjs/react-reconciler.production.min' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module 'react-reconciler/persistent' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module 'react-reconciler/reflection' { 54 | declare module.exports: any; 55 | } 56 | 57 | // Filename aliases 58 | declare module 'react-reconciler/cjs/react-reconciler-persistent.development.js' { 59 | declare module.exports: $Exports<'react-reconciler/cjs/react-reconciler-persistent.development'>; 60 | } 61 | declare module 'react-reconciler/cjs/react-reconciler-persistent.production.min.js' { 62 | declare module.exports: $Exports<'react-reconciler/cjs/react-reconciler-persistent.production.min'>; 63 | } 64 | declare module 'react-reconciler/cjs/react-reconciler-reflection.development.js' { 65 | declare module.exports: $Exports<'react-reconciler/cjs/react-reconciler-reflection.development'>; 66 | } 67 | declare module 'react-reconciler/cjs/react-reconciler-reflection.production.min.js' { 68 | declare module.exports: $Exports<'react-reconciler/cjs/react-reconciler-reflection.production.min'>; 69 | } 70 | declare module 'react-reconciler/cjs/react-reconciler.development.js' { 71 | declare module.exports: $Exports<'react-reconciler/cjs/react-reconciler.development'>; 72 | } 73 | declare module 'react-reconciler/cjs/react-reconciler.production.min.js' { 74 | declare module.exports: $Exports<'react-reconciler/cjs/react-reconciler.production.min'>; 75 | } 76 | declare module 'react-reconciler/index' { 77 | declare module.exports: $Exports<'react-reconciler'>; 78 | } 79 | declare module 'react-reconciler/index.js' { 80 | declare module.exports: $Exports<'react-reconciler'>; 81 | } 82 | declare module 'react-reconciler/persistent.js' { 83 | declare module.exports: $Exports<'react-reconciler/persistent'>; 84 | } 85 | declare module 'react-reconciler/reflection.js' { 86 | declare module.exports: $Exports<'react-reconciler/reflection'>; 87 | } 88 | -------------------------------------------------------------------------------- /flow-typed/npm/scheduler_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: b72c904a640f7dde7703eeec6b45f8c3 2 | // flow-typed version: <>/scheduler_v^0.10.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'scheduler' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'scheduler' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'scheduler/cjs/scheduler-tracing.development' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module 'scheduler/cjs/scheduler-tracing.production.min' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module 'scheduler/cjs/scheduler-tracing.profiling.min' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module 'scheduler/cjs/scheduler.development' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module 'scheduler/cjs/scheduler.production.min' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module 'scheduler/tracing-profiling' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module 'scheduler/tracing' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module 'scheduler/umd/scheduler-tracing.development' { 54 | declare module.exports: any; 55 | } 56 | 57 | declare module 'scheduler/umd/scheduler-tracing.production.min' { 58 | declare module.exports: any; 59 | } 60 | 61 | declare module 'scheduler/umd/scheduler-tracing.profiling.min' { 62 | declare module.exports: any; 63 | } 64 | 65 | declare module 'scheduler/umd/scheduler.development' { 66 | declare module.exports: any; 67 | } 68 | 69 | declare module 'scheduler/umd/scheduler.production.min' { 70 | declare module.exports: any; 71 | } 72 | 73 | declare module 'scheduler/umd/scheduler.profiling.min' { 74 | declare module.exports: any; 75 | } 76 | 77 | // Filename aliases 78 | declare module 'scheduler/cjs/scheduler-tracing.development.js' { 79 | declare module.exports: $Exports<'scheduler/cjs/scheduler-tracing.development'>; 80 | } 81 | declare module 'scheduler/cjs/scheduler-tracing.production.min.js' { 82 | declare module.exports: $Exports<'scheduler/cjs/scheduler-tracing.production.min'>; 83 | } 84 | declare module 'scheduler/cjs/scheduler-tracing.profiling.min.js' { 85 | declare module.exports: $Exports<'scheduler/cjs/scheduler-tracing.profiling.min'>; 86 | } 87 | declare module 'scheduler/cjs/scheduler.development.js' { 88 | declare module.exports: $Exports<'scheduler/cjs/scheduler.development'>; 89 | } 90 | declare module 'scheduler/cjs/scheduler.production.min.js' { 91 | declare module.exports: $Exports<'scheduler/cjs/scheduler.production.min'>; 92 | } 93 | declare module 'scheduler/index' { 94 | declare module.exports: $Exports<'scheduler'>; 95 | } 96 | declare module 'scheduler/index.js' { 97 | declare module.exports: $Exports<'scheduler'>; 98 | } 99 | declare module 'scheduler/tracing-profiling.js' { 100 | declare module.exports: $Exports<'scheduler/tracing-profiling'>; 101 | } 102 | declare module 'scheduler/tracing.js' { 103 | declare module.exports: $Exports<'scheduler/tracing'>; 104 | } 105 | declare module 'scheduler/umd/scheduler-tracing.development.js' { 106 | declare module.exports: $Exports<'scheduler/umd/scheduler-tracing.development'>; 107 | } 108 | declare module 'scheduler/umd/scheduler-tracing.production.min.js' { 109 | declare module.exports: $Exports<'scheduler/umd/scheduler-tracing.production.min'>; 110 | } 111 | declare module 'scheduler/umd/scheduler-tracing.profiling.min.js' { 112 | declare module.exports: $Exports<'scheduler/umd/scheduler-tracing.profiling.min'>; 113 | } 114 | declare module 'scheduler/umd/scheduler.development.js' { 115 | declare module.exports: $Exports<'scheduler/umd/scheduler.development'>; 116 | } 117 | declare module 'scheduler/umd/scheduler.production.min.js' { 118 | declare module.exports: $Exports<'scheduler/umd/scheduler.production.min'>; 119 | } 120 | declare module 'scheduler/umd/scheduler.profiling.min.js' { 121 | declare module.exports: $Exports<'scheduler/umd/scheduler.profiling.min'>; 122 | } 123 | -------------------------------------------------------------------------------- /flow-typed/npm/semantic-release_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: f600a45c65664738da1d88a53bf8cea4 2 | // flow-typed version: <>/semantic-release_v^15.10.5/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'semantic-release' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'semantic-release' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'semantic-release/bin/semantic-release' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module 'semantic-release/cli' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module 'semantic-release/lib/definitions/constants' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module 'semantic-release/lib/definitions/errors' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module 'semantic-release/lib/definitions/plugins' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module 'semantic-release/lib/get-commits' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module 'semantic-release/lib/get-config' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module 'semantic-release/lib/get-error' { 54 | declare module.exports: any; 55 | } 56 | 57 | declare module 'semantic-release/lib/get-git-auth-url' { 58 | declare module.exports: any; 59 | } 60 | 61 | declare module 'semantic-release/lib/get-last-release' { 62 | declare module.exports: any; 63 | } 64 | 65 | declare module 'semantic-release/lib/get-logger' { 66 | declare module.exports: any; 67 | } 68 | 69 | declare module 'semantic-release/lib/get-next-version' { 70 | declare module.exports: any; 71 | } 72 | 73 | declare module 'semantic-release/lib/git' { 74 | declare module.exports: any; 75 | } 76 | 77 | declare module 'semantic-release/lib/hide-sensitive' { 78 | declare module.exports: any; 79 | } 80 | 81 | declare module 'semantic-release/lib/plugins/index' { 82 | declare module.exports: any; 83 | } 84 | 85 | declare module 'semantic-release/lib/plugins/normalize' { 86 | declare module.exports: any; 87 | } 88 | 89 | declare module 'semantic-release/lib/plugins/pipeline' { 90 | declare module.exports: any; 91 | } 92 | 93 | declare module 'semantic-release/lib/plugins/utils' { 94 | declare module.exports: any; 95 | } 96 | 97 | declare module 'semantic-release/lib/utils' { 98 | declare module.exports: any; 99 | } 100 | 101 | declare module 'semantic-release/lib/verify' { 102 | declare module.exports: any; 103 | } 104 | 105 | // Filename aliases 106 | declare module 'semantic-release/bin/semantic-release.js' { 107 | declare module.exports: $Exports<'semantic-release/bin/semantic-release'>; 108 | } 109 | declare module 'semantic-release/cli.js' { 110 | declare module.exports: $Exports<'semantic-release/cli'>; 111 | } 112 | declare module 'semantic-release/index' { 113 | declare module.exports: $Exports<'semantic-release'>; 114 | } 115 | declare module 'semantic-release/index.js' { 116 | declare module.exports: $Exports<'semantic-release'>; 117 | } 118 | declare module 'semantic-release/lib/definitions/constants.js' { 119 | declare module.exports: $Exports<'semantic-release/lib/definitions/constants'>; 120 | } 121 | declare module 'semantic-release/lib/definitions/errors.js' { 122 | declare module.exports: $Exports<'semantic-release/lib/definitions/errors'>; 123 | } 124 | declare module 'semantic-release/lib/definitions/plugins.js' { 125 | declare module.exports: $Exports<'semantic-release/lib/definitions/plugins'>; 126 | } 127 | declare module 'semantic-release/lib/get-commits.js' { 128 | declare module.exports: $Exports<'semantic-release/lib/get-commits'>; 129 | } 130 | declare module 'semantic-release/lib/get-config.js' { 131 | declare module.exports: $Exports<'semantic-release/lib/get-config'>; 132 | } 133 | declare module 'semantic-release/lib/get-error.js' { 134 | declare module.exports: $Exports<'semantic-release/lib/get-error'>; 135 | } 136 | declare module 'semantic-release/lib/get-git-auth-url.js' { 137 | declare module.exports: $Exports<'semantic-release/lib/get-git-auth-url'>; 138 | } 139 | declare module 'semantic-release/lib/get-last-release.js' { 140 | declare module.exports: $Exports<'semantic-release/lib/get-last-release'>; 141 | } 142 | declare module 'semantic-release/lib/get-logger.js' { 143 | declare module.exports: $Exports<'semantic-release/lib/get-logger'>; 144 | } 145 | declare module 'semantic-release/lib/get-next-version.js' { 146 | declare module.exports: $Exports<'semantic-release/lib/get-next-version'>; 147 | } 148 | declare module 'semantic-release/lib/git.js' { 149 | declare module.exports: $Exports<'semantic-release/lib/git'>; 150 | } 151 | declare module 'semantic-release/lib/hide-sensitive.js' { 152 | declare module.exports: $Exports<'semantic-release/lib/hide-sensitive'>; 153 | } 154 | declare module 'semantic-release/lib/plugins/index.js' { 155 | declare module.exports: $Exports<'semantic-release/lib/plugins/index'>; 156 | } 157 | declare module 'semantic-release/lib/plugins/normalize.js' { 158 | declare module.exports: $Exports<'semantic-release/lib/plugins/normalize'>; 159 | } 160 | declare module 'semantic-release/lib/plugins/pipeline.js' { 161 | declare module.exports: $Exports<'semantic-release/lib/plugins/pipeline'>; 162 | } 163 | declare module 'semantic-release/lib/plugins/utils.js' { 164 | declare module.exports: $Exports<'semantic-release/lib/plugins/utils'>; 165 | } 166 | declare module 'semantic-release/lib/utils.js' { 167 | declare module.exports: $Exports<'semantic-release/lib/utils'>; 168 | } 169 | declare module 'semantic-release/lib/verify.js' { 170 | declare module.exports: $Exports<'semantic-release/lib/verify'>; 171 | } 172 | -------------------------------------------------------------------------------- /flow-typed/npm/sinon_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: c458a1163dd4633a3ef31f812d309554 2 | // flow-typed version: <>/sinon_v^7.1.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'sinon' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'sinon' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'sinon/lib/sinon' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module 'sinon/lib/sinon/assert' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module 'sinon/lib/sinon/behavior' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module 'sinon/lib/sinon/blob' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module 'sinon/lib/sinon/call' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module 'sinon/lib/sinon/collect-own-methods' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module 'sinon/lib/sinon/color' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module 'sinon/lib/sinon/create-sandbox' { 54 | declare module.exports: any; 55 | } 56 | 57 | declare module 'sinon/lib/sinon/default-behaviors' { 58 | declare module.exports: any; 59 | } 60 | 61 | declare module 'sinon/lib/sinon/fake' { 62 | declare module.exports: any; 63 | } 64 | 65 | declare module 'sinon/lib/sinon/match' { 66 | declare module.exports: any; 67 | } 68 | 69 | declare module 'sinon/lib/sinon/mock-expectation' { 70 | declare module.exports: any; 71 | } 72 | 73 | declare module 'sinon/lib/sinon/mock' { 74 | declare module.exports: any; 75 | } 76 | 77 | declare module 'sinon/lib/sinon/sandbox' { 78 | declare module.exports: any; 79 | } 80 | 81 | declare module 'sinon/lib/sinon/spy-formatters' { 82 | declare module.exports: any; 83 | } 84 | 85 | declare module 'sinon/lib/sinon/spy' { 86 | declare module.exports: any; 87 | } 88 | 89 | declare module 'sinon/lib/sinon/stub-entire-object' { 90 | declare module.exports: any; 91 | } 92 | 93 | declare module 'sinon/lib/sinon/stub-non-function-property' { 94 | declare module.exports: any; 95 | } 96 | 97 | declare module 'sinon/lib/sinon/stub' { 98 | declare module.exports: any; 99 | } 100 | 101 | declare module 'sinon/lib/sinon/throw-on-falsy-object' { 102 | declare module.exports: any; 103 | } 104 | 105 | declare module 'sinon/lib/sinon/util/core/called-in-order' { 106 | declare module.exports: any; 107 | } 108 | 109 | declare module 'sinon/lib/sinon/util/core/deep-equal' { 110 | declare module.exports: any; 111 | } 112 | 113 | declare module 'sinon/lib/sinon/util/core/default-config' { 114 | declare module.exports: any; 115 | } 116 | 117 | declare module 'sinon/lib/sinon/util/core/deprecated' { 118 | declare module.exports: any; 119 | } 120 | 121 | declare module 'sinon/lib/sinon/util/core/every' { 122 | declare module.exports: any; 123 | } 124 | 125 | declare module 'sinon/lib/sinon/util/core/extend' { 126 | declare module.exports: any; 127 | } 128 | 129 | declare module 'sinon/lib/sinon/util/core/format' { 130 | declare module.exports: any; 131 | } 132 | 133 | declare module 'sinon/lib/sinon/util/core/function-to-string' { 134 | declare module.exports: any; 135 | } 136 | 137 | declare module 'sinon/lib/sinon/util/core/get-config' { 138 | declare module.exports: any; 139 | } 140 | 141 | declare module 'sinon/lib/sinon/util/core/get-next-tick' { 142 | declare module.exports: any; 143 | } 144 | 145 | declare module 'sinon/lib/sinon/util/core/get-property-descriptor' { 146 | declare module.exports: any; 147 | } 148 | 149 | declare module 'sinon/lib/sinon/util/core/is-es-module' { 150 | declare module.exports: any; 151 | } 152 | 153 | declare module 'sinon/lib/sinon/util/core/is-non-existent-own-property' { 154 | declare module.exports: any; 155 | } 156 | 157 | declare module 'sinon/lib/sinon/util/core/is-property-configurable' { 158 | declare module.exports: any; 159 | } 160 | 161 | declare module 'sinon/lib/sinon/util/core/is-restorable' { 162 | declare module.exports: any; 163 | } 164 | 165 | declare module 'sinon/lib/sinon/util/core/iterable-to-string' { 166 | declare module.exports: any; 167 | } 168 | 169 | declare module 'sinon/lib/sinon/util/core/next-tick' { 170 | declare module.exports: any; 171 | } 172 | 173 | declare module 'sinon/lib/sinon/util/core/order-by-first-call' { 174 | declare module.exports: any; 175 | } 176 | 177 | declare module 'sinon/lib/sinon/util/core/restore' { 178 | declare module.exports: any; 179 | } 180 | 181 | declare module 'sinon/lib/sinon/util/core/times-in-words' { 182 | declare module.exports: any; 183 | } 184 | 185 | declare module 'sinon/lib/sinon/util/core/typeOf' { 186 | declare module.exports: any; 187 | } 188 | 189 | declare module 'sinon/lib/sinon/util/core/use-promise-library' { 190 | declare module.exports: any; 191 | } 192 | 193 | declare module 'sinon/lib/sinon/util/core/walk' { 194 | declare module.exports: any; 195 | } 196 | 197 | declare module 'sinon/lib/sinon/util/core/wrap-method' { 198 | declare module.exports: any; 199 | } 200 | 201 | declare module 'sinon/lib/sinon/util/fake-timers' { 202 | declare module.exports: any; 203 | } 204 | 205 | declare module 'sinon/pkg/sinon-esm' { 206 | declare module.exports: any; 207 | } 208 | 209 | declare module 'sinon/pkg/sinon-no-sourcemaps' { 210 | declare module.exports: any; 211 | } 212 | 213 | declare module 'sinon/pkg/sinon' { 214 | declare module.exports: any; 215 | } 216 | 217 | // Filename aliases 218 | declare module 'sinon/lib/sinon.js' { 219 | declare module.exports: $Exports<'sinon/lib/sinon'>; 220 | } 221 | declare module 'sinon/lib/sinon/assert.js' { 222 | declare module.exports: $Exports<'sinon/lib/sinon/assert'>; 223 | } 224 | declare module 'sinon/lib/sinon/behavior.js' { 225 | declare module.exports: $Exports<'sinon/lib/sinon/behavior'>; 226 | } 227 | declare module 'sinon/lib/sinon/blob.js' { 228 | declare module.exports: $Exports<'sinon/lib/sinon/blob'>; 229 | } 230 | declare module 'sinon/lib/sinon/call.js' { 231 | declare module.exports: $Exports<'sinon/lib/sinon/call'>; 232 | } 233 | declare module 'sinon/lib/sinon/collect-own-methods.js' { 234 | declare module.exports: $Exports<'sinon/lib/sinon/collect-own-methods'>; 235 | } 236 | declare module 'sinon/lib/sinon/color.js' { 237 | declare module.exports: $Exports<'sinon/lib/sinon/color'>; 238 | } 239 | declare module 'sinon/lib/sinon/create-sandbox.js' { 240 | declare module.exports: $Exports<'sinon/lib/sinon/create-sandbox'>; 241 | } 242 | declare module 'sinon/lib/sinon/default-behaviors.js' { 243 | declare module.exports: $Exports<'sinon/lib/sinon/default-behaviors'>; 244 | } 245 | declare module 'sinon/lib/sinon/fake.js' { 246 | declare module.exports: $Exports<'sinon/lib/sinon/fake'>; 247 | } 248 | declare module 'sinon/lib/sinon/match.js' { 249 | declare module.exports: $Exports<'sinon/lib/sinon/match'>; 250 | } 251 | declare module 'sinon/lib/sinon/mock-expectation.js' { 252 | declare module.exports: $Exports<'sinon/lib/sinon/mock-expectation'>; 253 | } 254 | declare module 'sinon/lib/sinon/mock.js' { 255 | declare module.exports: $Exports<'sinon/lib/sinon/mock'>; 256 | } 257 | declare module 'sinon/lib/sinon/sandbox.js' { 258 | declare module.exports: $Exports<'sinon/lib/sinon/sandbox'>; 259 | } 260 | declare module 'sinon/lib/sinon/spy-formatters.js' { 261 | declare module.exports: $Exports<'sinon/lib/sinon/spy-formatters'>; 262 | } 263 | declare module 'sinon/lib/sinon/spy.js' { 264 | declare module.exports: $Exports<'sinon/lib/sinon/spy'>; 265 | } 266 | declare module 'sinon/lib/sinon/stub-entire-object.js' { 267 | declare module.exports: $Exports<'sinon/lib/sinon/stub-entire-object'>; 268 | } 269 | declare module 'sinon/lib/sinon/stub-non-function-property.js' { 270 | declare module.exports: $Exports<'sinon/lib/sinon/stub-non-function-property'>; 271 | } 272 | declare module 'sinon/lib/sinon/stub.js' { 273 | declare module.exports: $Exports<'sinon/lib/sinon/stub'>; 274 | } 275 | declare module 'sinon/lib/sinon/throw-on-falsy-object.js' { 276 | declare module.exports: $Exports<'sinon/lib/sinon/throw-on-falsy-object'>; 277 | } 278 | declare module 'sinon/lib/sinon/util/core/called-in-order.js' { 279 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/called-in-order'>; 280 | } 281 | declare module 'sinon/lib/sinon/util/core/deep-equal.js' { 282 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/deep-equal'>; 283 | } 284 | declare module 'sinon/lib/sinon/util/core/default-config.js' { 285 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/default-config'>; 286 | } 287 | declare module 'sinon/lib/sinon/util/core/deprecated.js' { 288 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/deprecated'>; 289 | } 290 | declare module 'sinon/lib/sinon/util/core/every.js' { 291 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/every'>; 292 | } 293 | declare module 'sinon/lib/sinon/util/core/extend.js' { 294 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/extend'>; 295 | } 296 | declare module 'sinon/lib/sinon/util/core/format.js' { 297 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/format'>; 298 | } 299 | declare module 'sinon/lib/sinon/util/core/function-to-string.js' { 300 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/function-to-string'>; 301 | } 302 | declare module 'sinon/lib/sinon/util/core/get-config.js' { 303 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/get-config'>; 304 | } 305 | declare module 'sinon/lib/sinon/util/core/get-next-tick.js' { 306 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/get-next-tick'>; 307 | } 308 | declare module 'sinon/lib/sinon/util/core/get-property-descriptor.js' { 309 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/get-property-descriptor'>; 310 | } 311 | declare module 'sinon/lib/sinon/util/core/is-es-module.js' { 312 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/is-es-module'>; 313 | } 314 | declare module 'sinon/lib/sinon/util/core/is-non-existent-own-property.js' { 315 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/is-non-existent-own-property'>; 316 | } 317 | declare module 'sinon/lib/sinon/util/core/is-property-configurable.js' { 318 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/is-property-configurable'>; 319 | } 320 | declare module 'sinon/lib/sinon/util/core/is-restorable.js' { 321 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/is-restorable'>; 322 | } 323 | declare module 'sinon/lib/sinon/util/core/iterable-to-string.js' { 324 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/iterable-to-string'>; 325 | } 326 | declare module 'sinon/lib/sinon/util/core/next-tick.js' { 327 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/next-tick'>; 328 | } 329 | declare module 'sinon/lib/sinon/util/core/order-by-first-call.js' { 330 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/order-by-first-call'>; 331 | } 332 | declare module 'sinon/lib/sinon/util/core/restore.js' { 333 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/restore'>; 334 | } 335 | declare module 'sinon/lib/sinon/util/core/times-in-words.js' { 336 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/times-in-words'>; 337 | } 338 | declare module 'sinon/lib/sinon/util/core/typeOf.js' { 339 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/typeOf'>; 340 | } 341 | declare module 'sinon/lib/sinon/util/core/use-promise-library.js' { 342 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/use-promise-library'>; 343 | } 344 | declare module 'sinon/lib/sinon/util/core/walk.js' { 345 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/walk'>; 346 | } 347 | declare module 'sinon/lib/sinon/util/core/wrap-method.js' { 348 | declare module.exports: $Exports<'sinon/lib/sinon/util/core/wrap-method'>; 349 | } 350 | declare module 'sinon/lib/sinon/util/fake-timers.js' { 351 | declare module.exports: $Exports<'sinon/lib/sinon/util/fake-timers'>; 352 | } 353 | declare module 'sinon/pkg/sinon-esm.js' { 354 | declare module.exports: $Exports<'sinon/pkg/sinon-esm'>; 355 | } 356 | declare module 'sinon/pkg/sinon-no-sourcemaps.js' { 357 | declare module.exports: $Exports<'sinon/pkg/sinon-no-sourcemaps'>; 358 | } 359 | declare module 'sinon/pkg/sinon.js' { 360 | declare module.exports: $Exports<'sinon/pkg/sinon'>; 361 | } 362 | -------------------------------------------------------------------------------- /flow-typed/npm/travis-deploy-once_vx.x.x.js: -------------------------------------------------------------------------------- 1 | // flow-typed signature: 6e430cf8d7f3b814e024f972f358db41 2 | // flow-typed version: <>/travis-deploy-once_v^5.0.0/flow_v0.84.0 3 | 4 | /** 5 | * This is an autogenerated libdef stub for: 6 | * 7 | * 'travis-deploy-once' 8 | * 9 | * Fill this stub out by replacing all the `any` types. 10 | * 11 | * Once filled out, we encourage you to share your work with the 12 | * community by sending a pull request to: 13 | * https://github.com/flowtype/flow-typed 14 | */ 15 | 16 | declare module 'travis-deploy-once' { 17 | declare module.exports: any; 18 | } 19 | 20 | /** 21 | * We include stubs for each file inside this npm package in case you need to 22 | * require those files directly. Feel free to delete any files that aren't 23 | * needed. 24 | */ 25 | declare module 'travis-deploy-once/babel-register' { 26 | declare module.exports: any; 27 | } 28 | 29 | declare module 'travis-deploy-once/bin/travis-deploy-once' { 30 | declare module.exports: any; 31 | } 32 | 33 | declare module 'travis-deploy-once/cli' { 34 | declare module.exports: any; 35 | } 36 | 37 | declare module 'travis-deploy-once/lib/elect-build-leader' { 38 | declare module.exports: any; 39 | } 40 | 41 | declare module 'travis-deploy-once/lib/get-jobs' { 42 | declare module.exports: any; 43 | } 44 | 45 | declare module 'travis-deploy-once/lib/get-logger' { 46 | declare module.exports: any; 47 | } 48 | 49 | declare module 'travis-deploy-once/lib/get-token' { 50 | declare module.exports: any; 51 | } 52 | 53 | declare module 'travis-deploy-once/lib/get-travis-url' { 54 | declare module.exports: any; 55 | } 56 | 57 | declare module 'travis-deploy-once/lib/travis-deploy-once' { 58 | declare module.exports: any; 59 | } 60 | 61 | declare module 'travis-deploy-once/lib/validate' { 62 | declare module.exports: any; 63 | } 64 | 65 | declare module 'travis-deploy-once/lib/verify-jobs-state' { 66 | declare module.exports: any; 67 | } 68 | 69 | declare module 'travis-deploy-once/lib/wait-for-other-jobs' { 70 | declare module.exports: any; 71 | } 72 | 73 | // Filename aliases 74 | declare module 'travis-deploy-once/babel-register.js' { 75 | declare module.exports: $Exports<'travis-deploy-once/babel-register'>; 76 | } 77 | declare module 'travis-deploy-once/bin/travis-deploy-once.js' { 78 | declare module.exports: $Exports<'travis-deploy-once/bin/travis-deploy-once'>; 79 | } 80 | declare module 'travis-deploy-once/cli.js' { 81 | declare module.exports: $Exports<'travis-deploy-once/cli'>; 82 | } 83 | declare module 'travis-deploy-once/index' { 84 | declare module.exports: $Exports<'travis-deploy-once'>; 85 | } 86 | declare module 'travis-deploy-once/index.js' { 87 | declare module.exports: $Exports<'travis-deploy-once'>; 88 | } 89 | declare module 'travis-deploy-once/lib/elect-build-leader.js' { 90 | declare module.exports: $Exports<'travis-deploy-once/lib/elect-build-leader'>; 91 | } 92 | declare module 'travis-deploy-once/lib/get-jobs.js' { 93 | declare module.exports: $Exports<'travis-deploy-once/lib/get-jobs'>; 94 | } 95 | declare module 'travis-deploy-once/lib/get-logger.js' { 96 | declare module.exports: $Exports<'travis-deploy-once/lib/get-logger'>; 97 | } 98 | declare module 'travis-deploy-once/lib/get-token.js' { 99 | declare module.exports: $Exports<'travis-deploy-once/lib/get-token'>; 100 | } 101 | declare module 'travis-deploy-once/lib/get-travis-url.js' { 102 | declare module.exports: $Exports<'travis-deploy-once/lib/get-travis-url'>; 103 | } 104 | declare module 'travis-deploy-once/lib/travis-deploy-once.js' { 105 | declare module.exports: $Exports<'travis-deploy-once/lib/travis-deploy-once'>; 106 | } 107 | declare module 'travis-deploy-once/lib/validate.js' { 108 | declare module.exports: $Exports<'travis-deploy-once/lib/validate'>; 109 | } 110 | declare module 'travis-deploy-once/lib/verify-jobs-state.js' { 111 | declare module.exports: $Exports<'travis-deploy-once/lib/verify-jobs-state'>; 112 | } 113 | declare module 'travis-deploy-once/lib/wait-for-other-jobs.js' { 114 | declare module.exports: $Exports<'travis-deploy-once/lib/wait-for-other-jobs'>; 115 | } 116 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "react-paper-bindings", 3 | "description": "Paper.js bindings for React", 4 | "author": "Bojan Hribernik ", 5 | "license": "MIT", 6 | "homepage": "https://github.com/react-paper/react-paper-bindings", 7 | "repository": { 8 | "type": "git", 9 | "url": "https://github.com/react-paper/react-paper-bindings.git" 10 | }, 11 | "bugs": { 12 | "url": "https://github.com/react-paper/react-paper-bindings/issues" 13 | }, 14 | "files": [ 15 | "lib" 16 | ], 17 | "main": "lib/index.js", 18 | "scripts": { 19 | "start": "NODE_ENV=development babel src -w -d lib", 20 | "build:lib": "NODE_ENV=production babel src -d lib", 21 | "build:flow": "NODE_ENV=production flow-copy-source -v src lib", 22 | "build": "yarn build:lib && yarn build:flow", 23 | "lint": "NODE_ENV=development eslint src/**", 24 | "format": "prettier --trailing-comma es5 --no-semi --single-quote --write \"src/**/*.js\"", 25 | "test": "jest --env=jsdom", 26 | "prepublish": "yarn build", 27 | "semantic-release": "semantic-release", 28 | "travis-deploy-once": "travis-deploy-once" 29 | }, 30 | "dependencies": { 31 | "fbjs": "^1.0.0", 32 | "paper": "^0.11.8", 33 | "react": "^16.6.0", 34 | "react-dom": "^16.6.0", 35 | "react-reconciler": "^0.16.0", 36 | "scheduler": "^0.10.0" 37 | }, 38 | "devDependencies": { 39 | "@babel/cli": "^7.1.2", 40 | "@babel/core": "^7.1.2", 41 | "@babel/plugin-proposal-class-properties": "^7.1.0", 42 | "@babel/plugin-proposal-object-rest-spread": "^7.0.0", 43 | "@babel/preset-env": "^7.1.0", 44 | "@babel/preset-flow": "^7.0.0", 45 | "@babel/preset-react": "^7.0.0", 46 | "babel-core": "7.0.0-bridge.0", 47 | "babel-eslint": "=9.0.0", 48 | "babel-jest": "^23.6.0", 49 | "canvas": "^1.3.5", 50 | "enzyme": "^3.7.0", 51 | "enzyme-adapter-react-16": "^1.6.0", 52 | "eslint": "=5.6.0", 53 | "eslint-plugin-flowtype": "^3.0.0", 54 | "eslint-plugin-import": "^2.12.0", 55 | "eslint-plugin-jsx-a11y": "^6.1.2", 56 | "eslint-plugin-react": "^7.8.2", 57 | "flow-bin": "^0.84.0", 58 | "flow-copy-source": "^2.0.2", 59 | "jest": "^23.6.0", 60 | "jsdom": "^9.4.0", 61 | "prettier": "^1.13.3", 62 | "semantic-release": "^15.10.5", 63 | "sinon": "^7.1.0", 64 | "travis-deploy-once": "^5.0.0" 65 | }, 66 | "jest": { 67 | "setupTestFrameworkScriptFile": "/test/setup.js", 68 | "testMatch": [ 69 | "/src/**/__tests__/**/*.{js,jsx,mjs}", 70 | "/src/**/?(*.)(spec|test).{js,jsx,mjs}", 71 | "/test/**/?(*.)(spec|test).{js,jsx,mjs}" 72 | ], 73 | "testEnvironment": "node", 74 | "testURL": "http://localhost", 75 | "transform": { 76 | "^.+\\.(js|jsx|mjs)$": "/node_modules/babel-jest" 77 | }, 78 | "transformIgnorePatterns": [ 79 | "[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs)$" 80 | ], 81 | "testPathIgnorePatterns": [ 82 | "[/\\\\](__test|__test2|demo|node_modules)[/\\\\]" 83 | ], 84 | "modulePathIgnorePatterns": [ 85 | "[/\\\\](__test|__test2|demo|node_modules)[/\\\\]" 86 | ], 87 | "moduleDirectories": [ 88 | "/node_modules", 89 | "/src" 90 | ] 91 | }, 92 | "eslintConfig": { 93 | "extends": [ 94 | "eslint:recommended", 95 | "plugin:react/recommended" 96 | ], 97 | "parser": "babel-eslint", 98 | "settings": { 99 | "react": { 100 | "createClass": "createReactClass", 101 | "pragma": "React", 102 | "version": "16.6.0", 103 | "flowVersion": "0.84.0" 104 | } 105 | }, 106 | "env": { 107 | "browser": true, 108 | "node": true, 109 | "jest": true, 110 | "es6": true 111 | }, 112 | "rules": { 113 | "semi": 0, 114 | "strict": 0, 115 | "no-console": 0, 116 | "no-unused-vars": [ 117 | "warn", 118 | { 119 | "args": "none", 120 | "ignoreRestSiblings": true 121 | } 122 | ] 123 | } 124 | }, 125 | "eslintIgnore": [ 126 | "/node_modules/" 127 | ] 128 | } 129 | -------------------------------------------------------------------------------- /src/PaperRenderer.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | import Reconciler from 'react-reconciler' 4 | import { 5 | unstable_now as now, 6 | unstable_scheduleCallback as scheduleDeferredCallback, 7 | unstable_cancelCallback as cancelDeferredCallback, 8 | } from 'scheduler'; 9 | import invariant from 'fbjs/lib/invariant' 10 | import emptyObject from 'fbjs/lib/emptyObject' 11 | 12 | import { 13 | Group, 14 | Item, 15 | Layer, 16 | Path, 17 | PointText, 18 | Raster, 19 | Tool, 20 | } from 'paper/dist/paper-core' 21 | 22 | import TYPES from './types' 23 | 24 | import { arePointsEqual } from './utils' 25 | 26 | function applyItemProps(instance, props, prevProps = {}) { 27 | if (props.blendMode !== prevProps.blendMode) { 28 | instance.blendMode = props.blendMode 29 | } 30 | if (props.clipMask !== prevProps.clipMask) { 31 | instance.clipMask = props.clipMask 32 | } 33 | if (props.opacity !== prevProps.opacity) { 34 | instance.opacity = props.opacity 35 | } 36 | if (props.rotation !== prevProps.rotation) { 37 | instance.rotation = props.rotation; 38 | } 39 | if (props.selected !== prevProps.selected) { 40 | instance.selected = props.selected 41 | } 42 | if (props.visible !== prevProps.visible) { 43 | instance.visible = props.visible 44 | } 45 | } 46 | 47 | function applyStyleProps(instance, props) { 48 | if (props.fillColor) { 49 | instance.fillColor = props.fillColor 50 | } 51 | if (props.strokeColor) { 52 | instance.strokeColor = props.strokeColor 53 | } 54 | if (props.selected) { 55 | instance.selected = props.selected 56 | } 57 | } 58 | 59 | function applyGroupProps(instance, props, prevProps = {}) { 60 | applyItemProps(instance, props, prevProps) 61 | if (!arePointsEqual(props.center, prevProps.center)) { 62 | instance.translate([ 63 | props.center[0] - prevProps.center[0], 64 | props.center[1] - prevProps.center[1], 65 | ]) 66 | } 67 | if (!arePointsEqual(props.pivot, prevProps.pivot)) { 68 | instance.pivot = props.pivot 69 | } 70 | if (!arePointsEqual(props.position, prevProps.position)) { 71 | instance.position = props.position 72 | } 73 | if (props.rotation !== prevProps.rotation) { 74 | // in case null is set 75 | const rotation = props.rotation ? props.rotation : 0 76 | const prevRotation = prevProps.rotation ? prevProps.rotation : 0 77 | instance.rotate(rotation - prevRotation) 78 | } 79 | // TODO: check if this is ok 80 | if (props.strokeColor !== prevProps.strokeColor) { 81 | instance.strokeColor = props.strokeColor 82 | } 83 | if (props.fillColor !== prevProps.fillColor) { 84 | instance.fillColor = props.fillColor 85 | } 86 | } 87 | 88 | function applyLayerProps(instance, props, prevProps = {}) { 89 | applyItemProps(instance, props, prevProps) 90 | if (props.active !== prevProps.active && props.active === true) { 91 | instance.activate() 92 | } 93 | if (props.locked !== prevProps.locked) { 94 | instance.locked = props.locked 95 | } 96 | // TODO: check if this is ok 97 | if (props.strokeColor !== prevProps.strokeColor) { 98 | instance.strokeColor = props.strokeColor 99 | instance.children.forEach(child => { 100 | if (child instanceof Path) { 101 | child.strokeColor = props.strokeColor 102 | } 103 | }) 104 | } 105 | if (props.fillColor !== prevProps.fillColor) { 106 | instance.fillColor = props.fillColor 107 | } 108 | } 109 | 110 | function applyPathProps(instance, props, prevProps = {}) { 111 | applyItemProps(instance, props, prevProps) 112 | if (!arePointsEqual(props.center, prevProps.center)) { 113 | instance.translate([ 114 | props.center[0] - prevProps.center[0], 115 | props.center[1] - prevProps.center[1], 116 | ]) 117 | } 118 | if (!arePointsEqual(props.pivot, prevProps.pivot)) { 119 | instance.pivot = props.pivot 120 | instance.position = props.position 121 | } 122 | if (!arePointsEqual(props.position, prevProps.position)) { 123 | instance.position = props.position 124 | } 125 | if (props.closed !== prevProps.closed) { 126 | instance.closed = props.closed 127 | } 128 | if (props.dashArray !== prevProps.dashArray) { 129 | instance.dashArray = props.dashArray 130 | } 131 | if (props.dashOffset !== prevProps.dashOffset) { 132 | instance.dashOffset = props.dashOffset 133 | } 134 | if (props.fillColor !== prevProps.fillColor) { 135 | instance.fillColor = props.fillColor 136 | } 137 | if (props.pathData !== prevProps.pathData) { 138 | instance.pathData = props.pathData 139 | } 140 | if (!arePointsEqual(props.point, prevProps.point)) { 141 | instance.translate([ 142 | props.point[0] - prevProps.point[0], 143 | props.point[1] - prevProps.point[1], 144 | ]) 145 | } 146 | if (props.rotation !== prevProps.rotation) { 147 | // in case null is set 148 | const rotation = props.rotation ? props.rotation : 0 149 | const prevRotation = prevProps.rotation ? prevProps.rotation : 0 150 | instance.rotate(rotation - prevRotation) 151 | } 152 | if (props.strokeCap !== prevProps.strokeCap) { 153 | instance.strokeCap = props.strokeCap 154 | } 155 | if (props.strokeColor !== prevProps.strokeColor) { 156 | instance.strokeColor = props.strokeColor 157 | } 158 | if (props.strokeJoin !== prevProps.strokeJoin) { 159 | instance.strokeJoin = props.strokeJoin 160 | } 161 | if (props.strokeScaling !== prevProps.strokeScaling) { 162 | instance.strokeScaling = props.strokeScaling 163 | } 164 | if (props.strokeWidth !== prevProps.strokeWidth) { 165 | instance.strokeWidth = props.strokeWidth 166 | } 167 | } 168 | 169 | function applyRectangleProps(instance, props, prevProps = {}) { 170 | applyPathProps(instance, props, prevProps) 171 | if (!arePointsEqual(props.size, prevProps.size)) { 172 | instance.scale( 173 | props.size[0] / prevProps.size[0], 174 | props.size[1] / prevProps.size[1] 175 | ) 176 | } 177 | } 178 | 179 | function applyCircleProps(instance, props, prevProps = {}) { 180 | applyPathProps(instance, props, prevProps) 181 | if (props.radius !== prevProps.radius) { 182 | instance.scale(props.radius / prevProps.radius) 183 | } 184 | } 185 | 186 | function applyEllipseProps(instance, props, prevProps = {}) { 187 | applyRectangleProps(instance, props, prevProps) 188 | } 189 | 190 | function applyArcProps(instance, props, prevProps = {}) { 191 | applyPathProps(instance, props, prevProps) 192 | if (!arePointsEqual(props.from, prevProps.from)) { 193 | instance.from = props.from 194 | } 195 | if (!arePointsEqual(props.to, prevProps.to)) { 196 | instance.to = props.to 197 | } 198 | if (!arePointsEqual(props.through, prevProps.through)) { 199 | instance.through = props.through 200 | } 201 | } 202 | 203 | function applyRasterProps(instance, props, prevProps = {}) { 204 | applyItemProps(instance, props, prevProps) 205 | if (props.source !== prevProps.source) { 206 | instance.source = props.source 207 | } 208 | if (props.onLoad !== prevProps.onLoad) { 209 | instance.onLoad = props.onLoad 210 | } 211 | } 212 | 213 | function applyPointTextProps(instance, props, prevProps = {}) { 214 | applyItemProps(instance, props, prevProps) 215 | if (props.content !== prevProps.content) { 216 | instance.content = props.content 217 | } 218 | if (props.fillColor !== prevProps.fillColor) { 219 | instance.fillColor = props.fillColor 220 | } 221 | if (props.fontFamily !== prevProps.fontFamily) { 222 | instance.fontFamily = props.fontFamily 223 | } 224 | if (props.fontSize !== prevProps.fontSize) { 225 | instance.fontSize = props.fontSize 226 | } 227 | if (props.fontWeight !== prevProps.fontWeight) { 228 | instance.fontWeight = props.fontWeight 229 | } 230 | if (!arePointsEqual(props.point, prevProps.point)) { 231 | instance.translate([ 232 | props.point[0] - prevProps.point[0], 233 | props.point[1] - prevProps.point[1], 234 | ]) 235 | } 236 | } 237 | 238 | function applyToolProps(instance, props, prevProps = {}) { 239 | if (props.active !== prevProps.active && props.active === true) { 240 | instance.activate() 241 | } 242 | if (props.onMouseDown !== prevProps.onMouseDown) { 243 | instance.onMouseDown = props.onMouseDown 244 | } 245 | if (props.onMouseDrag !== prevProps.onMouseDrag) { 246 | instance.onMouseDrag = props.onMouseDrag 247 | } 248 | if (props.onMouseMove !== prevProps.onMouseMove) { 249 | instance.onMouseMove = props.onMouseMove 250 | } 251 | if (props.onMouseUp !== prevProps.onMouseUp) { 252 | instance.onMouseUp = props.onMouseUp 253 | } 254 | if (props.onKeyUp !== prevProps.onKeyUp) { 255 | instance.onKeyUp = props.onKeyUp 256 | } 257 | if (props.onKeyDown !== prevProps.onKeyDown) { 258 | instance.onKeyDown = props.onKeyDown 259 | } 260 | } 261 | 262 | const PaperRenderer = Reconciler({ 263 | appendInitialChild(parentInstance, child) { 264 | if (typeof child === 'string') { 265 | // Noop for string children of Text (eg {'foo'}{'bar'}) 266 | invariant(false, 'Text children should already be flattened.') 267 | } else if (parentInstance instanceof Group && child instanceof Item) { 268 | child.addTo(parentInstance) 269 | } 270 | }, 271 | 272 | createInstance(type, props, paperScope) { 273 | const { children, ...paperProps } = props 274 | let instance = {} 275 | 276 | switch (type) { 277 | case TYPES.TOOL: 278 | instance = new Tool(paperProps) 279 | instance._applyProps = applyToolProps 280 | break 281 | case TYPES.CIRCLE: 282 | instance = new Path.Circle(paperProps) 283 | instance._applyProps = applyCircleProps 284 | break 285 | case TYPES.ELLIPSE: 286 | instance = new Path.Ellipse(paperProps) 287 | instance._applyProps = applyEllipseProps 288 | break 289 | case TYPES.GROUP: 290 | instance = new Group(paperProps) 291 | instance._applyProps = applyGroupProps 292 | break 293 | case TYPES.LAYER: 294 | instance = new Layer(paperProps) 295 | instance._applyProps = applyLayerProps 296 | break 297 | case TYPES.LINE: 298 | instance = new Path.Line(paperProps) 299 | instance._applyProps = applyPathProps 300 | break 301 | case TYPES.PATH: 302 | instance = new Path(paperProps) 303 | instance._applyProps = applyPathProps 304 | break 305 | case TYPES.POINTTEXT: 306 | instance = new PointText(paperProps) 307 | instance._applyProps = applyPointTextProps 308 | break 309 | case TYPES.RECTANGLE: 310 | instance = new Path.Rectangle(paperProps) 311 | instance._applyProps = applyRectangleProps 312 | break 313 | case TYPES.ARC: 314 | instance = new Path.Arc(paperProps) 315 | instance._applyProps = applyArcProps 316 | break 317 | case TYPES.RASTER: { 318 | const { onLoad, ...rasterProps } = paperProps 319 | instance = new Raster(rasterProps) 320 | instance._applyProps = applyRasterProps 321 | if (typeof onLoad === 'function') { 322 | instance.onLoad = () => onLoad(instance) 323 | } 324 | break 325 | } 326 | default: 327 | invariant( 328 | instance, 329 | 'PaperRenderer does not support the type "%s"', 330 | type 331 | ) 332 | break 333 | } 334 | 335 | // apply data type 336 | if (!instance.data) { 337 | instance.data = { type } 338 | } else if (!instance.data.type) { 339 | instance.data.type = type 340 | } 341 | 342 | invariant(instance, 'PaperRenderer does not support the type "%s"', type) 343 | 344 | return instance 345 | }, 346 | 347 | createTextInstance(text, rootContainerInstance, paperScope) { 348 | return text 349 | }, 350 | 351 | finalizeInitialChildren(domElement, type, props) { 352 | // If applyMatrix=true, group props should be applied after all children have benn added. 353 | // If applyMatrix=false, only style-related props (ex. fillColor, strokeColor) should be applied. 354 | // TODO: add case for Layer 355 | switch (type) { 356 | case TYPES.GROUP: 357 | if (domElement.applyMatrix) { 358 | applyGroupProps(domElement, props) 359 | } else { 360 | applyStyleProps(domElement, props) 361 | } 362 | break 363 | default: 364 | break; 365 | } 366 | return false 367 | }, 368 | 369 | getPublicInstance(instance) { 370 | return instance 371 | }, 372 | 373 | prepareForCommit() { 374 | // Noop 375 | }, 376 | 377 | prepareUpdate(domElement, type, oldProps, newProps) { 378 | return true 379 | }, 380 | 381 | resetAfterCommit() { 382 | // Noop 383 | }, 384 | 385 | resetTextContent(domElement) { 386 | // Noop 387 | }, 388 | 389 | shouldDeprioritizeSubtree(type, props) { 390 | return false 391 | }, 392 | 393 | getRootHostContext() { 394 | return emptyObject 395 | }, 396 | 397 | getChildHostContext() { 398 | return emptyObject 399 | }, 400 | 401 | isPrimaryRenderer: false, 402 | supportsMutation: true, 403 | supportsHydration: false, 404 | supportsPersistence: false, 405 | //useSyncScheduling: true, 406 | 407 | scheduleTimeout: setTimeout, 408 | cancelTimeout: clearTimeout, 409 | noTimeout: -1, 410 | 411 | now, 412 | scheduleDeferredCallback, 413 | cancelDeferredCallback, 414 | 415 | shouldSetTextContent(type, props) { 416 | return ( 417 | typeof props.children === 'string' || typeof props.children === 'number' 418 | ) 419 | }, 420 | 421 | appendChild(parentInstance, child) { 422 | if (child.parentNode === parentInstance) { 423 | child.remove() 424 | } 425 | if (parentInstance instanceof Group && child instanceof Item) { 426 | child.addTo(parentInstance) 427 | } 428 | }, 429 | 430 | appendChildToContainer(parentInstance, child) { 431 | if (child.parentNode === parentInstance) { 432 | child.remove() 433 | } 434 | if (parentInstance instanceof Group && child instanceof Item) { 435 | child.addTo(parentInstance) 436 | } 437 | }, 438 | 439 | insertBefore(parentInstance, child, beforeChild) { 440 | invariant( 441 | child !== beforeChild, 442 | 'PaperRenderer: Can not insert node before itself' 443 | ) 444 | if ( 445 | parentInstance instanceof Group && 446 | child instanceof Path && 447 | beforeChild instanceof Path 448 | ) { 449 | child.insertAbove(beforeChild) 450 | } 451 | }, 452 | 453 | insertInContainerBefore(parentInstance, child, beforeChild) { 454 | invariant( 455 | child !== beforeChild, 456 | 'PaperRenderer: Can not insert node before itself' 457 | ) 458 | if ( 459 | parentInstance instanceof Group && 460 | child instanceof Path && 461 | beforeChild instanceof Path 462 | ) { 463 | child.insertAbove(beforeChild) 464 | } 465 | }, 466 | 467 | removeChild(parentInstance, child) { 468 | child.remove() 469 | }, 470 | 471 | removeChildFromContainer(parentInstance, child) { 472 | child.remove() 473 | }, 474 | 475 | commitTextUpdate(textInstance, oldText, newText) { 476 | // Noop 477 | }, 478 | 479 | commitMount(instance, type, newProps) { 480 | // Noop 481 | }, 482 | 483 | commitUpdate(instance, updatePayload, type, oldProps, newProps, paperScope) { 484 | instance._applyProps(instance, newProps, oldProps) 485 | }, 486 | }) 487 | 488 | export default PaperRenderer 489 | -------------------------------------------------------------------------------- /src/View.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | import React, { Component } from 'react' 4 | import { PaperScope, Size } from 'paper/dist/paper-core' 5 | 6 | import PaperRenderer from './PaperRenderer' 7 | 8 | import type { Node } from 'react' 9 | import type { FiberRoot } from 'react-reconciler' 10 | 11 | type Props = { 12 | children?: Node, 13 | width: number, 14 | height: number, 15 | settings?: Object, 16 | } 17 | 18 | export default class View extends Component { 19 | canvas: { current: HTMLCanvasElement | null } 20 | scope: typeof PaperScope 21 | mountNode: FiberRoot 22 | 23 | constructor(props: Props) { 24 | super(props) 25 | this.canvas = React.createRef() 26 | } 27 | 28 | componentDidMount() { 29 | const { children, width, height, settings } = this.props 30 | 31 | this.scope = new PaperScope() 32 | this.scope.setup(this.canvas.current) 33 | 34 | if (settings) { 35 | for (let key of Object.keys(settings)) { 36 | this.scope.settings[key] = settings[key] 37 | } 38 | } 39 | 40 | this.scope.view.viewSize = new Size(width, height) 41 | 42 | this.mountNode = PaperRenderer.createContainer(this.scope) 43 | 44 | PaperRenderer.updateContainer(children, this.mountNode, this) 45 | } 46 | 47 | componentDidUpdate(prevProps: Props) { 48 | const { children, width, height } = this.props 49 | const { view } = this.scope 50 | 51 | PaperRenderer.updateContainer(children, this.mountNode, this) 52 | 53 | if (width !== prevProps.width || height !== prevProps.height) { 54 | const prevCenter = view.center 55 | view.viewSize = new Size(width, height) 56 | view.translate(view.center.subtract(prevCenter)) 57 | } 58 | } 59 | 60 | componentWillUnmount() { 61 | PaperRenderer.updateContainer(null, this.mountNode, this) 62 | } 63 | 64 | render() { 65 | const { children, width, height, ...other } = this.props 66 | return 67 | } 68 | } 69 | 70 | PaperRenderer.injectIntoDevTools({ 71 | findFiberByHostInstance: () => null, 72 | bundleType: process.env.NODE_ENV === 'production' ? 0 : 1, 73 | rendererPackageName: 'react-paper-bindings', 74 | version: '2.0.0', 75 | }) 76 | -------------------------------------------------------------------------------- /src/index.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | import TYPES from './types' 4 | 5 | const { 6 | CIRCLE, 7 | ELLIPSE, 8 | GROUP, 9 | LAYER, 10 | LINE, 11 | PATH, 12 | POINTTEXT, 13 | RASTER, 14 | RECTANGLE, 15 | ARC, 16 | TOOL, 17 | } = TYPES 18 | 19 | export { 20 | CIRCLE as Circle, 21 | ELLIPSE as Ellipse, 22 | GROUP as Group, 23 | LAYER as Layer, 24 | LINE as Line, 25 | PATH as Path, 26 | POINTTEXT as PointText, 27 | RASTER as Raster, 28 | RECTANGLE as Rectangle, 29 | ARC as Arc, 30 | TOOL as Tool, 31 | } 32 | 33 | export { default as View } from './View' 34 | export { default as Renderer } from './PaperRenderer' 35 | -------------------------------------------------------------------------------- /src/types.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | export default { 4 | CIRCLE: 'Circle', 5 | ELLIPSE: 'Ellipse', 6 | GROUP: 'Group', 7 | LAYER: 'Layer', 8 | LINE: 'Line', 9 | PATH: 'Path', 10 | POINTTEXT: 'PointText', 11 | RASTER: 'Raster', 12 | RECTANGLE: 'Rectangle', 13 | ARC: 'Arc', 14 | TOOL: 'Tool', 15 | } 16 | -------------------------------------------------------------------------------- /src/utils.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | type Point = { 4 | x: number, 5 | y: number, 6 | } | Array 7 | 8 | export function arePointsEqual(p1: Point, p2: Point) { 9 | if (p1 && p2) { 10 | // both points are array 11 | if (Array.isArray(p1) && Array.isArray(p2)) { 12 | return p1[0] === p2[0] && p1[1] === p2[1] 13 | } 14 | // both points are object 15 | if (!Array.isArray(p1) && !Array.isArray(p2)) { 16 | return p1.x === p2.x && p1.y === p2.y 17 | } 18 | // point 1 is object, point 2 is array 19 | if (!Array.isArray(p1) && Array.isArray(p2)) { 20 | return p1.x === p2[0] && p1.y === p2[1] 21 | } 22 | // point 1 is array, point 2 is object 23 | if (Array.isArray(p1) && !Array.isArray(p2)) { 24 | return p1[0] === p2.x && p1[1] === p2.y 25 | } 26 | } else if (!p1 && !p2) { 27 | // both points are null 28 | return true 29 | } else { 30 | // some point is null 31 | return false 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /test/components/App.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | import React, { Component } from 'react' 4 | 5 | import Paper from './Paper' 6 | 7 | type Props = {} 8 | 9 | class App extends Component { 10 | render() { 11 | return ( 12 | 13 | ) 14 | } 15 | } 16 | 17 | export default App 18 | -------------------------------------------------------------------------------- /test/components/Grid.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | import React, { Component } from 'react' 4 | 5 | import { Layer, Line } from '../../src' 6 | 7 | type Props = { 8 | width: number, 9 | height: number, 10 | size?: number, 11 | } 12 | 13 | class Grid extends Component { 14 | layer = null 15 | 16 | constructor(props: Props) { 17 | super(props) 18 | this.layer = React.createRef() 19 | } 20 | 21 | componentDidMount() { 22 | if (this.layer && this.layer.current) { 23 | this.layer.current.sendToBack() 24 | } 25 | } 26 | 27 | render() { 28 | const { width, height, size = 20 } = this.props 29 | 30 | const vertical = [] 31 | const horizontal = [] 32 | 33 | const wlen = Math.round(width / size) 34 | const hlen = Math.round(height / size) 35 | 36 | for (let i = 0; i <= wlen; i++) { 37 | const x = i * size 38 | vertical.push({ 39 | id: x, 40 | from: [x, 0], 41 | to: [x, height], 42 | }) 43 | } 44 | 45 | for (let i = 0; i <= hlen; i++) { 46 | const y = i * size 47 | horizontal.push({ 48 | id: y, 49 | from: [0, y], 50 | to: [width, y], 51 | }) 52 | } 53 | 54 | return ( 55 | 56 | {vertical.map(({ id, from, to }) => 57 | 58 | )} 59 | {horizontal.map(({ id, from, to }) => 60 | 61 | )} 62 | 63 | ) 64 | } 65 | } 66 | 67 | export default Grid 68 | -------------------------------------------------------------------------------- /test/components/Paper.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | import React, { Component } from 'react' 4 | 5 | import { View, Layer, Rectangle } from '../../src' 6 | import Grid from './Grid' 7 | 8 | import type { ElementRef } from 'react' 9 | 10 | type Ref = { 11 | current: ElementRef | null, 12 | } 13 | 14 | type Props = { 15 | width: number, 16 | height: number, 17 | } 18 | 19 | class Paper extends Component { 20 | mounted: boolean = false 21 | view: ?Ref = null 22 | 23 | constructor(props: Props) { 24 | super(props) 25 | this.view = React.createRef() 26 | } 27 | 28 | componentDidMount() { 29 | this.mounted = true 30 | } 31 | 32 | render() { 33 | const { width, height } = this.props 34 | return ( 35 | 36 | 37 | 38 | 43 | 44 | 45 | ) 46 | } 47 | } 48 | 49 | export default Paper 50 | -------------------------------------------------------------------------------- /test/index.test.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | import React from 'react' 4 | import ReactDOM from 'react-dom' 5 | 6 | import { mount } from 'enzyme' 7 | import sinon from 'sinon' 8 | 9 | import App from './components/App' 10 | import Paper from './components/Paper' 11 | 12 | it('can create app', () => { 13 | const div = document.createElement('div') 14 | ReactDOM.render(, div) 15 | ReactDOM.unmountComponentAtNode(div) 16 | }) 17 | 18 | it('can mount paper', () => { 19 | sinon.spy(Paper.prototype, 'componentDidMount') 20 | 21 | const wrapper = mount() 22 | expect(Paper.prototype.componentDidMount).toHaveProperty('callCount', 1) 23 | 24 | const instance = wrapper.instance() 25 | expect(instance).toBeDefined() 26 | expect(instance).toHaveProperty('view') 27 | expect(instance.view).toHaveProperty('current') 28 | 29 | const view = instance.view.current 30 | expect(view).toHaveProperty('canvas') 31 | expect(view.canvas).toHaveProperty('current') 32 | expect(view).toHaveProperty('scope') 33 | 34 | const canvas = view.canvas.current 35 | expect(canvas).toBeInstanceOf(HTMLCanvasElement) 36 | 37 | const scope = view.scope 38 | expect(scope).toHaveProperty('project') 39 | 40 | const project = scope.project 41 | expect(project).toHaveProperty('layers') 42 | 43 | const layers = project.layers 44 | expect(layers).toHaveLength(3) 45 | 46 | const rectangle = layers[2].children[0] 47 | expect(rectangle.fillColor.equals('green')).toBeTruthy() 48 | }) 49 | -------------------------------------------------------------------------------- /test/setup.js: -------------------------------------------------------------------------------- 1 | // @flow 2 | 3 | import { configure } from 'enzyme' 4 | import Adapter from 'enzyme-adapter-react-16' 5 | 6 | configure({ adapter: new Adapter() }) 7 | --------------------------------------------------------------------------------