diff --git a/.eslintrc b/.eslintrc index a7235ea2..bd3a380a 100644 --- a/.eslintrc +++ b/.eslintrc @@ -1,11 +1,7 @@ { "root": true, "parser": "babel-eslint", - "extends": [ - "eslint:recommended", - "plugin:react/recommended", - "prettier" - ], + "extends": ["eslint:recommended", "plugin:react/recommended", "prettier"], "globals": { "chrome": true }, @@ -17,17 +13,13 @@ }, "rules": { "eol-last": ["warn"], - "max-len": ["warn", { "code": 120 , "ignoreComments": true }], + "max-len": ["warn", { "code": 120, "ignoreComments": true }], "quotes": ["warn", "single", "avoid-escape"], "jsx-quotes": ["warn", "prefer-double"], "react/prop-types": 0, "prettier/prettier": "error" }, - "plugins": [ - "prettier", - "react", - "babel" - ], + "plugins": ["prettier", "react", "babel"], "settings": { "react": { "version": "detect" diff --git a/.travis.yml b/.travis.yml index 8b1723df..c3a280f2 100644 --- a/.travis.yml +++ b/.travis.yml @@ -1,12 +1,13 @@ sudo: false language: node_js node_js: - - "stable" + - 'stable' cache: yarn: true directories: - - "node_modules" + - 'node_modules' script: - yarn build:all - yarn lint:all + - yarn prettier:check - yarn test:all diff --git a/package.json b/package.json index da9bb1f8..ac76e6dc 100644 --- a/package.json +++ b/package.json @@ -38,7 +38,8 @@ "lint": "eslint \"**/*.{js,jsx,ts,tsx}\" --cache", "lint:fix": "eslint \"**/*.{js,jsx,ts,tsx}\" --fix --cache", "lint:all": "eslint \"**/*.{js,jsx,ts,tsx}\"", - "prettify": "prettier \"**/*.{js,jsx,ts,tsx,json,css,html,md}\" --write", + "prettify": "prettier --write .", + "prettier:check": "prettier --check .", "test": "jest --onlyChanged", "test:all": "jest" }, @@ -52,5 +53,16 @@ ], "engines": { "node": ">=10.13.0" + }, + "husky": { + "hooks": { + "pre-commit": "lint-staged" + } + }, + "lint-staged": { + "**/*": [ + "eslint --fix", + "prettier --write" + ] } } diff --git a/packages/d3-state-visualizer/.babelrc b/packages/d3-state-visualizer/.babelrc index feae4b3e..06050b00 100644 --- a/packages/d3-state-visualizer/.babelrc +++ b/packages/d3-state-visualizer/.babelrc @@ -1,4 +1,7 @@ { "presets": ["@babel/preset-env"], - "plugins": ["@babel/plugin-proposal-class-properties", "@babel/plugin-proposal-export-default-from"] + "plugins": [ + "@babel/plugin-proposal-class-properties", + "@babel/plugin-proposal-export-default-from" + ] } diff --git a/packages/devui/.babelrc b/packages/devui/.babelrc index 645cc56e..2d8ea82b 100755 --- a/packages/devui/.babelrc +++ b/packages/devui/.babelrc @@ -1,4 +1,7 @@ { "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": ["@babel/plugin-proposal-class-properties", "@babel/plugin-proposal-export-default-from"] + "plugins": [ + "@babel/plugin-proposal-class-properties", + "@babel/plugin-proposal-export-default-from" + ] } diff --git a/packages/react-base16-styling/package.json b/packages/react-base16-styling/package.json index 86e7818f..183221d4 100644 --- a/packages/react-base16-styling/package.json +++ b/packages/react-base16-styling/package.json @@ -19,6 +19,7 @@ "src" ], "main": "lib/index.js", + "types": "lib/index.d.ts", "repository": { "type": "git", "url": "git+https://github.com/reduxjs/redux-devtools.git" diff --git a/packages/react-dock/.babelrc b/packages/react-dock/.babelrc index a53745a0..36a7eb52 100644 --- a/packages/react-dock/.babelrc +++ b/packages/react-dock/.babelrc @@ -1,4 +1,8 @@ { "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": ["@babel/plugin-proposal-class-properties", "@babel/plugin-proposal-export-default-from", "react-hot-loader/babel"] + "plugins": [ + "@babel/plugin-proposal-class-properties", + "@babel/plugin-proposal-export-default-from", + "react-hot-loader/babel" + ] } diff --git a/packages/react-dock/README.md b/packages/react-dock/README.md index f4491a25..c146ee03 100644 --- a/packages/react-dock/README.md +++ b/packages/react-dock/README.md @@ -27,18 +27,18 @@ render() { #### Dock Props -| Prop Name | Description | -|-----------|-------------| -| position | Side to dock (`left`, `right`, `top` or `bottom`). Default is `left`. | -| fluid | If `true`, resize dock proportionally on window resize. | -| size | Size of dock panel (width or height, depending on `position`). If this prop is set, `Dock` is considered as a controlled component, so you need to use `onSizeChange` to track dock resizing. Value is a fraction of window width/height, if `fluid` is true, or pixels otherwise | -| defaultSize | Default size of dock panel (used for uncontrolled `Dock` component) | -| isVisible | If `true`, dock is visible | -| dimMode | If `none` - content is not dimmed, if `transparent` - pointer events are disabled (so you can click through it), if `opaque` - click on dim area closes the dock. Default is `opaque` | -| duration | Animation duration. Should be synced with transition animation in style properties | -| dimStyle | Style for dim area | -| dockStyle | Style for dock | -| zIndex | Z-index for wrapper | -| onVisibleChange | Fires when `Dock` wants to change `isVisible` (when opaque dim is clicked, in particular) | -| onSizeChange | Fires when `Dock` wants to change `size` | -| children | Dock content - react elements or function that returns an element. Function receives an object with these state values: `{ position, isResizing, size, isVisible }` | +| Prop Name | Description | +| --------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| position | Side to dock (`left`, `right`, `top` or `bottom`). Default is `left`. | +| fluid | If `true`, resize dock proportionally on window resize. | +| size | Size of dock panel (width or height, depending on `position`). If this prop is set, `Dock` is considered as a controlled component, so you need to use `onSizeChange` to track dock resizing. Value is a fraction of window width/height, if `fluid` is true, or pixels otherwise | +| defaultSize | Default size of dock panel (used for uncontrolled `Dock` component) | +| isVisible | If `true`, dock is visible | +| dimMode | If `none` - content is not dimmed, if `transparent` - pointer events are disabled (so you can click through it), if `opaque` - click on dim area closes the dock. Default is `opaque` | +| duration | Animation duration. Should be synced with transition animation in style properties | +| dimStyle | Style for dim area | +| dockStyle | Style for dock | +| zIndex | Z-index for wrapper | +| onVisibleChange | Fires when `Dock` wants to change `isVisible` (when opaque dim is clicked, in particular) | +| onSizeChange | Fires when `Dock` wants to change `size` | +| children | Dock content - react elements or function that returns an element. Function receives an object with these state values: `{ position, isResizing, size, isVisible }` | diff --git a/packages/react-dock/demo/index.html b/packages/react-dock/demo/index.html index c6c57bb1..bd6b242b 100644 --- a/packages/react-dock/demo/index.html +++ b/packages/react-dock/demo/index.html @@ -2,11 +2,24 @@ React Dock - - + + -Fork me on GitHub + Fork me on GitHub
diff --git a/packages/react-dock/src/Dock.js b/packages/react-dock/src/Dock.js index 92ecea0f..bf0dd950 100644 --- a/packages/react-dock/src/Dock.js +++ b/packages/react-dock/src/Dock.js @@ -244,7 +244,9 @@ export default class Dock extends Component { }; componentDidMount() { + window.addEventListener('touchend', this.handleMouseUp); window.addEventListener('mouseup', this.handleMouseUp); + window.addEventListener('touchmove', this.handleMouseMove); window.addEventListener('mousemove', this.handleMouseMove); window.addEventListener('resize', this.handleResize); @@ -254,7 +256,9 @@ export default class Dock extends Component { } componentWillUnmount() { + window.removeEventListener('touchend', this.handleMouseUp); window.removeEventListener('mouseup', this.handleMouseUp); + window.removeEventListener('touchmove', this.handleMouseMove); window.removeEventListener('mousemove', this.handleMouseMove); window.removeEventListener('resize', this.handleResize); } @@ -329,7 +333,11 @@ export default class Dock extends Component {
)}
-
+
{typeof children === 'function' ? children({ @@ -401,11 +409,18 @@ export default class Dock extends Component { handleMouseMove = (e) => { if (!this.state.isResizing || this.state.isWindowResizing) return; - e.preventDefault(); + + if (!e.touches) e.preventDefault(); const { position, fluid } = this.props; const { fullWidth, fullHeight, isControlled } = this.state; - const { clientX: x, clientY: y } = e; + let { clientX: x, clientY: y } = e; + + if (e.touches) { + x = e.touches[0].clientX; + y = e.touches[0].clientY; + } + let size; switch (position) { diff --git a/packages/redux-devtools-chart-monitor/.babelrc b/packages/redux-devtools-chart-monitor/.babelrc index 645cc56e..2d8ea82b 100644 --- a/packages/redux-devtools-chart-monitor/.babelrc +++ b/packages/redux-devtools-chart-monitor/.babelrc @@ -1,4 +1,7 @@ { "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": ["@babel/plugin-proposal-class-properties", "@babel/plugin-proposal-export-default-from"] + "plugins": [ + "@babel/plugin-proposal-class-properties", + "@babel/plugin-proposal-export-default-from" + ] } diff --git a/packages/redux-devtools-cli/src/api/schema_def.graphql b/packages/redux-devtools-cli/src/api/schema_def.graphql index c8e0b918..a4a50009 100644 --- a/packages/redux-devtools-cli/src/api/schema_def.graphql +++ b/packages/redux-devtools-cli/src/api/schema_def.graphql @@ -1,42 +1,42 @@ # A list of options for the type of the report enum ReportType { - STATE - ACTION - STATES - ACTIONS + STATE + ACTION + STATES + ACTIONS } type Report { # Report ID id: ID! # Type of the report, can be: STATE, ACTION, STATES, ACTIONS - type: ReportType, + type: ReportType # Briefly what happened - title: String, + title: String # Details supplied by the user - description: String, + description: String # The last dispatched action before the report was sent - action: String, + action: String # Stringified actions or the state or both, which should be loaded the application to reproduce the exact behavior - payload: String, + payload: String # Stringified preloaded state object. Could be the initial state of the app or committed state (after dispatching COMMIT action or reaching maxAge) - preloadedState: String, + preloadedState: String # Screenshot url or blob as a string - screenshot: String, + screenshot: String # User Agent String - userAgent: String, + userAgent: String # Application version to group the reports and versioning - version: String, + version: String # Used to identify the user who sent the report - userId: String, + userId: String # More detailed data about the user, usually it's a stringified object - user: String, + user: String # Everything else you want to send - meta: String, + meta: String # Error message which invoked sending the report - exception: String, + exception: String # Id to identify the store in case there are multiple stores - instanceId: String, + instanceId: String # Timestamp when the report was added added: String # Id to identify the application (from apps table) diff --git a/packages/redux-devtools-dock-monitor/.babelrc b/packages/redux-devtools-dock-monitor/.babelrc index 645cc56e..2d8ea82b 100644 --- a/packages/redux-devtools-dock-monitor/.babelrc +++ b/packages/redux-devtools-dock-monitor/.babelrc @@ -1,4 +1,7 @@ { "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": ["@babel/plugin-proposal-class-properties", "@babel/plugin-proposal-export-default-from"] + "plugins": [ + "@babel/plugin-proposal-class-properties", + "@babel/plugin-proposal-export-default-from" + ] } diff --git a/packages/redux-devtools-log-monitor/.babelrc b/packages/redux-devtools-log-monitor/.babelrc index 645cc56e..2d8ea82b 100644 --- a/packages/redux-devtools-log-monitor/.babelrc +++ b/packages/redux-devtools-log-monitor/.babelrc @@ -1,4 +1,7 @@ { "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": ["@babel/plugin-proposal-class-properties", "@babel/plugin-proposal-export-default-from"] + "plugins": [ + "@babel/plugin-proposal-class-properties", + "@babel/plugin-proposal-export-default-from" + ] } diff --git a/packages/redux-devtools-slider-monitor/examples/todomvc/.babelrc b/packages/redux-devtools-slider-monitor/examples/todomvc/.babelrc index cff1f9c7..3d0797a7 100644 --- a/packages/redux-devtools-slider-monitor/examples/todomvc/.babelrc +++ b/packages/redux-devtools-slider-monitor/examples/todomvc/.babelrc @@ -1,4 +1,7 @@ { "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": ["@babel/plugin-proposal-class-properties", "react-hot-loader/babel"] + "plugins": [ + "@babel/plugin-proposal-class-properties", + "react-hot-loader/babel" + ] } diff --git a/packages/redux-devtools-test-generator/.babelrc b/packages/redux-devtools-test-generator/.babelrc index 7059cf67..772c0ded 100644 --- a/packages/redux-devtools-test-generator/.babelrc +++ b/packages/redux-devtools-test-generator/.babelrc @@ -1,4 +1,7 @@ { "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": ["@babel/plugin-proposal-class-properties", "@babel/plugin-proposal-do-expressions"] + "plugins": [ + "@babel/plugin-proposal-class-properties", + "@babel/plugin-proposal-do-expressions" + ] } diff --git a/packages/redux-devtools-trace-monitor/.babelrc b/packages/redux-devtools-trace-monitor/.babelrc index 66b3d0b8..2a38a7b6 100644 --- a/packages/redux-devtools-trace-monitor/.babelrc +++ b/packages/redux-devtools-trace-monitor/.babelrc @@ -1,15 +1,13 @@ { - "presets": [ - "@babel/preset-env", "@babel/preset-react", "@babel/preset-flow" - ], + "presets": ["@babel/preset-env", "@babel/preset-react", "@babel/preset-flow"], "plugins": [ - ["@babel/plugin-transform-runtime", { - "regenerator": true - }], [ - "@babel/plugin-proposal-decorators", - { "legacy": true } + "@babel/plugin-transform-runtime", + { + "regenerator": true + } ], + ["@babel/plugin-proposal-decorators", { "legacy": true }], "@babel/plugin-proposal-class-properties" ] } diff --git a/packages/redux-devtools/examples/counter/.babelrc b/packages/redux-devtools/examples/counter/.babelrc index cff1f9c7..3d0797a7 100644 --- a/packages/redux-devtools/examples/counter/.babelrc +++ b/packages/redux-devtools/examples/counter/.babelrc @@ -1,4 +1,7 @@ { "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": ["@babel/plugin-proposal-class-properties", "react-hot-loader/babel"] + "plugins": [ + "@babel/plugin-proposal-class-properties", + "react-hot-loader/babel" + ] } diff --git a/packages/redux-devtools/examples/todomvc/.babelrc b/packages/redux-devtools/examples/todomvc/.babelrc index 009fb366..3c204230 100644 --- a/packages/redux-devtools/examples/todomvc/.babelrc +++ b/packages/redux-devtools/examples/todomvc/.babelrc @@ -1,4 +1,8 @@ { "presets": ["@babel/preset-env", "@babel/preset-react"], - "plugins": ["@babel/plugin-proposal-class-properties", "@babel/plugin-proposal-function-bind", "react-hot-loader/babel"] + "plugins": [ + "@babel/plugin-proposal-class-properties", + "@babel/plugin-proposal-function-bind", + "react-hot-loader/babel" + ] } diff --git a/packages/redux-devtools/index.d.ts b/packages/redux-devtools/index.d.ts index 26611ccb..c56d1619 100644 --- a/packages/redux-devtools/index.d.ts +++ b/packages/redux-devtools/index.d.ts @@ -2,8 +2,8 @@ // Type definitions for redux-devtools 3.4.1 // TypeScript Version: 2.8.1 -import * as React from "react"; -import { StoreEnhancer } from "redux"; +import * as React from 'react'; +import { StoreEnhancer } from 'redux'; export interface DevTools { new (): JSX.ElementClass;