diff --git a/packages/redux-devtools-extension/.babelrc b/packages/redux-devtools-extension/.babelrc new file mode 100644 index 00000000..3313ff9e --- /dev/null +++ b/packages/redux-devtools-extension/.babelrc @@ -0,0 +1,3 @@ +{ + "presets": ["@babel/preset-env", "@babel/preset-typescript"] +} diff --git a/packages/redux-devtools-extension/.eslintignore b/packages/redux-devtools-extension/.eslintignore new file mode 100644 index 00000000..a65b4177 --- /dev/null +++ b/packages/redux-devtools-extension/.eslintignore @@ -0,0 +1 @@ +lib diff --git a/packages/redux-devtools-extension/.eslintrc.js b/packages/redux-devtools-extension/.eslintrc.js new file mode 100644 index 00000000..090f9e70 --- /dev/null +++ b/packages/redux-devtools-extension/.eslintrc.js @@ -0,0 +1,7 @@ +module.exports = { + extends: '../../eslintrc.ts.base.json', + parserOptions: { + tsconfigRootDir: __dirname, + project: ['./tsconfig.json'], + }, +}; diff --git a/packages/redux-devtools-extension/README.md b/packages/redux-devtools-extension/README.md index f45f6e88..090d64af 100644 --- a/packages/redux-devtools-extension/README.md +++ b/packages/redux-devtools-extension/README.md @@ -7,14 +7,14 @@ Install: ``` -npm install --save redux-devtools-extension +yarn add @redux-devtools/extension ``` and use like that: ```js import { createStore, applyMiddleware } from 'redux'; -import { composeWithDevTools } from 'redux-devtools-extension'; +import { composeWithDevTools } from '@redux-devtools/extension'; const store = createStore( reducer, @@ -25,11 +25,11 @@ const store = createStore( ); ``` -or if needed to apply [extension’s options](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Arguments.md#windowdevtoolsextensionconfig): +or if needed to apply [extension’s options](https://github.com/reduxjs/redux-devtools/blob/main/extension/docs/API/Arguments.md): ```js import { createStore, applyMiddleware } from 'redux'; -import { composeWithDevTools } from 'redux-devtools-extension'; +import { composeWithDevTools } from '@redux-devtools/extension'; const composeEnhancers = composeWithDevTools({ // Specify here name, actionsDenylist, actionsCreators and other options @@ -43,7 +43,7 @@ const store = createStore( ); ``` -There’re just [few lines of code](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/npm-package/index.js). If you don’t want to allow the extension in production, just use ‘redux-devtools-extension/developmentOnly’ instead of ‘redux-devtools-extension’. +There’re just [few lines of code](https://github.com/reduxjs/redux-devtools/blob/main/packages/redux-devtools-extension/src/index.ts). If you don’t want to allow the extension in production, just use ‘@redux-devtools/extension/lib/developmentOnly’ instead of ‘@redux-devtools/extension’. ## License diff --git a/packages/redux-devtools-extension/developmentOnly.d.ts b/packages/redux-devtools-extension/developmentOnly.d.ts deleted file mode 100644 index e45b4859..00000000 --- a/packages/redux-devtools-extension/developmentOnly.d.ts +++ /dev/null @@ -1 +0,0 @@ -export * from 'redux-devtools-extension'; diff --git a/packages/redux-devtools-extension/index.js b/packages/redux-devtools-extension/index.js deleted file mode 100644 index 02fca412..00000000 --- a/packages/redux-devtools-extension/index.js +++ /dev/null @@ -1,22 +0,0 @@ -'use strict'; - -var compose = require('redux').compose; - -exports.__esModule = true; -exports.composeWithDevTools = - typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ - ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ - : function () { - if (arguments.length === 0) return undefined; - if (typeof arguments[0] === 'object') return compose; - return compose.apply(null, arguments); - }; - -exports.devToolsEnhancer = - typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ - ? window.__REDUX_DEVTOOLS_EXTENSION__ - : function () { - return function (noop) { - return noop; - }; - }; diff --git a/packages/redux-devtools-extension/logOnly.d.ts b/packages/redux-devtools-extension/logOnly.d.ts deleted file mode 100644 index e45b4859..00000000 --- a/packages/redux-devtools-extension/logOnly.d.ts +++ /dev/null @@ -1 +0,0 @@ -export * from 'redux-devtools-extension'; diff --git a/packages/redux-devtools-extension/logOnlyInProduction.d.ts b/packages/redux-devtools-extension/logOnlyInProduction.d.ts deleted file mode 100644 index e45b4859..00000000 --- a/packages/redux-devtools-extension/logOnlyInProduction.d.ts +++ /dev/null @@ -1 +0,0 @@ -export * from 'redux-devtools-extension'; diff --git a/packages/redux-devtools-extension/package.json b/packages/redux-devtools-extension/package.json index 48917b57..80be93f1 100644 --- a/packages/redux-devtools-extension/package.json +++ b/packages/redux-devtools-extension/package.json @@ -1,15 +1,39 @@ { - "name": "redux-devtools-extension", + "name": "@redux-devtools/extension", "version": "2.13.9", "description": "Wrappers for Redux DevTools Extension.", - "main": "index.js", + "homepage": "https://github.com/reduxjs/redux-devtools/tree/master/packages/redux-devtools-extension", + "license": "MIT", + "author": "Mihail Diordiev (https://github.com/zalmoxisus)", + "main": "lib/index.js", + "types": "lib/index.d.ts", "repository": { "type": "git", - "url": "https://github.com/zalmoxisus/redux-devtools-extension" + "url": "https://github.com/reduxjs/redux-devtools" + }, + "scripts": { + "build": "yarn run build:types && yarn run build:js", + "build:types": "tsc --emitDeclarationOnly", + "build:js": "babel src --out-dir lib --extensions \".ts\" --source-maps inline", + "clean": "rimraf lib", + "lint": "eslint . --ext .ts", + "type-check": "tsc --noEmit", + "prepack": "yarn run clean && yarn run build", + "prepublish": "yarn run type-check && yarn run lint" + }, + "devDependencies": { + "@babel/cli": "^7.16.0", + "@babel/core": "^7.16.0", + "@babel/preset-env": "^7.16.0", + "@babel/preset-typescript": "^7.16.0", + "@typescript-eslint/eslint-plugin": "^5.2.0", + "@typescript-eslint/parser": "^5.2.0", + "eslint": "^7.32.0", + "eslint-config-prettier": "^8.3.0", + "redux": "^4.1.2", + "rimraf": "^3.0.2", + "typescript": "~4.4.4" }, - "homepage": "https://github.com/zalmoxisus/redux-devtools-extension", - "author": "Mihail Diordiev (https://github.com/zalmoxisus)", - "license": "MIT", "peerDependencies": { "redux": "^3.1.0 || ^4.0.0" } diff --git a/packages/redux-devtools-extension/developmentOnly.js b/packages/redux-devtools-extension/src/developmentOnly.ts similarity index 72% rename from packages/redux-devtools-extension/developmentOnly.js rename to packages/redux-devtools-extension/src/developmentOnly.ts index 0294f1f9..45454aba 100644 --- a/packages/redux-devtools-extension/developmentOnly.js +++ b/packages/redux-devtools-extension/src/developmentOnly.ts @@ -1,9 +1,9 @@ -'use strict'; +import { compose, StoreEnhancer } from 'redux'; +import { EnhancerOptions } from './index'; -var compose = require('redux').compose; +declare const process: any; -exports.__esModule = true; -exports.composeWithDevTools = +export const composeWithDevTools = process.env.NODE_ENV !== 'production' && typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ @@ -14,7 +14,7 @@ exports.composeWithDevTools = return compose.apply(null, arguments); }; -exports.devToolsEnhancer = +export const devToolsEnhancer: (options?: EnhancerOptions) => StoreEnhancer = process.env.NODE_ENV !== 'production' && typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ diff --git a/packages/redux-devtools-extension/index.d.ts b/packages/redux-devtools-extension/src/index.ts similarity index 88% rename from packages/redux-devtools-extension/index.d.ts rename to packages/redux-devtools-extension/src/index.ts index 9a22484d..59f958c0 100644 --- a/packages/redux-devtools-extension/index.d.ts +++ b/packages/redux-devtools-extension/src/index.ts @@ -1,4 +1,4 @@ -import { Action, ActionCreator, StoreEnhancer, compose } from 'redux'; +import { Action, ActionCreator, compose, StoreEnhancer } from 'redux'; export interface EnhancerOptions { /** @@ -43,6 +43,7 @@ export interface EnhancerOptions { symbol?: boolean; map?: boolean; set?: boolean; + // eslint-disable-next-line @typescript-eslint/ban-types function?: boolean | Function; }; /** @@ -179,8 +180,26 @@ export interface EnhancerOptions { traceLimit?: number; } -export function composeWithDevTools( - ...funcs: Array> -): StoreEnhancer; -export function composeWithDevTools(options: EnhancerOptions): typeof compose; -export function devToolsEnhancer(options: EnhancerOptions): StoreEnhancer; +declare global { + interface Window { + __REDUX_DEVTOOLS_EXTENSION__?: (options?: EnhancerOptions) => StoreEnhancer; + } +} + +export const composeWithDevTools = + typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ + ? window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ + : function () { + if (arguments.length === 0) return undefined; + if (typeof arguments[0] === 'object') return compose; + return compose.apply(null, arguments); + }; + +export const devToolsEnhancer: (options?: EnhancerOptions) => StoreEnhancer = + typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ + ? window.__REDUX_DEVTOOLS_EXTENSION__ + : function () { + return function (noop) { + return noop; + }; + }; diff --git a/packages/redux-devtools-extension/logOnly.js b/packages/redux-devtools-extension/src/logOnly.ts similarity index 70% rename from packages/redux-devtools-extension/logOnly.js rename to packages/redux-devtools-extension/src/logOnly.ts index 8aa4237b..c39ecb59 100644 --- a/packages/redux-devtools-extension/logOnly.js +++ b/packages/redux-devtools-extension/src/logOnly.ts @@ -1,10 +1,9 @@ -'use strict'; - -var assign = require('./utils/assign'); -var compose = require('redux').compose; +import assign from './utils/assign'; +import { compose, StoreEnhancer } from 'redux'; +import { EnhancerOptions } from './index'; function enhancer() { - var config = arguments[0] || {}; + const config = arguments[0] || {}; config.features = { pause: true, export: true, test: true }; config.type = 'redux'; if (config.autoPause === undefined) config.autoPause = true; @@ -12,14 +11,14 @@ function enhancer() { return function (createStore) { return function (reducer, preloadedState, enhancer) { - var store = createStore(reducer, preloadedState, enhancer); - var origDispatch = store.dispatch; + const store = createStore(reducer, preloadedState, enhancer); + const origDispatch = store.dispatch; - var devTools = window.__REDUX_DEVTOOLS_EXTENSION__.connect(config); + const devTools = window.__REDUX_DEVTOOLS_EXTENSION__.connect(config); devTools.init(store.getState()); - var dispatch = function (action) { - var r = origDispatch(action); + const dispatch = function (action) { + const r = origDispatch(action); devTools.send(action, store.getState()); return r; }; @@ -36,8 +35,7 @@ function composeWithEnhancer(config) { }; } -exports.__esModule = true; -exports.composeWithDevTools = function () { +export const composeWithDevTools = function () { if (typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__) { if (arguments.length === 0) return enhancer(); if (typeof arguments[0] === 'object') @@ -50,7 +48,7 @@ exports.composeWithDevTools = function () { return compose.apply(null, arguments); }; -exports.devToolsEnhancer = +export const devToolsEnhancer: (options?: EnhancerOptions) => StoreEnhancer = typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ ? enhancer : function () { diff --git a/packages/redux-devtools-extension/logOnlyInProduction.js b/packages/redux-devtools-extension/src/logOnlyInProduction.ts similarity index 71% rename from packages/redux-devtools-extension/logOnlyInProduction.js rename to packages/redux-devtools-extension/src/logOnlyInProduction.ts index 3c18b389..bb8027ea 100644 --- a/packages/redux-devtools-extension/logOnlyInProduction.js +++ b/packages/redux-devtools-extension/src/logOnlyInProduction.ts @@ -1,10 +1,10 @@ -'use strict'; +import { compose, StoreEnhancer } from 'redux'; +import * as logOnly from './logOnly'; +import { EnhancerOptions } from './index'; -var compose = require('redux').compose; -var logOnly = require('./logOnly'); +declare const process: any; -exports.__esModule = true; -exports.composeWithDevTools = +export const composeWithDevTools = process.env.NODE_ENV === 'production' ? logOnly.composeWithDevTools : typeof window !== 'undefined' && @@ -16,7 +16,7 @@ exports.composeWithDevTools = return compose.apply(null, arguments); }; -exports.devToolsEnhancer = +export const devToolsEnhancer: (options?: EnhancerOptions) => StoreEnhancer = process.env.NODE_ENV === 'production' ? logOnly.devToolsEnhancer : typeof window !== 'undefined' && window.__REDUX_DEVTOOLS_EXTENSION__ diff --git a/packages/redux-devtools-extension/src/utils/assign.ts b/packages/redux-devtools-extension/src/utils/assign.ts new file mode 100644 index 00000000..1b4f589a --- /dev/null +++ b/packages/redux-devtools-extension/src/utils/assign.ts @@ -0,0 +1,22 @@ +const objectKeys = + Object.keys || + function (obj) { + const keys = []; + for (const key in obj) { + if ({}.hasOwnProperty.call(obj, key)) keys.push(key); + } + return keys; + }; + +export default function assign(obj: {}, newKey, newValue) { + const keys = objectKeys(obj); + const copy = {}; + + for (let i = 0, l = keys.length; i < l; i++) { + const key = keys[i]; + copy[key] = obj[key]; + } + + copy[newKey] = newValue; + return copy; +} diff --git a/packages/redux-devtools-extension/tsconfig.json b/packages/redux-devtools-extension/tsconfig.json new file mode 100644 index 00000000..84575cb5 --- /dev/null +++ b/packages/redux-devtools-extension/tsconfig.json @@ -0,0 +1,7 @@ +{ + "extends": "../../tsconfig.base.json", + "compilerOptions": { + "outDir": "lib" + }, + "include": ["src"] +} diff --git a/packages/redux-devtools-extension/utils/assign.js b/packages/redux-devtools-extension/utils/assign.js deleted file mode 100644 index 75b70438..00000000 --- a/packages/redux-devtools-extension/utils/assign.js +++ /dev/null @@ -1,24 +0,0 @@ -var objectKeys = - Object.keys || - function (obj) { - var keys = []; - for (var key in obj) { - if ({}.hasOwnProperty.call(obj, key)) keys.push(key); - } - return keys; - }; - -function assign(obj, newKey, newValue) { - var keys = objectKeys(obj); - var copy = {}; - - for (var i = 0, l = keys.length; i < l; i++) { - var key = keys[i]; - copy[key] = obj[key]; - } - - copy[newKey] = newValue; - return copy; -} - -module.exports = assign; diff --git a/yarn.lock b/yarn.lock index 96ee14a7..6442ada4 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4780,6 +4780,26 @@ __metadata: languageName: unknown linkType: soft +"@redux-devtools/extension@workspace:packages/redux-devtools-extension": + version: 0.0.0-use.local + resolution: "@redux-devtools/extension@workspace:packages/redux-devtools-extension" + dependencies: + "@babel/cli": ^7.16.0 + "@babel/core": ^7.16.0 + "@babel/preset-env": ^7.16.0 + "@babel/preset-typescript": ^7.16.0 + "@typescript-eslint/eslint-plugin": ^5.2.0 + "@typescript-eslint/parser": ^5.2.0 + eslint: ^7.32.0 + eslint-config-prettier: ^8.3.0 + redux: ^4.1.2 + rimraf: ^3.0.2 + typescript: ~4.4.4 + peerDependencies: + redux: ^3.1.0 || ^4.0.0 + languageName: unknown + linkType: soft + "@redux-devtools/inspector-monitor-test-tab@^0.7.2, @redux-devtools/inspector-monitor-test-tab@workspace:packages/redux-devtools-inspector-monitor-test-tab": version: 0.0.0-use.local resolution: "@redux-devtools/inspector-monitor-test-tab@workspace:packages/redux-devtools-inspector-monitor-test-tab" @@ -24596,14 +24616,6 @@ fsevents@^1.2.7: languageName: node linkType: hard -"redux-devtools-extension@workspace:packages/redux-devtools-extension": - version: 0.0.0-use.local - resolution: "redux-devtools-extension@workspace:packages/redux-devtools-extension" - peerDependencies: - redux: ^3.1.0 || ^4.0.0 - languageName: unknown - linkType: soft - "redux-devtools-themes@npm:^1.0.0": version: 1.0.0 resolution: "redux-devtools-themes@npm:1.0.0"