babel-react-defaultprops - npm Package Compare versions

Comparing version 1.0.3 to 1.1.0

lib/plugin.js

@@ -5,11 +5,5 @@ "use strict";
 const utils_1 = require("./utils");
-const isValidPath = (path) => {
-    if (core_1.types.isExportNamedDeclaration(path.parent))
-        return true;
-    if (core_1.types.isExportDefaultDeclaration(path.parent))
-        return true;
-    if (core_1.types.isProgram(path.parent))
-        return true;
-    return false;
-};
+const get_function_declaration_props_1 = require("./get-function-declaration-props");
+const get_variable_declaration_props_1 = require("./get-variable-declaration-props");
+const get_props_form_path_1 = require("./get-props-form-path");
 function default_1() {
@@ -26,29 +20,25 @@ return {
                         FunctionDeclaration(path) {
-                            const { node } = path;
-                            if (!utils_1.isComponent(node) || !isValidPath(path))
+                            const propInfo = get_function_declaration_props_1.getFunctionDeclarationProps(path);
+                            if (!propInfo)
                                 return;
-                            const componentName = node.id.name;
-                            utils_1.getPropsAndInsert(path, node, componentName);
+                            utils_1.setDefaultProps(path, propInfo.componentName, propInfo.props);
                         },
                         VariableDeclaration(path) {
-                            const { node } = path;
-                            if (!node.declarations || node.declarations.length === 0) {
-                                return;
-                            }
-                            const declarationNode = node.declarations[0];
+                            const declarationNode = path.node.declarations[0];
                             const init = declarationNode.init;
-                            if (!utils_1.isComponent(declarationNode) || !isValidPath(path))
+                            if (core_1.types.isCallExpression(init) &&
+                                core_1.types.isIdentifier(init.callee) &&
+                                init.callee.name === 'getDefaultProps' &&
+                                utils_1.isImported(path, 'getDefaultProps')) {
+                                const componentPath = utils_1.getComponentRecursively(path);
+                                const propInfo = get_props_form_path_1.getPropsFormPath(componentPath);
+                                path.replaceWith(core_1.types.variableDeclaration(path.node.kind, [
+                                    core_1.types.variableDeclarator(declarationNode.id, propInfo ? propInfo.props : core_1.types.nullLiteral()),
+                                ]));
                                 return;
-                            if (!core_1.types.isIdentifier(declarationNode.id))
-                                return;
-                            const componentName = declarationNode.id.name;
-                            if (!core_1.types.isArrowFunctionExpression(init) &&
-                                !core_1.types.isCallExpression(init) &&
-                                !core_1.types.isTaggedTemplateExpression(init)) {
-                                return;
                             }
-                            const funcNode = utils_1.getFunctionNode(init);
-                            if (!funcNode)
+                            const propInfo = get_variable_declaration_props_1.getVariableDeclarationProps(path);
+                            if (!propInfo)
                                 return;
-                            utils_1.getPropsAndInsert(path, funcNode, componentName);
+                            utils_1.setDefaultProps(path, propInfo.componentName, propInfo.props);
                         },
@@ -55,0 +45,0 @@ });

lib/utils/get-props.d.ts

@@ -1,2 +0,2 @@
-import { types as t } from '@babel/core';
-export declare const getProps: (node: t.FunctionDeclaration | t.ArrowFunctionExpression) => t.AssignmentPattern[];
+import { types as t, NodePath } from '@babel/core';
+export declare const getProps: (path: NodePath<t.FunctionDeclaration> | NodePath<t.VariableDeclaration>, func: t.FunctionDeclaration, componentName: string) => t.ObjectExpression;

lib/utils/get-props.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getProps = void 0;
+const _1 = require(".");
 const core_1 = require("@babel/core");
-const get_props_from_object_1 = require("./get-props-from-object");
-const get_props_form_body_1 = require("./get-props-form-body");
-exports.getProps = (node) => {
-    if (!node.params.length)
-        return undefined;
-    const firstParam = node.params[0];
-    if (core_1.types.isObjectPattern(firstParam)) {
-        return get_props_from_object_1.getPropsFromObject(firstParam.properties);
+exports.getProps = (path, func, componentName) => {
+    const firstParam = func.params.length && func.params[0];
+    if (firstParam &&
+        (core_1.types.isObjectExpression(firstParam) || core_1.types.isObjectPattern(firstParam))) {
+        return _1.getObjectExpression({
+            componentName,
+            path,
+            props: _1.getPropsFromParams(func),
+        });
     }
-    const assignmentPatterns = get_props_form_body_1.getPropsFormBody(node);
-    return assignmentPatterns;
+    else if (func.body.body) {
+        const assignmentPatterns = _1.getPropsFormBody(func);
+        return _1.getObjectExpression({
+            componentName,
+            path,
+            props: assignmentPatterns || [],
+        });
+    }
+    return undefined;
 };
 //# sourceMappingURL=get-props.js.map

lib/utils/index.d.ts

 export * from './is-component';
-export * from './get-props';
+export * from './get-props-form-params';
 export * from './get-props-form-body';
 export * from './get-function-node';
 export * from './get-expression';
-export * from './get-props-and-insert';
+export * from './get-props';
 export * from './set-default-props';
+export * from './get-program-path';
+export * from './is-imported';
+export * from './is-root-path';
+export * from './get-component-recursively';

lib/utils/index.js

@@ -5,8 +5,12 @@ "use strict";
 tslib_1.__exportStar(require("./is-component"), exports);
-tslib_1.__exportStar(require("./get-props"), exports);
+tslib_1.__exportStar(require("./get-props-form-params"), exports);
 tslib_1.__exportStar(require("./get-props-form-body"), exports);
 tslib_1.__exportStar(require("./get-function-node"), exports);
 tslib_1.__exportStar(require("./get-expression"), exports);
-tslib_1.__exportStar(require("./get-props-and-insert"), exports);
+tslib_1.__exportStar(require("./get-props"), exports);
 tslib_1.__exportStar(require("./set-default-props"), exports);
+tslib_1.__exportStar(require("./get-program-path"), exports);
+tslib_1.__exportStar(require("./is-imported"), exports);
+tslib_1.__exportStar(require("./is-root-path"), exports);
+tslib_1.__exportStar(require("./get-component-recursively"), exports);
 //# sourceMappingURL=index.js.map

lib/utils/set-default-props.d.ts

 import { types as t, NodePath } from '@babel/core';
-export declare const setDefaultProps: (path: NodePath<t.FunctionDeclaration> | NodePath<t.VariableDeclaration>, componentName: string, expression: t.Expression) => void;
+export declare const setDefaultProps: (path: NodePath<t.FunctionDeclaration> | NodePath<t.VariableDeclaration>, componentName: string, expression?: t.Expression) => void;

lib/utils/set-default-props.js

@@ -6,2 +6,4 @@ "use strict";
 exports.setDefaultProps = (path, componentName, expression) => {
+    if (!expression)
+        return;
     const node = get_expression_1.getExpressionStatement(componentName, expression);
@@ -8,0 +10,0 @@ path.insertAfter(node);

package.json

 {
   "name": "babel-react-defaultprops",
-  "version": "1.0.3",
+  "version": "1.1.0",
   "description": "A plugin to extract es6 default parameters",
@@ -18,3 +18,4 @@ "source": "src/plugin.ts",
     "lib",
-    "src"
+    "src",
+    "utils.d.ts"
   ],
@@ -21,0 +22,0 @@ "keywords": [

README.md

@@ -1,91 +0,1 @@
-# babel-react-defaultprops
-
-A babel plugin that extracts es6 default parameters and append it to the component property named `__defaultProps`.
-
-## Usage
-
-```
-npm install --save-dev babel-react-defaultprops
-```
-
-```
-yarn add -D babel-react-defaultprops
-```
-
-Add the plugin to the Babel configuration:
-
-babel.config.js
-
-```
-module.exports = {
-plugins: ['module:babel-react-defaultprops'],
-};
-```
-
-## Example
-
-Before:
-
-```js
-export function FunctionComponent({ bar, foo = 'func' }) {
-  return <div>{bar + foo}</div>;
-}
-```
-
-After:
-
-```js
-function FunctionComponent(_ref) {
-  var bar = _ref.bar,
-    _ref$foo = _ref.foo,
-    foo = _ref$foo === void 0 ? 'func' : _ref$foo;
-  return _react['default'].createElement('div', null, bar + foo);
-}
-
-FunctionComponent.__defaultProps = {
-  foo: 'func',
-};
-```
-
-Or with defaults in function body:
-
-Before:
-
-```js
-export const VariableComponent = (props) => {
-  const { bar, foo = 'variable' } = props;
-  return <div>{bar + foo}</div>;
-};
-```
-
-After:
-
-```js
-var VariableComponent = function VariableComponent(props) {
-  var bar = props.bar,
-    _props$foo2 = props.foo,
-    foo = _props$foo2 === void 0 ? 'variable' : _props$foo2;
-  return _react['default'].createElement('div', null, bar + foo);
-};
-
-VariableComponent.__defaultProps = {
-  foo: 'variable',
-};
-```
-
-For more example look into the test folder.
-
-## Typescript
-
-If using typescript ad following to the`global.d.ts` file:
-
-```ts
-declare module 'react' {
-  export interface FunctionComponent<P = unknown> {
-    __defaultProps?: Partial<P>;
-  }
-}
-export {};
-```
-
-> Node that the default props with the locale variable as a value in the function body will not be included.
+Renamed to [babel-plugin-react-defaultprops](https://www.npmjs.com/package/babel-plugin-react-defaultprops)

src/plugin.ts

@@ -1,20 +0,17 @@
-import { PluginOptions, Path } from './typings';
+import { PluginOptions } from './typings';
 import { PluginObj, PluginPass } from '@babel/core';
 import { types as t } from '@babel/core';
-import { isComponent, getFunctionNode, getPropsAndInsert } from './utils';
+import {
+  isImported,
+  // getFunctionNode,
+  // getProps,
+  // isComponent,
+  setDefaultProps,
+  // isRootPath,
+  getComponentRecursively,
+} from './utils';
+import { getFunctionDeclarationProps } from './get-function-declaration-props';
+import { getVariableDeclarationProps } from './get-variable-declaration-props';
+import { getPropsFormPath } from './get-props-form-path';
 
-const isValidPath = (
-  path:
-    | Path<t.FunctionDeclaration>
-    | Path<t.VariableDeclaration>
-    | Path<t.CompletionStatement>
-    | Path<t.TaggedTemplateExpression>,
-) => {
-  if (t.isExportNamedDeclaration(path.parent)) return true;
-  if (t.isExportDefaultDeclaration(path.parent)) return true;
-  if (t.isProgram(path.parent)) return true;
-
-  return false;
-};
-
 export default function (): PluginObj<
@@ -34,9 +31,5 @@ PluginPass & { opts: PluginOptions & { isReactFile: boolean } }
             FunctionDeclaration(path) {
-              const { node } = path;
-
-              if (!isComponent(node) || !isValidPath(path)) return;
-
-              const componentName = node.id.name;
-
-              getPropsAndInsert(path, node, componentName);
+              const propInfo = getFunctionDeclarationProps(path);
+              if (!propInfo) return;
+              setDefaultProps(path, propInfo.componentName, propInfo.props);
             },
@@ -49,29 +42,28 @@
             VariableDeclaration(path) {
-              const { node } = path;
-              if (!node.declarations || node.declarations.length === 0) {
-                return;
-              }
-
-              const declarationNode = node.declarations[0];
+              const declarationNode = path.node.declarations[0];
               const init = declarationNode.init;
 
-              if (!isComponent(declarationNode) || !isValidPath(path)) return;
-
-              if (!t.isIdentifier(declarationNode.id)) return;
-
-              const componentName = declarationNode.id.name;
-
               if (
-                !t.isArrowFunctionExpression(init) &&
-                !t.isCallExpression(init) &&
-                !t.isTaggedTemplateExpression(init)
+                t.isCallExpression(init) &&
+                t.isIdentifier(init.callee) &&
+                init.callee.name === 'getDefaultProps' &&
+                isImported(path, 'getDefaultProps')
               ) {
+                const componentPath = getComponentRecursively(path);
+                const propInfo = getPropsFormPath(componentPath);
+
+                path.replaceWith(
+                  t.variableDeclaration(path.node.kind, [
+                    t.variableDeclarator(
+                      declarationNode.id,
+                      propInfo ? propInfo.props : t.nullLiteral(),
+                    ),
+                  ]),
+                );
                 return;
               }
 
-              const funcNode = getFunctionNode(init);
-
-              if (!funcNode) return;
-
-              getPropsAndInsert(path, funcNode, componentName);
+              const propInfo = getVariableDeclarationProps(path);
+              if (!propInfo) return;
+              setDefaultProps(path, propInfo.componentName, propInfo.props);
             },
@@ -78,0 +70,0 @@ });

src/utils/get-props.ts

@@ -1,18 +0,30 @@
-import { types as t } from '@babel/core';
-import { getPropsFromObject } from './get-props-from-object';
-import { getPropsFormBody } from './get-props-form-body';
+import { getPropsFromParams, getObjectExpression, getPropsFormBody } from '.';
+import { types as t, NodePath } from '@babel/core';
 
 export const getProps = (
-  node: t.FunctionDeclaration | t.ArrowFunctionExpression,
+  path: NodePath<t.FunctionDeclaration> | NodePath<t.VariableDeclaration>,
+  func: t.FunctionDeclaration,
+  componentName: string,
 ) => {
-  if (!node.params.length) return undefined;
+  const firstParam = func.params.length && func.params[0];
 
-  const firstParam = node.params[0];
-  if (t.isObjectPattern(firstParam)) {
-    return getPropsFromObject(firstParam.properties);
+  if (
+    firstParam &&
+    (t.isObjectExpression(firstParam) || t.isObjectPattern(firstParam))
+  ) {
+    return getObjectExpression({
+      componentName,
+      path,
+      props: getPropsFromParams(func),
+    });
+  } else if (func.body.body) {
+    const assignmentPatterns = getPropsFormBody(func);
+
+    return getObjectExpression({
+      componentName,
+      path,
+      props: assignmentPatterns || [],
+    });
   }
-
-  const assignmentPatterns = getPropsFormBody(node);
-
-  return assignmentPatterns;
+  return undefined;
 };

src/utils/index.ts

 export * from './is-component';
-export * from './get-props';
+export * from './get-props-form-params';
 export * from './get-props-form-body';
 export * from './get-function-node';
 export * from './get-expression';
-export * from './get-props-and-insert';
+export * from './get-props';
 export * from './set-default-props';
+export * from './get-program-path';
+export * from './is-imported';
+export * from './is-root-path';
+export * from './get-component-recursively';

src/utils/set-default-props.ts

@@ -7,6 +7,7 @@ import { types as t, NodePath } from '@babel/core';
   componentName: string,
-  expression: t.Expression,
+  expression?: t.Expression,
 ) => {
+  if (!expression) return;
   const node = getExpressionStatement(componentName, expression);
   path.insertAfter(node);
 };

No alert changes

Improved metrics

Total package byte prevSize

58608

26.8%

Number of package files

85

51.79%

Lines of code

1055

32.04%

Worsened metrics

Number of lines in readme file

2

-97.83%

No dependency changes