feature: @putout/plugin-react-hooks: convert to ESM

Author: coderaiser

packages/plugin-react-hooks/lib/apply-short-fragment/index.js

@@ -1,6 +1,4 @@
-'use strict';
-
-const {types, operator} = require('putout');
+import {types, operator} from 'putout';
 
 const {
     JSXClosingFragment,
@@ -10,20 +8,20 @@ const {
 
 const {replaceWith} = operator;
 
-module.exports.report = () => `Apply shorthand syntax for 'Fragment'`;
+export const report = () => `Apply shorthand syntax for 'Fragment'`;
 
-module.exports.include = () => [
+export const include = () => [
     'JSXOpeningElement',
 ];
 
-module.exports.fix = (path) => {
+export const fix = (path) => {
     const {parentPath} = path;
     const {children} = path.parentPath.node;
 
     replaceWith(parentPath, JSXFragment(JSXOpeningFragment(), JSXClosingFragment(), children));
 };
 
-module.exports.filter = (path) => {
+export const filter = (path) => {
     if (path.node.attributes.length)
         return false;
 

packages/plugin-react-hooks/lib/apply-short-fragment/index.spec.js

@@ -1,9 +1,7 @@
-'use strict';
+import {createTest} from '@putout/test';
+import * as plugin from './index.js';
 
-const {createTest} = require('@putout/test');
-const plugin = require('.');
-
-const test = createTest(__dirname, {
+const test = createTest(import.meta.url, {
     plugins: [
         ['react-hooks/apply-short-fragment', plugin],
     ],

packages/plugin-react-hooks/lib/common.js

@@ -1,6 +1,4 @@
-'use strict';
-
-module.exports.traverseClass = (traverse, ast, visitor) => {
+export const traverseClass = (traverse, ast, visitor) => {
     traverse(ast, {
         'class __ extends React.Component {}': push(visitor),
         'class __ extends Component {}': push(visitor),

packages/plugin-react-hooks/lib/convert-class-to-function/class-to-function.js

@@ -1,6 +1,4 @@
-'use strict';
-
-const {types, operator} = require('putout');
+import {types, operator} from 'putout';
 
 const {replaceWith, remove} = operator;
 
@@ -10,7 +8,7 @@ const {
     functionDeclaration,
 } = types;
 
-module.exports = (path) => {
+export default (path) => {
     const {node} = path;
     const {body} = node;
 

packages/plugin-react-hooks/lib/convert-class-to-function/index.js

@@ -1,21 +1,18 @@
-'use strict';
-
-const {types} = require('putout');
-
-const classToFunction = require('./class-to-function');
-const {traverseClass} = require('../common');
+import {types} from 'putout';
+import classToFunction from './class-to-function.js';
+import {traverseClass} from '../common.js';
 
 const {isIdentifier, isClassMethod} = types;
 
-module.exports.report = ({name}) => {
+export const report = ({name}) => {
     return `class ${name} should be a function`;
 };
 
-module.exports.fix = ({path}) => {
+export const fix = ({path}) => {
     classToFunction(path);
 };
 
-module.exports.find = (ast, {push, traverse}) => {
+export const find = (ast, {push, traverse}) => {
     traverseClass(traverse, ast, {
         Identifier(path) {
             const {name} = path.node;

packages/plugin-react-hooks/lib/convert-class-to-function/index.spec.js

@@ -1,9 +1,7 @@
-'use strict';
+import {createTest} from '@putout/test';
+import * as convertClassToFunction from './index.js';
 
-const {createTest} = require('@putout/test');
-const convertClassToFunction = require('.');
-
-const test = createTest(__dirname, {
+const test = createTest(import.meta.url, {
     plugins: [
         ['convert-class-to-function', convertClassToFunction],
     ],

packages/plugin-react-hooks/lib/convert-component-to-use-state/index.js

@@ -1,18 +1,18 @@
-'use strict';
+import {types} from 'putout';
 
 const {
     isIdentifier,
     isObjectPattern,
-} = require('putout').types;
+} = types;
 
-module.exports.report = () => 'useState should be used instead of Component';
+export const report = () => 'useState should be used instead of Component';
 
-module.exports.fix = ({node}) => {
+export const fix = ({node}) => {
     node.key.name = 'useState';
     node.value.name = 'useState';
 };
 
-module.exports.find = (ast, {traverse}) => {
+export const find = (ast, {traverse}) => {
     const places = [];
 
     traverse(ast, {

packages/plugin-react-hooks/lib/convert-component-to-use-state/index.spec.js

@@ -1,9 +1,7 @@
-'use strict';
+import {createTest} from '@putout/test';
+import * as convertComponentToUseState from './index.js';
 
-const {createTest} = require('@putout/test');
-const convertComponentToUseState = require('.');
-
-const test = createTest(__dirname, {
+const test = createTest(import.meta.url, {
     plugins: [
         ['convert-component-to-use-state', convertComponentToUseState],
     ],

packages/plugin-react-hooks/lib/convert-import-component-to-use-state/index.js

@@ -1,13 +1,11 @@
-'use strict';
+export const report = () => 'useState should be used instead of Component';
 
-module.exports.report = () => 'useState should be used instead of Component';
-
-module.exports.fix = ({node}) => {
+export const fix = ({node}) => {
     node.imported.name = 'useState';
     node.local.name = 'useState';
 };
 
-module.exports.traverse = ({push}) => ({
+export const traverse = ({push}) => ({
     ImportDeclaration(path) {
         const {source} = path.node;
 

packages/plugin-react-hooks/lib/convert-import-component-to-use-state/index.spec.js

@@ -1,9 +1,7 @@
-'use strict';
+import {createTest} from '@putout/test';
+import * as convertImportComponentToUseState from './index.js';
 
-const {createTest} = require('@putout/test');
-const convertImportComponentToUseState = require('.');
-
-const test = createTest(__dirname, {
+const test = createTest(import.meta.url, {
     plugins: [
         ['convert-import-component-to-use-state', convertImportComponentToUseState],
     ],

packages/plugin-react-hooks/lib/convert-state-to-hooks/index.js

@@ -1,10 +1,7 @@
-'use strict';
-
-const {operator, types} = require('putout');
-
-const {traverseClass} = require('../common');
-const stateToHooks = require('./state-to-hooks');
-const setStateToHooks = require('./set-state-to-hooks');
+import {operator, types} from 'putout';
+import {traverseClass} from '../common.js';
+import stateToHooks from './state-to-hooks.js';
+import setStateToHooks from './set-state-to-hooks.js';
 
 const {
     isIdentifier,
@@ -15,7 +12,7 @@ const {
 
 const {remove} = operator;
 
-module.exports.report = (path) => {
+export const report = (path) => {
     if (isAssignmentExpression(path))
         return 'hooks should be used instead of this.state';
 
@@ -25,7 +22,7 @@ module.exports.report = (path) => {
     return 'hooks should be used instead of this.setState';
 };
 
-module.exports.fix = (path) => {
+export const fix = (path) => {
     if (isAssignmentExpression(path))
         return stateToHooks(path);
 
@@ -35,7 +32,7 @@ module.exports.fix = (path) => {
     return setStateToHooks(path);
 };
 
-module.exports.find = (ast, {push, traverse}) => {
+export const find = (ast, {push, traverse}) => {
     traverseClass(traverse, ast, {
         AssignmentExpression: (path) => {
             if (!path.get('left').isMemberExpression())

packages/plugin-react-hooks/lib/convert-state-to-hooks/index.spec.js

@@ -1,9 +1,7 @@
-'use strict';
+import {createTest} from '@putout/test';
+import * as convertStateToHooks from './index.js';
 
-const {createTest} = require('@putout/test');
-const convertStateToHooks = require('.');
-
-const test = createTest(__dirname, {
+const test = createTest(import.meta.url, {
     plugins: [
         ['convert-state-to-hooks', convertStateToHooks],
     ],

packages/plugin-react-hooks/lib/convert-state-to-hooks/set-state-to-hooks.js

@@ -1,14 +1,12 @@
-'use strict';
-
-const {template, operator} = require('putout');
+import {template, operator} from 'putout';
 
 const {replaceWithMultiple} = operator;
 
 const buildHooks = template(`
     SETTER(VALUE);
 `);
 
-module.exports = (path) => {
+export default (path) => {
     const {properties} = path.node.arguments[0];
     const nodes = [];
 

packages/plugin-react-hooks/lib/convert-state-to-hooks/state-to-hooks.js

@@ -1,14 +1,12 @@
-'use strict';
-
-const {template, operator} = require('putout');
+import {template, operator} from 'putout';
 
 const {replaceWithMultiple} = operator;
 
 const buildHooks = template(`
     const [NAME, SETTER] = useState(VALUE);
 `);
 
-module.exports = (path) => {
+export default (path) => {
     const {right} = path.node;
     const nodes = [];
 

packages/plugin-react-hooks/lib/declare/index.js

@@ -1,6 +1,4 @@
-'use strict';
-
-module.exports.declare = () => ({
+export const declare = () => ({
     useState: 'import {useState} from "react"',
     useEffect: 'import {useEffect} from "react"',
     useContext: 'import {useContext} from "react"',

packages/plugin-react-hooks/lib/declare/index.spec.js

@@ -1,9 +1,7 @@
-'use strict';
+import {createTest} from '@putout/test';
+import * as declare from './index.js';
 
-const {createTest} = require('@putout/test');
-const declare = require('.');
-
-const test = createTest(__dirname, {
+const test = createTest(import.meta.url, {
     plugins: [
         ['react-hooks/declare', declare],
     ],

packages/plugin-react-hooks/lib/react-hooks.js

@@ -1,17 +1,15 @@
-'use strict';
+import * as applyShortFragment from './apply-short-fragment/index.js';
+import * as declare from './declare/index.js';
+import * as renameMethodUnderScore from './rename-method-under-score/index.js';
+import * as convertStateToHooks from './convert-state-to-hooks/index.js';
+import * as removeBind from './remove-bind/index.js';
+import * as removeThis from './remove-this/index.js';
+import * as removeReact from './remove-react/index.js';
+import * as convertClassToFunction from './convert-class-to-function/index.js';
+import * as convertComponentToUseState from './convert-component-to-use-state/index.js';
+import * as convertImportComponentToUseState from './convert-import-component-to-use-state/index.js';
 
-const applyShortFragment = require('./apply-short-fragment');
-const declare = require('./declare');
-const renameMethodUnderScore = require('./rename-method-under-score');
-const convertStateToHooks = require('./convert-state-to-hooks');
-const removeBind = require('./remove-bind');
-const removeThis = require('./remove-this');
-const removeReact = require('./remove-react');
-const convertClassToFunction = require('./convert-class-to-function');
-const convertComponentToUseState = require('./convert-component-to-use-state');
-const convertImportComponentToUseState = require('./convert-import-component-to-use-state');
-
-module.exports.rules = {
+export const rules = {
     'apply-short-fragment': applyShortFragment,
     declare,
     'rename-method-under-score': renameMethodUnderScore,

packages/plugin-react-hooks/lib/remove-bind/index.js

@@ -1,17 +1,15 @@
-'use strict';
-
-const {operator} = require('putout');
-const {traverseClass} = require('../common');
+import {operator} from 'putout';
+import {traverseClass} from '../common.js';
 
 const {remove} = operator;
 
-module.exports.report = () => 'bind should not be used';
+export const report = () => 'bind should not be used';
 
-module.exports.fix = (path) => {
+export const fix = (path) => {
     remove(path);
 };
 
-module.exports.find = (ast, {traverse, push}) => {
+export const find = (ast, {traverse, push}) => {
     traverseClass(traverse, ast, {
         CallExpression(path) {
             const isBind = path.get('callee.property').isIdentifier({

packages/plugin-react-hooks/lib/remove-bind/index.spec.js

@@ -1,9 +1,7 @@
-'use strict';
+import {createTest} from '@putout/test';
+import * as removeBind from './index.js';
 
-const {createTest} = require('@putout/test');
-const removeBind = require('.');
-
-const test = createTest(__dirname, {
+const test = createTest(import.meta.url, {
     plugins: [
         ['remove-bind', removeBind],
     ],

packages/plugin-react-hooks/lib/remove-react/index.js

@@ -1,10 +1,8 @@
-'use strict';
-
 const reactNotUsed = (vars, path) => !path.scope.bindings.React?.referencePaths?.length;
 const isReactUsed = (path) => path.scope.bindings.React?.referencePaths?.length;
 
-module.exports.report = () => `Remove unused 'React' variable`;
-module.exports.match = () => ({
+export const report = () => `Remove unused 'React' variable`;
+export const match = () => ({
     'import * as React from "react"': reactNotUsed,
     'import React from "react"': reactNotUsed,
     'import __imports from "react"': ({__imports}, path) => {
@@ -15,7 +13,7 @@ module.exports.match = () => ({
     },
 });
 
-module.exports.replace = () => ({
+export const replace = () => ({
     'import * as React from "react"': '',
     'import React from "react"': '',
     'import __imports from "react"'({__imports}, path) {

packages/plugin-react-hooks/lib/remove-react/index.spec.js

@@ -1,9 +1,7 @@
-'use strict';
+import {createTest} from '@putout/test';
+import * as remove from './index.js';
 
-const {createTest} = require('@putout/test');
-const remove = require('.');
-
-const test = createTest(__dirname, {
+const test = createTest(import.meta.url, {
     plugins: [
         ['remove-react', remove],
     ],