mirror of
https://github.com/reduxjs/redux-devtools.git
synced 2025-02-16 19:40:58 +03:00
chore(*): make more packages scoped (#692)
* dock-monitor * log-monitor * serialize * slider-monitor * inspector-monitor * chart-monitor * test-tab * trace-tab * Fix
This commit is contained in:
parent
cf357931e3
commit
a46b43209d
|
@ -1,5 +1,5 @@
|
||||||
// Based on unikitty theme and on
|
// Based on unikitty theme and on
|
||||||
// https://github.com/reduxjs/redux-devtools/blob/master/packages/redux-devtools-inspector/src/themes/inspector.ts
|
// https://github.com/reduxjs/redux-devtools/blob/master/packages/redux-devtools-inspector-monitor/src/themes/inspector.ts
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
scheme: 'default',
|
scheme: 'default',
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
A pure function to convert a map into a tree structure. Created by [@romseguy](https://github.com/romseguy) and merged from [`romseguy/map2tree`](https://github.com/romseguy/map2tree).
|
A pure function to convert a map into a tree structure. Created by [@romseguy](https://github.com/romseguy) and merged from [`romseguy/map2tree`](https://github.com/romseguy/map2tree).
|
||||||
|
|
||||||
The following opinions must be taken into account since the primary use case of this library is [redux-devtools-chart-monitor](https://github.com/romseguy/redux-devtools-chart-monitor):
|
The following opinions must be taken into account since the primary use case of this library is [redux-devtools-chart-monitor](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-chart-monitor):
|
||||||
|
|
||||||
- Objects and arrays deeply nested within collections are not converted into a tree structure. See `someNestedObject` and `someNestedArray` in the [output](https://github.com/romseguy/map2tree#output) below, or the [corresponding test](https://github.com/romseguy/map2tree/blob/master/test/map2tree.js#L140).
|
- Objects and arrays deeply nested within collections are not converted into a tree structure. See `someNestedObject` and `someNestedArray` in the [output](https://github.com/romseguy/map2tree#output) below, or the [corresponding test](https://github.com/romseguy/map2tree/blob/master/test/map2tree.js#L140).
|
||||||
- Provides support for [Immutable.js](https://github.com/facebook/immutable-js) data structures (only List and Map though).
|
- Provides support for [Immutable.js](https://github.com/facebook/immutable-js) data structures (only List and Map though).
|
||||||
|
|
|
@ -15,7 +15,7 @@ It shows a real-time view of the store aka the current state of the app.
|
||||||
### Installation
|
### Installation
|
||||||
|
|
||||||
```
|
```
|
||||||
yarn add redux-devtools-chart-monitor
|
yarn add @redux-devtools/chart-monitor
|
||||||
```
|
```
|
||||||
|
|
||||||
### Usage
|
### Usage
|
||||||
|
@ -27,15 +27,15 @@ You can use `ChartMonitor` as the only monitor in your app:
|
||||||
```js
|
```js
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { createDevTools } from '@redux-devtools/core';
|
import { createDevTools } from '@redux-devtools/core';
|
||||||
import ChartMonitor from 'redux-devtools-chart-monitor';
|
import ChartMonitor from '@redux-devtools/chart-monitor';
|
||||||
|
|
||||||
export default createDevTools(<ChartMonitor />);
|
export default createDevTools(<ChartMonitor />);
|
||||||
```
|
```
|
||||||
|
|
||||||
Then you can render `<DevTools>` to any place inside app or even into a separate popup window.
|
Then you can render `<DevTools>` to any place inside app or even into a separate popup window.
|
||||||
|
|
||||||
Alternatively, you can use it together with [`DockMonitor`](https://github.com/gaearon/redux-devtools-dock-monitor) to make it dockable.
|
Alternatively, you can use it together with [`DockMonitor`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-dock-monitor) to make it dockable.
|
||||||
Consult the [`DockMonitor` README](https://github.com/gaearon/redux-devtools-dock-monitor) for details of this approach.
|
Consult the [`DockMonitor` README](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-dock-monitor) for details of this approach.
|
||||||
|
|
||||||
[Read how to start using Redux DevTools.](https://github.com/reduxjs/redux-devtools)
|
[Read how to start using Redux DevTools.](https://github.com/reduxjs/redux-devtools)
|
||||||
|
|
||||||
|
@ -48,13 +48,13 @@ Consult the [`DockMonitor` README](https://github.com/gaearon/redux-devtools-doc
|
||||||
You can read the React component [propTypes](https://github.com/reduxjs/redux-devtools/blob/master/packages/redux-devtools-chart-monitor/src/Chart.js#L11) in addition to the details below:
|
You can read the React component [propTypes](https://github.com/reduxjs/redux-devtools/blob/master/packages/redux-devtools-chart-monitor/src/Chart.js#L11) in addition to the details below:
|
||||||
|
|
||||||
| Name | Description |
|
| Name | Description |
|
||||||
| ------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
| ------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||||
| `defaultIsVisible` | By default, set to `true`. |
|
| `defaultIsVisible` | By default, set to `true`. |
|
||||||
| `transitionDuration` | By default, set to `750`, in milliseconds. |
|
| `transitionDuration` | By default, set to `750`, in milliseconds. |
|
||||||
| `heightBetweenNodesCoeff` | By default, set to `1`. |
|
| `heightBetweenNodesCoeff` | By default, set to `1`. |
|
||||||
| `widthBetweenNodesCoeff` | By default, set to `1.3`. |
|
| `widthBetweenNodesCoeff` | By default, set to `1.3`. |
|
||||||
| `isSorted` | By default, set to `false`. |
|
| `isSorted` | By default, set to `false`. |
|
||||||
| `style` | {<br> width: '100%', height: '100%', // i.e fullscreen for [`DockMonitor`](https://github.com/gaearon/redux-devtools-dock-monitor)<br> text: {<br> colors: {<br> 'default': `theme.base0D`,<br> hover: `theme.base06`<br> }<br> },<br> node: {<br> colors: {<br> 'default': `theme.base0B`,<br> collapsed: `theme.base0B`,<br> parent: `theme.base0E`<br> },<br> radius: 7<br> }<br>} |
|
| `style` | {<br> width: '100%', height: '100%', // i.e fullscreen for [`DockMonitor`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-dock-monitor)<br> text: {<br> colors: {<br> 'default': `theme.base0D`,<br> hover: `theme.base06`<br> }<br> },<br> node: {<br> colors: {<br> 'default': `theme.base0B`,<br> collapsed: `theme.base0B`,<br> parent: `theme.base0E`<br> },<br> radius: 7<br> }<br>} |
|
||||||
| `onClickText` | Function called with a reference to the clicked node as first argument when clicking on the text next to a node. |
|
| `onClickText` | Function called with a reference to the clicked node as first argument when clicking on the text next to a node. |
|
||||||
| `tooltipOptions` | {<br> disabled: false,<br> indentationSize: 2,<br> style: {<br> 'background-color': `theme.base06`,<br> 'opacity': '0.7',<br> 'border-radius': '5px',<br> 'padding': '5px'<br> }<br>}<br>[More info](https://github.com/reduxjs/redux-devtools/tree/master/packages/d3tooltip#api). |
|
| `tooltipOptions` | {<br> disabled: false,<br> indentationSize: 2,<br> style: {<br> 'background-color': `theme.base06`,<br> 'opacity': '0.7',<br> 'border-radius': '5px',<br> 'padding': '5px'<br> }<br>}<br>[More info](https://github.com/reduxjs/redux-devtools/tree/master/packages/d3tooltip#api). |
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"name": "redux-devtools-chart-monitor",
|
"name": "@redux-devtools/chart-monitor",
|
||||||
"version": "1.7.2",
|
"version": "1.7.2",
|
||||||
"description": "Chart monitor for Redux DevTools",
|
"description": "Chart monitor for Redux DevTools",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
|
|
|
@ -37,7 +37,14 @@
|
||||||
"prepublishOnly": "npm run clean && npm run build"
|
"prepublishOnly": "npm run clean && npm run build"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
|
"@redux-devtools/chart-monitor": "^1.7.2",
|
||||||
"@redux-devtools/core": "^3.7.0",
|
"@redux-devtools/core": "^3.7.0",
|
||||||
|
"@redux-devtools/inspector-monitor": "^0.14.0",
|
||||||
|
"@redux-devtools/inspector-monitor-test-tab": "^0.6.2",
|
||||||
|
"@redux-devtools/inspector-monitor-trace-tab": "^0.1.3",
|
||||||
|
"@redux-devtools/log-monitor": "^2.1.0",
|
||||||
|
"@redux-devtools/serialize": "^0.2.0",
|
||||||
|
"@redux-devtools/slider-monitor": "^2.0.0-5",
|
||||||
"d3-state-visualizer": "^1.3.4",
|
"d3-state-visualizer": "^1.3.4",
|
||||||
"devui": "^1.0.0-6",
|
"devui": "^1.0.0-6",
|
||||||
"get-params": "^0.1.2",
|
"get-params": "^0.1.2",
|
||||||
|
@ -53,13 +60,6 @@
|
||||||
"react-is": "^16.13.1",
|
"react-is": "^16.13.1",
|
||||||
"react-redux": "^7.2.1",
|
"react-redux": "^7.2.1",
|
||||||
"redux": "^4.0.5",
|
"redux": "^4.0.5",
|
||||||
"redux-devtools-chart-monitor": "^1.7.2",
|
|
||||||
"redux-devtools-inspector-monitor": "^0.14.0",
|
|
||||||
"redux-devtools-inspector-monitor-test-tab": "^0.6.2",
|
|
||||||
"redux-devtools-inspector-monitor-trace-tab": "^0.1.3",
|
|
||||||
"redux-devtools-log-monitor": "^2.1.0",
|
|
||||||
"redux-devtools-serialize": "^0.2.0",
|
|
||||||
"redux-devtools-slider-monitor": "^2.0.0-5",
|
|
||||||
"redux-persist": "^4.10.2",
|
"redux-persist": "^4.10.2",
|
||||||
"socketcluster-client": "^14.3.1",
|
"socketcluster-client": "^14.3.1",
|
||||||
"styled-components": "^5.1.1"
|
"styled-components": "^5.1.1"
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import { connect, ResolveThunks } from 'react-redux';
|
import { connect, ResolveThunks } from 'react-redux';
|
||||||
import ChartMonitor from 'redux-devtools-chart-monitor';
|
import ChartMonitor from '@redux-devtools/chart-monitor';
|
||||||
import { NodeWithId } from 'd3-state-visualizer';
|
import { NodeWithId } from 'd3-state-visualizer';
|
||||||
import { selectMonitorWithState } from '../../actions';
|
import { selectMonitorWithState } from '../../actions';
|
||||||
|
|
||||||
|
|
|
@ -1,11 +1,11 @@
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import { connect, ResolveThunks } from 'react-redux';
|
import { connect, ResolveThunks } from 'react-redux';
|
||||||
import { Tab, Tabs } from 'devui';
|
import { Tab, Tabs } from 'devui';
|
||||||
import { TabComponentProps } from 'redux-devtools-inspector-monitor';
|
import { TabComponentProps } from '@redux-devtools/inspector-monitor';
|
||||||
import { Action } from 'redux';
|
import { Action } from 'redux';
|
||||||
import StateTree from 'redux-devtools-inspector-monitor/lib/tabs/StateTab';
|
import StateTree from '@redux-devtools/inspector-monitor/lib/tabs/StateTab';
|
||||||
import ActionTree from 'redux-devtools-inspector-monitor/lib/tabs/ActionTab';
|
import ActionTree from '@redux-devtools/inspector-monitor/lib/tabs/ActionTab';
|
||||||
import DiffTree from 'redux-devtools-inspector-monitor/lib/tabs/DiffTab';
|
import DiffTree from '@redux-devtools/inspector-monitor/lib/tabs/DiffTab';
|
||||||
import { selectMonitorTab } from '../../../actions';
|
import { selectMonitorTab } from '../../../actions';
|
||||||
import RawTab from './RawTab';
|
import RawTab from './RawTab';
|
||||||
import ChartTab from './ChartTab';
|
import ChartTab from './ChartTab';
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import InspectorMonitor, { Tab } from 'redux-devtools-inspector-monitor';
|
import InspectorMonitor, { Tab } from '@redux-devtools/inspector-monitor';
|
||||||
import TraceTab from 'redux-devtools-inspector-monitor-trace-tab';
|
import TraceTab from '@redux-devtools/inspector-monitor-trace-tab';
|
||||||
import TestTab from 'redux-devtools-inspector-monitor-test-tab';
|
import TestTab from '@redux-devtools/inspector-monitor-test-tab';
|
||||||
import { DATA_TYPE_KEY } from '../../../constants/dataTypes';
|
import { DATA_TYPE_KEY } from '../../../constants/dataTypes';
|
||||||
import SubTabs from './SubTabs';
|
import SubTabs from './SubTabs';
|
||||||
import { Action } from 'redux';
|
import { Action } from 'redux';
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import styled, { withTheme } from 'styled-components';
|
import styled, { withTheme } from 'styled-components';
|
||||||
import SliderMonitor from 'redux-devtools-slider-monitor';
|
import SliderMonitor from '@redux-devtools/slider-monitor';
|
||||||
import { LiftedAction } from '@redux-devtools/core';
|
import { LiftedAction } from '@redux-devtools/core';
|
||||||
import { Action } from 'redux';
|
import { Action } from 'redux';
|
||||||
import { ThemeFromProvider } from 'devui';
|
import { ThemeFromProvider } from 'devui';
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import LogMonitor from 'redux-devtools-log-monitor';
|
import LogMonitor from '@redux-devtools/log-monitor';
|
||||||
import ChartMonitorWrapper from '../containers/monitors/ChartMonitorWrapper';
|
import ChartMonitorWrapper from '../containers/monitors/ChartMonitorWrapper';
|
||||||
import InspectorWrapper from '../containers/monitors/InspectorWrapper';
|
import InspectorWrapper from '../containers/monitors/InspectorWrapper';
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import mapValues from 'lodash/mapValues';
|
import mapValues from 'lodash/mapValues';
|
||||||
import jsan from 'jsan';
|
import jsan from 'jsan';
|
||||||
import { immutableSerialize } from 'redux-devtools-serialize';
|
import { immutableSerialize } from '@redux-devtools/serialize';
|
||||||
import { Action } from 'redux';
|
import { Action } from 'redux';
|
||||||
import Immutable from 'immutable';
|
import Immutable from 'immutable';
|
||||||
import { State } from '../app/reducers/instances';
|
import { State } from '../app/reducers/instances';
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import getParams from 'get-params';
|
import getParams from 'get-params';
|
||||||
import jsan from 'jsan';
|
import jsan from 'jsan';
|
||||||
import { nanoid } from 'nanoid/non-secure';
|
import { nanoid } from 'nanoid/non-secure';
|
||||||
import { immutableSerialize } from 'redux-devtools-serialize';
|
import { immutableSerialize } from '@redux-devtools/serialize';
|
||||||
import Immutable from 'immutable';
|
import Immutable from 'immutable';
|
||||||
import { Action } from 'redux';
|
import { Action } from 'redux';
|
||||||
|
|
||||||
|
|
|
@ -8,7 +8,7 @@ Powered by [React Dock](https://github.com/alexkuz/react-dock).
|
||||||
### Installation
|
### Installation
|
||||||
|
|
||||||
```
|
```
|
||||||
yarn add redux-devtools-dock-monitor
|
yarn add @redux-devtools/dock-monitor
|
||||||
```
|
```
|
||||||
|
|
||||||
### Usage
|
### Usage
|
||||||
|
@ -21,9 +21,9 @@ For example, you can use it together with [`LogMonitor`](https://github.com/redu
|
||||||
```js
|
```js
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { createDevTools } from '@redux-devtools/core';
|
import { createDevTools } from '@redux-devtools/core';
|
||||||
import LogMonitor from 'redux-devtools-log-monitor';
|
import LogMonitor from '@redux-devtools/log-monitor';
|
||||||
import SliderMonitor from 'redux-devtools-slider-monitor';
|
import SliderMonitor from '@redux-devtools/slider-monitor';
|
||||||
import DockMonitor from 'redux-devtools-dock-monitor';
|
import DockMonitor from '@redux-devtools/dock-monitor';
|
||||||
|
|
||||||
export default createDevTools(
|
export default createDevTools(
|
||||||
<DockMonitor
|
<DockMonitor
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"name": "redux-devtools-dock-monitor",
|
"name": "@redux-devtools/dock-monitor",
|
||||||
"version": "1.2.0",
|
"version": "1.2.0",
|
||||||
"description": "A resizable and movable dock for Redux DevTools monitors",
|
"description": "A resizable and movable dock for Redux DevTools monitors",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
|
|
|
@ -102,7 +102,7 @@ class DockMonitor<S, A extends Action<unknown>> extends Component<
|
||||||
console.error(
|
console.error(
|
||||||
'<DockMonitor> requires at least one monitor inside. ' +
|
'<DockMonitor> requires at least one monitor inside. ' +
|
||||||
'Why don’t you try <LogMonitor>? You can get it at ' +
|
'Why don’t you try <LogMonitor>? You can get it at ' +
|
||||||
'https://github.com/gaearon/redux-devtools-log-monitor.'
|
'https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-log-monitor.'
|
||||||
);
|
);
|
||||||
} else if (childrenCount > 1 && !props.changeMonitorKey) {
|
} else if (childrenCount > 1 && !props.changeMonitorKey) {
|
||||||
// eslint-disable-next-line no-console
|
// eslint-disable-next-line no-console
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
### Installation
|
### Installation
|
||||||
|
|
||||||
```
|
```
|
||||||
yarn add redux-devtools-inspector-monitor-test-tab
|
yarn add @redux-devtools/inspector-monitor-test-tab
|
||||||
```
|
```
|
||||||
|
|
||||||
### Usage
|
### Usage
|
||||||
|
@ -17,9 +17,9 @@ With [`redux-devtools`](https://github.com/reduxjs/redux-devtools) and [`redux-d
|
||||||
```js
|
```js
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { createDevTools } from '@redux-devtools/core';
|
import { createDevTools } from '@redux-devtools/core';
|
||||||
import InspectorMonitor from 'redux-devtools-inspector-monitor';
|
import InspectorMonitor from '@redux-devtools/inspector-monitor';
|
||||||
import TestGenerator from 'redux-devtools-inspector-monitor-test-tab';
|
import TestGenerator from '@redux-devtools/inspector-monitor-test-tab';
|
||||||
import mochaTemplate from 'redux-devtools-inspector-monitor-test-tab/lib/redux/mocha'; // If using default tests.
|
import mochaTemplate from '@redux-devtools/inspector-monitor-test-tab/lib/redux/mocha'; // If using default tests.
|
||||||
|
|
||||||
const testComponent = (props) => (
|
const testComponent = (props) => (
|
||||||
<TestGenerator
|
<TestGenerator
|
||||||
|
|
|
@ -4,8 +4,8 @@ import { createDevTools } from '@redux-devtools/core';
|
||||||
import InspectorMonitor, {
|
import InspectorMonitor, {
|
||||||
base16Themes,
|
base16Themes,
|
||||||
Tab,
|
Tab,
|
||||||
} from 'redux-devtools-inspector-monitor';
|
} from '@redux-devtools/inspector-monitor';
|
||||||
import DockMonitor from 'redux-devtools-dock-monitor';
|
import DockMonitor from '@redux-devtools/dock-monitor';
|
||||||
import { Location } from 'history';
|
import { Location } from 'history';
|
||||||
import getOptions from './getOptions';
|
import getOptions from './getOptions';
|
||||||
import TestGenerator from '../../../src';
|
import TestGenerator from '../../../src';
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"name": "redux-devtools-inspector-monitor-test-tab",
|
"name": "@redux-devtools/inspector-monitor-test-tab",
|
||||||
"version": "0.6.2",
|
"version": "0.6.2",
|
||||||
"description": "Generate tests for redux devtools.",
|
"description": "Generate tests for redux devtools.",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
|
@ -55,6 +55,8 @@
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@redux-devtools/core": "^3.7.0",
|
"@redux-devtools/core": "^3.7.0",
|
||||||
|
"@redux-devtools/dock-monitor": "^1.2.0",
|
||||||
|
"@redux-devtools/inspector-monitor": "^0.14.0",
|
||||||
"@types/es6template": "^1.0.0",
|
"@types/es6template": "^1.0.0",
|
||||||
"@types/history": "^4.7.7",
|
"@types/history": "^4.7.7",
|
||||||
"@types/jsan": "^3.1.0",
|
"@types/jsan": "^3.1.0",
|
||||||
|
@ -77,15 +79,13 @@
|
||||||
"react-redux": "^7.2.1",
|
"react-redux": "^7.2.1",
|
||||||
"react-router": "^5.2.0",
|
"react-router": "^5.2.0",
|
||||||
"redux": "^4.0.5",
|
"redux": "^4.0.5",
|
||||||
"redux-devtools-dock-monitor": "^1.2.0",
|
|
||||||
"redux-devtools-inspector-monitor": "^0.14.0",
|
|
||||||
"redux-logger": "^3.0.6",
|
"redux-logger": "^3.0.6",
|
||||||
"seamless-immutable": "^7.1.4"
|
"seamless-immutable": "^7.1.4"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
|
"@redux-devtools/inspector-monitor": "^0.14.0",
|
||||||
"@types/react": "^16.3.18",
|
"@types/react": "^16.3.18",
|
||||||
"react": "^16.3.0",
|
"react": "^16.3.0",
|
||||||
"redux": "^3.4.0 || ^4.0.0",
|
"redux": "^3.4.0 || ^4.0.0"
|
||||||
"redux-devtools-inspector-monitor": "^0.14.0"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,7 +5,7 @@ import jsan from 'jsan';
|
||||||
import diff, { Event } from 'simple-diff';
|
import diff, { Event } from 'simple-diff';
|
||||||
import es6template from 'es6template';
|
import es6template from 'es6template';
|
||||||
import { Editor } from 'devui';
|
import { Editor } from 'devui';
|
||||||
import { TabComponentProps } from 'redux-devtools-inspector-monitor';
|
import { TabComponentProps } from '@redux-devtools/inspector-monitor';
|
||||||
import { Action } from 'redux';
|
import { Action } from 'redux';
|
||||||
import { AssertionLocals, DispatcherLocals, WrapLocals } from './types';
|
import { AssertionLocals, DispatcherLocals, WrapLocals } from './types';
|
||||||
|
|
||||||
|
|
|
@ -14,7 +14,7 @@ import { Action } from 'redux';
|
||||||
import {
|
import {
|
||||||
DevtoolsInspectorState,
|
DevtoolsInspectorState,
|
||||||
TabComponentProps,
|
TabComponentProps,
|
||||||
} from 'redux-devtools-inspector-monitor';
|
} from '@redux-devtools/inspector-monitor';
|
||||||
import { formSchema, uiSchema, defaultFormData } from './templateForm';
|
import { formSchema, uiSchema, defaultFormData } from './templateForm';
|
||||||
import TestGenerator from './TestGenerator';
|
import TestGenerator from './TestGenerator';
|
||||||
import jestTemplate from './redux/jest/template';
|
import jestTemplate from './redux/jest/template';
|
||||||
|
|
|
@ -9,8 +9,8 @@ It's integrated in Redux DevTools browser extension. To use it separately with [
|
||||||
```js
|
```js
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { createDevTools } from '@redux-devtools/core';
|
import { createDevTools } from '@redux-devtools/core';
|
||||||
import InspectorMonitor from 'redux-devtools-inspector-monitor';
|
import InspectorMonitor from '@redux-devtools/inspector-monitor';
|
||||||
import TraceTab from 'redux-devtools-inspector-monitor-trace-tab';
|
import TraceTab from '@redux-devtools/inspector-monitor-trace-tab';
|
||||||
|
|
||||||
export default createDevTools(
|
export default createDevTools(
|
||||||
<Inspector
|
<Inspector
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"name": "redux-devtools-inspector-monitor-trace-tab",
|
"name": "@redux-devtools/inspector-monitor-trace-tab",
|
||||||
"version": "0.1.3",
|
"version": "0.1.3",
|
||||||
"description": "Submonitor for Redux DevTools inspector to show stack traces.",
|
"description": "Submonitor for Redux DevTools inspector to show stack traces.",
|
||||||
"homepage": "https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-inspector-monitor-trace-tab",
|
"homepage": "https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-inspector-monitor-trace-tab",
|
||||||
|
@ -37,6 +37,7 @@
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@redux-devtools/core": "^3.7.0",
|
"@redux-devtools/core": "^3.7.0",
|
||||||
|
"@redux-devtools/inspector-monitor": "^0.14.0",
|
||||||
"@types/babel__code-frame": "^7.0.2",
|
"@types/babel__code-frame": "^7.0.2",
|
||||||
"@types/enzyme": "^3.10.5",
|
"@types/enzyme": "^3.10.5",
|
||||||
"@types/enzyme-adapter-react-16": "^1.0.6",
|
"@types/enzyme-adapter-react-16": "^1.0.6",
|
||||||
|
@ -49,13 +50,12 @@
|
||||||
"react": "^16.13.1",
|
"react": "^16.13.1",
|
||||||
"react-dom": "^16.13.1",
|
"react-dom": "^16.13.1",
|
||||||
"react-test-renderer": "^16.13.1",
|
"react-test-renderer": "^16.13.1",
|
||||||
"redux": "^4.0.5",
|
"redux": "^4.0.5"
|
||||||
"redux-devtools-inspector-monitor": "^0.14.0"
|
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
|
"@redux-devtools/inspector-monitor": "^0.14.0",
|
||||||
"@types/react": "^16.3.18",
|
"@types/react": "^16.3.18",
|
||||||
"react": "^16.3.0",
|
"react": "^16.3.0",
|
||||||
"redux": "^3.4.0 || ^4.0.0",
|
"redux": "^3.4.0 || ^4.0.0"
|
||||||
"redux-devtools-inspector-monitor": "^0.14.0"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -4,7 +4,7 @@ import { getStackFrames } from './react-error-overlay/utils/getStackFrames';
|
||||||
import StackTrace from './react-error-overlay/containers/StackTrace';
|
import StackTrace from './react-error-overlay/containers/StackTrace';
|
||||||
import openFile from './openFile';
|
import openFile from './openFile';
|
||||||
import { Action } from 'redux';
|
import { Action } from 'redux';
|
||||||
import { TabComponentProps } from 'redux-devtools-inspector-monitor';
|
import { TabComponentProps } from '@redux-devtools/inspector-monitor';
|
||||||
import StackFrame from './react-error-overlay/utils/stack-frame';
|
import StackFrame from './react-error-overlay/utils/stack-frame';
|
||||||
import { ErrorLocation } from './react-error-overlay/utils/parseCompileError';
|
import { ErrorLocation } from './react-error-overlay/utils/parseCompileError';
|
||||||
|
|
||||||
|
|
|
@ -9,7 +9,7 @@ A state monitor for [Redux DevTools](https://github.com/reduxjs/redux-devtools)
|
||||||
### Installation
|
### Installation
|
||||||
|
|
||||||
```
|
```
|
||||||
yarn add redux-devtools-inspector-monitor
|
yarn add @redux-devtools/inspector-monitor
|
||||||
```
|
```
|
||||||
|
|
||||||
### Usage
|
### Usage
|
||||||
|
@ -21,15 +21,15 @@ You can use `Inspector` as the only monitor in your app:
|
||||||
```js
|
```js
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { createDevTools } from '@redux-devtools/core';
|
import { createDevTools } from '@redux-devtools/core';
|
||||||
import Inspector from 'redux-devtools-inspector-monitor';
|
import Inspector from '@redux-devtools/inspector-monitor';
|
||||||
|
|
||||||
export default createDevTools(<Inspector />);
|
export default createDevTools(<Inspector />);
|
||||||
```
|
```
|
||||||
|
|
||||||
Then you can render `<DevTools>` to any place inside app or even into a separate popup window.
|
Then you can render `<DevTools>` to any place inside app or even into a separate popup window.
|
||||||
|
|
||||||
Alternative, you can use it together with [`DockMonitor`](https://github.com/gaearon/redux-devtools-dock-monitor) to make it dockable.
|
Alternative, you can use it together with [`DockMonitor`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-dock-monitor) to make it dockable.
|
||||||
Consult the [`DockMonitor` README](https://github.com/gaearon/redux-devtools-dock-monitor) for details of this approach.
|
Consult the [`DockMonitor` README](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-dock-monitor) for details of this approach.
|
||||||
|
|
||||||
[Read how to start using Redux DevTools.](https://github.com/gaearon/redux-devtools)
|
[Read how to start using Redux DevTools.](https://github.com/gaearon/redux-devtools)
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import { createDevTools } from '@redux-devtools/core';
|
import { createDevTools } from '@redux-devtools/core';
|
||||||
import DockMonitor from 'redux-devtools-dock-monitor';
|
import DockMonitor from '@redux-devtools/dock-monitor';
|
||||||
import { Location } from 'history';
|
import { Location } from 'history';
|
||||||
import DevtoolsInspector from '../../../src/DevtoolsInspector';
|
import DevtoolsInspector from '../../../src/DevtoolsInspector';
|
||||||
import getOptions from './getOptions';
|
import getOptions from './getOptions';
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"name": "redux-devtools-inspector-monitor",
|
"name": "@redux-devtools/inspector-monitor",
|
||||||
"version": "0.14.0",
|
"version": "0.14.0",
|
||||||
"description": "Redux DevTools Diff Monitor",
|
"description": "Redux DevTools Diff Monitor",
|
||||||
"homepage": "https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-inspector-monitor",
|
"homepage": "https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-inspector-monitor",
|
||||||
|
@ -54,6 +54,7 @@
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@redux-devtools/core": "^3.7.0",
|
"@redux-devtools/core": "^3.7.0",
|
||||||
|
"@redux-devtools/dock-monitor": "^1.2.0",
|
||||||
"@types/dateformat": "^3.0.1",
|
"@types/dateformat": "^3.0.1",
|
||||||
"@types/hex-rgba": "^1.0.0",
|
"@types/hex-rgba": "^1.0.0",
|
||||||
"@types/history": "^4.7.7",
|
"@types/history": "^4.7.7",
|
||||||
|
@ -73,7 +74,6 @@
|
||||||
"react-redux": "^7.2.1",
|
"react-redux": "^7.2.1",
|
||||||
"react-router": "^5.2.0",
|
"react-router": "^5.2.0",
|
||||||
"redux": "^4.0.5",
|
"redux": "^4.0.5",
|
||||||
"redux-devtools-dock-monitor": "^1.2.0",
|
|
||||||
"redux-logger": "^3.0.6",
|
"redux-logger": "^3.0.6",
|
||||||
"seamless-immutable": "^7.1.4"
|
"seamless-immutable": "^7.1.4"
|
||||||
},
|
},
|
||||||
|
|
|
@ -41,7 +41,7 @@ export default function configureStore(initialState) {
|
||||||
`instrument(monitorReducer, [options])`
|
`instrument(monitorReducer, [options])`
|
||||||
|
|
||||||
- arguments
|
- arguments
|
||||||
- **monitorReducer** _function_ called whenever an action is dispatched ([see the example of a monitor reducer](https://github.com/gaearon/redux-devtools-log-monitor/blob/master/src/reducers.js#L13)).
|
- **monitorReducer** _function_ called whenever an action is dispatched ([see the example of a monitor reducer](https://github.com/reduxjs/redux-devtools/blob/master/packages/redux-devtools-log-monitor/src/reducers.ts#L34)).
|
||||||
- **options** _object_
|
- **options** _object_
|
||||||
- **maxAge** _number_ or _function_(currentLiftedAction, previousLiftedState) - maximum allowed actions to be stored on the history tree, the oldest actions are removed once `maxAge` is reached. Can be generated dynamically with a function getting current action as argument.
|
- **maxAge** _number_ or _function_(currentLiftedAction, previousLiftedState) - maximum allowed actions to be stored on the history tree, the oldest actions are removed once `maxAge` is reached. Can be generated dynamically with a function getting current action as argument.
|
||||||
- **shouldCatchErrors** _boolean_ - if specified as `true`, whenever there's an exception in reducers, the monitors will show the error message, and next actions will not be dispatched.
|
- **shouldCatchErrors** _boolean_ - if specified as `true`, whenever there's an exception in reducers, the monitors will show the error message, and next actions will not be dispatched.
|
||||||
|
|
|
@ -8,7 +8,7 @@ It shows a log of states and actions, and lets you change their history. Created
|
||||||
### Installation
|
### Installation
|
||||||
|
|
||||||
```
|
```
|
||||||
npm install --save-dev redux-devtools-log-monitor
|
yarn add @redux-devtools/log-monitor
|
||||||
```
|
```
|
||||||
|
|
||||||
### Usage
|
### Usage
|
||||||
|
@ -20,15 +20,15 @@ You can use `LogMonitor` as the only monitor in your app:
|
||||||
```js
|
```js
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { createDevTools } from '@redux-devtools/core';
|
import { createDevTools } from '@redux-devtools/core';
|
||||||
import LogMonitor from 'redux-devtools-log-monitor';
|
import LogMonitor from '@redux-devtools/log-monitor';
|
||||||
|
|
||||||
export default createDevTools(<LogMonitor />);
|
export default createDevTools(<LogMonitor />);
|
||||||
```
|
```
|
||||||
|
|
||||||
Then you can render `<DevTools>` to any place inside app or even into a separate popup window.
|
Then you can render `<DevTools>` to any place inside app or even into a separate popup window.
|
||||||
|
|
||||||
Alternative, you can use it together with [`DockMonitor`](https://github.com/gaearon/redux-devtools-dock-monitor) to make it dockable.
|
Alternative, you can use it together with [`DockMonitor`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-dock-monitor) to make it dockable.
|
||||||
Consult the [`DockMonitor` README](https://github.com/gaearon/redux-devtools-dock-monitor) for details of this approach.
|
Consult the [`DockMonitor` README](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-dock-monitor) for details of this approach.
|
||||||
|
|
||||||
[Read how to start using Redux DevTools.](https://github.com/reduxjs/redux-devtools)
|
[Read how to start using Redux DevTools.](https://github.com/reduxjs/redux-devtools)
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"name": "redux-devtools-log-monitor",
|
"name": "@redux-devtools/log-monitor",
|
||||||
"version": "2.1.0",
|
"version": "2.1.0",
|
||||||
"description": "The default tree view monitor for Redux DevTools",
|
"description": "The default tree view monitor for Redux DevTools",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
|
|
|
@ -3,7 +3,7 @@
|
||||||
### Installation
|
### Installation
|
||||||
|
|
||||||
```
|
```
|
||||||
yarn add redux-devtools-serialize
|
yarn add @redux-devtools/serialize
|
||||||
```
|
```
|
||||||
|
|
||||||
### Usage with ImmutableJS data structures
|
### Usage with ImmutableJS data structures
|
||||||
|
@ -12,7 +12,7 @@ Just pass the Immutable library to our class:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
import Immutable from 'immutable';
|
import Immutable from 'immutable';
|
||||||
import Serialize from 'redux-devtools-serialize';
|
import Serialize from '@redux-devtools/serialize';
|
||||||
const { stringify, parse } = Serialize.immutable(Immutable);
|
const { stringify, parse } = Serialize.immutable(Immutable);
|
||||||
|
|
||||||
const data = Immutable.fromJS({ foo: 'bar', baz: { qux: 42 } });
|
const data = Immutable.fromJS({ foo: 'bar', baz: { qux: 42 } });
|
||||||
|
@ -32,7 +32,7 @@ To parse a Record class back, you need to specify a reference to it:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
import Immutable from 'immutable';
|
import Immutable from 'immutable';
|
||||||
import Serialize from 'redux-devtools-serialize';
|
import Serialize from '@redux-devtools/serialize';
|
||||||
|
|
||||||
const ABRecord = Immutable.Record({ a: 1, b: 2 });
|
const ABRecord = Immutable.Record({ a: 1, b: 2 });
|
||||||
const { stringify, parse } = Serialize.immutable(Immutable, [ABRecord]);
|
const { stringify, parse } = Serialize.immutable(Immutable, [ABRecord]);
|
||||||
|
@ -52,7 +52,7 @@ You can pass custom replacer and reviver functions to Serialize:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
import Immutable from 'immutable';
|
import Immutable from 'immutable';
|
||||||
import Serialize from 'redux-devtools-serialize';
|
import Serialize from '@redux-devtools/serialize';
|
||||||
|
|
||||||
function customReplacer(key, value, defaultReplacer) {
|
function customReplacer(key, value, defaultReplacer) {
|
||||||
if (value === 1) {
|
if (value === 1) {
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"name": "redux-devtools-serialize",
|
"name": "@redux-devtools/serialize",
|
||||||
"version": "0.2.0",
|
"version": "0.2.0",
|
||||||
"description": "Serialize unserializable data and parse it back.",
|
"description": "Serialize unserializable data and parse it back.",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
|
|
|
@ -12,11 +12,11 @@ It uses a slider based on [react-slider](https://github.com/mpowaga/react-slider
|
||||||
|
|
||||||
### Installation
|
### Installation
|
||||||
|
|
||||||
`yarn add redux-devtools-slider-monitor`
|
`yarn add @redux-devtools/slider-monitor`
|
||||||
|
|
||||||
### Recommended Usage
|
### Recommended Usage
|
||||||
|
|
||||||
Use with [`DockMonitor`](https://github.com/gaearon/redux-devtools-dock-monitor)
|
Use with [`DockMonitor`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-dock-monitor)
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
<DockMonitor
|
<DockMonitor
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { createDevTools } from '@redux-devtools/core';
|
import { createDevTools } from '@redux-devtools/core';
|
||||||
import DockMonitor from 'redux-devtools-dock-monitor';
|
import DockMonitor from '@redux-devtools/dock-monitor';
|
||||||
import SliderMonitor from 'redux-devtools-slider-monitor';
|
import SliderMonitor from '@redux-devtools/slider-monitor';
|
||||||
|
|
||||||
export default createDevTools(
|
export default createDevTools(
|
||||||
<DockMonitor
|
<DockMonitor
|
||||||
|
|
|
@ -16,15 +16,15 @@
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@redux-devtools/core": "^3.7.0",
|
"@redux-devtools/core": "^3.7.0",
|
||||||
|
"@redux-devtools/dock-monitor": "^1.2.0",
|
||||||
|
"@redux-devtools/log-monitor": "^2.1.0",
|
||||||
|
"@redux-devtools/slider-monitor": "^2.0.0-5",
|
||||||
"classnames": "^2.2.6",
|
"classnames": "^2.2.6",
|
||||||
"react": "^16.13.1",
|
"react": "^16.13.1",
|
||||||
"react-dom": "^16.13.1",
|
"react-dom": "^16.13.1",
|
||||||
"react-hot-loader": "^4.12.21",
|
"react-hot-loader": "^4.12.21",
|
||||||
"react-redux": "^7.2.1",
|
"react-redux": "^7.2.1",
|
||||||
"redux": "^4.0.5",
|
"redux": "^4.0.5",
|
||||||
"redux-devtools-dock-monitor": "^1.2.0",
|
|
||||||
"redux-devtools-log-monitor": "^2.1.0",
|
|
||||||
"redux-devtools-slider-monitor": "^2.0.0-5",
|
|
||||||
"todomvc-app-css": "^2.3.0"
|
"todomvc-app-css": "^2.3.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{
|
{
|
||||||
"name": "redux-devtools-slider-monitor",
|
"name": "@redux-devtools/slider-monitor",
|
||||||
"version": "2.0.0-5",
|
"version": "2.0.0-5",
|
||||||
"description": "A custom monitor for replaying Redux actions that works similarly to a video player",
|
"description": "A custom monitor for replaying Redux actions that works similarly to a video player",
|
||||||
"homepage": "https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-slider-monitor",
|
"homepage": "https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-slider-monitor",
|
||||||
|
|
|
@ -31,9 +31,9 @@ A live-editing time travel environment for [Redux](https://github.com/reactjs/re
|
||||||
|
|
||||||
### Overview
|
### Overview
|
||||||
|
|
||||||
Redux DevTools is a development time package that provides power-ups for your Redux development workflow. Be careful to strip its code in production (see [walkthrough](../../docs/Walkthrough.md) for instructions)! To use Redux DevTools, you need to choose a “monitor”—a React component that will serve as a UI for the DevTools. Different tasks and workflows require different UIs, so Redux DevTools is built to be flexible in this regard. We recommend using [`LogMonitor`](https://github.com/gaearon/redux-devtools-log-monitor) for inspecting the state and time travel, and wrap it in a [`DockMonitor`](https://github.com/gaearon/redux-devtools-dock-monitor) to quickly move it across the screen. That said, when you’re comfortable rolling up your own setup, feel free to do this, and share it with us.
|
Redux DevTools is a development time package that provides power-ups for your Redux development workflow. Be careful to strip its code in production (see [walkthrough](../../docs/Walkthrough.md) for instructions)! To use Redux DevTools, you need to choose a “monitor”—a React component that will serve as a UI for the DevTools. Different tasks and workflows require different UIs, so Redux DevTools is built to be flexible in this regard. We recommend using [`LogMonitor`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-log-monitor) for inspecting the state and time travel, and wrap it in a [`DockMonitor`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-dock-monitor) to quickly move it across the screen. That said, when you’re comfortable rolling up your own setup, feel free to do this, and share it with us.
|
||||||
|
|
||||||
If you came here looking for what do the “Reset”, “Revert”, “Sweep” or “Commit” buttons do, check out [the `LogMonitor` documentation](https://github.com/gaearon/redux-devtools-log-monitor/blob/master/README.md#features).
|
If you came here looking for what do the “Reset”, “Revert”, “Sweep” or “Commit” buttons do, check out [the `LogMonitor` documentation](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-log-monitor#features).
|
||||||
|
|
||||||
### Browser Extension
|
### Browser Extension
|
||||||
|
|
||||||
|
@ -78,7 +78,7 @@ Also try opening `http://localhost:3000/?debug_session=123`, click around, and t
|
||||||
|
|
||||||
### Custom Monitors
|
### Custom Monitors
|
||||||
|
|
||||||
**DevTools accepts monitor components so you can build a completely custom UI.** [`LogMonitor`](https://github.com/gaearon/redux-devtools-log-monitor) and [`DockMonitor`](https://github.com/gaearon/redux-devtools-dock-monitor) are just examples of what is possible.
|
**DevTools accepts monitor components so you can build a completely custom UI.** [`LogMonitor`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-log-monitor) and [`DockMonitor`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-dock-monitor) are just examples of what is possible.
|
||||||
|
|
||||||
**[I challenge you to build a custom monitor for Redux DevTools!](https://github.com/reduxjs/redux-devtools/issues/3)**
|
**[I challenge you to build a custom monitor for Redux DevTools!](https://github.com/reduxjs/redux-devtools/issues/3)**
|
||||||
|
|
||||||
|
@ -87,7 +87,7 @@ Some crazy ideas for custom monitors:
|
||||||
- A slider that lets you jump between computed states just by dragging it
|
- A slider that lets you jump between computed states just by dragging it
|
||||||
- An in-app layer that shows the last N states right in the app (e.g. for animation)
|
- An in-app layer that shows the last N states right in the app (e.g. for animation)
|
||||||
- A time machine like interface where the last N states of your app reside on different Z layers
|
- A time machine like interface where the last N states of your app reside on different Z layers
|
||||||
- Feel free to come up with and implement your own! Check [`LogMonitor`](https://github.com/gaearon/redux-devtools-log-monitor) `propTypes` to see what you can do.
|
- Feel free to come up with and implement your own! Check [`LogMonitor`](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-log-monitor) `propTypes` to see what you can do.
|
||||||
|
|
||||||
In fact some of these are implemented already:
|
In fact some of these are implemented already:
|
||||||
|
|
||||||
|
@ -107,7 +107,7 @@ In fact some of these are implemented already:
|
||||||
|
|
||||||
![redux-devtools-filterable-log-monitor](https://cloud.githubusercontent.com/assets/29597/12440009/182bb31c-beec-11e5-8fd0-bdda48e646b2.gif)
|
![redux-devtools-filterable-log-monitor](https://cloud.githubusercontent.com/assets/29597/12440009/182bb31c-beec-11e5-8fd0-bdda48e646b2.gif)
|
||||||
|
|
||||||
#### [Chart Monitor](https://github.com/romseguy/redux-devtools-chart-monitor)
|
#### [Chart Monitor](https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-chart-monitor)
|
||||||
|
|
||||||
![redux-devtools-chart-monitor](http://i.imgur.com/MSgvU6l.gif)
|
![redux-devtools-chart-monitor](http://i.imgur.com/MSgvU6l.gif)
|
||||||
|
|
||||||
|
|
|
@ -20,14 +20,14 @@
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@redux-devtools/core": "^3.7.0",
|
"@redux-devtools/core": "^3.7.0",
|
||||||
|
"@redux-devtools/dock-monitor": "^1.2.0",
|
||||||
|
"@redux-devtools/log-monitor": "^2.1.0",
|
||||||
"prop-types": "^15.7.2",
|
"prop-types": "^15.7.2",
|
||||||
"react": "^16.13.1",
|
"react": "^16.13.1",
|
||||||
"react-dom": "^16.13.1",
|
"react-dom": "^16.13.1",
|
||||||
"react-hot-loader": "^4.12.21",
|
"react-hot-loader": "^4.12.21",
|
||||||
"react-redux": "^7.2.1",
|
"react-redux": "^7.2.1",
|
||||||
"redux": "^4.0.5",
|
"redux": "^4.0.5",
|
||||||
"redux-devtools-dock-monitor": "^1.2.0",
|
|
||||||
"redux-devtools-log-monitor": "^2.1.0",
|
|
||||||
"redux-thunk": "^2.3.0"
|
"redux-thunk": "^2.3.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { createDevTools } from '@redux-devtools/core';
|
import { createDevTools } from '@redux-devtools/core';
|
||||||
import LogMonitor from 'redux-devtools-log-monitor';
|
import LogMonitor from '@redux-devtools/log-monitor';
|
||||||
import DockMonitor from 'redux-devtools-dock-monitor';
|
import DockMonitor from '@redux-devtools/dock-monitor';
|
||||||
|
|
||||||
export default createDevTools(
|
export default createDevTools(
|
||||||
<DockMonitor toggleVisibilityKey="ctrl-h" changePositionKey="ctrl-q">
|
<DockMonitor toggleVisibilityKey="ctrl-h" changePositionKey="ctrl-q">
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { createDevTools } from '@redux-devtools/core';
|
import { createDevTools } from '@redux-devtools/core';
|
||||||
import LogMonitor from 'redux-devtools-log-monitor';
|
import LogMonitor from '@redux-devtools/log-monitor';
|
||||||
import DockMonitor from 'redux-devtools-dock-monitor';
|
import DockMonitor from '@redux-devtools/dock-monitor';
|
||||||
|
|
||||||
export default createDevTools(
|
export default createDevTools(
|
||||||
<DockMonitor toggleVisibilityKey="ctrl-h" changePositionKey="ctrl-q">
|
<DockMonitor toggleVisibilityKey="ctrl-h" changePositionKey="ctrl-q">
|
||||||
|
|
|
@ -32,6 +32,8 @@
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@redux-devtools/core": "^3.7.0",
|
"@redux-devtools/core": "^3.7.0",
|
||||||
|
"@redux-devtools/dock-monitor": "^1.2.0",
|
||||||
|
"@redux-devtools/log-monitor": "^2.1.0",
|
||||||
"classnames": "^2.2.6",
|
"classnames": "^2.2.6",
|
||||||
"prop-types": "^15.7.2",
|
"prop-types": "^15.7.2",
|
||||||
"react": "^16.13.1",
|
"react": "^16.13.1",
|
||||||
|
@ -39,8 +41,6 @@
|
||||||
"react-hot-loader": "^4.12.21",
|
"react-hot-loader": "^4.12.21",
|
||||||
"react-redux": "^7.2.1",
|
"react-redux": "^7.2.1",
|
||||||
"redux": "^4.0.5",
|
"redux": "^4.0.5",
|
||||||
"redux-devtools-dock-monitor": "^1.2.0",
|
|
||||||
"redux-devtools-log-monitor": "^2.1.0",
|
|
||||||
"todomvc-app-css": "^2.3.0"
|
"todomvc-app-css": "^2.3.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|
Loading…
Reference in New Issue
Block a user