@_nu/react-button - npm Package Compare versions

Comparing version 0.0.9 to 0.1.0

CHANGELOG.md

@@ -0,1 +1,7 @@
+## [0.0.9](https://github.com/nu-system/react-button/compare/v0.0.8...v0.0.9) (2020-03-15)
+
+### Bug Fixes
+
+- fix class render way ([e5b4959](https://github.com/nu-system/react-button/commit/e5b49598539c48498a323487d535b9109b4203b9))
+
 ## [0.0.8](https://github.com/nu-system/react-button/compare/v0.0.7...v0.0.8) (2020-03-15)
@@ -2,0 +8,0 @@

es/index.js

@@ -5,3 +5,3 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
-import React from "react";
+import React, { Fragment } from "react";
 import PropTypes from "prop-types";
@@ -15,12 +15,11 @@
  */
-var getClassNames = function getClassNames() {
-  var classDefault = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
-  var classIn = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+export var getClassNames = function getClassNames() {
+  var classDefault = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var classIn = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
 
+  var arrClassDefault = classDefault && classDefault.split ? classDefault.split(" ") : classDefault || [];
+  var arrClassIn = classIn && classIn.split ? classIn.split(" ") : classIn || [];
   var arrClassVariant = ["_fill", "_ghost", "_link"];
-  var arrClassDefault = classDefault && classDefault.split ? classDefault.split(" ") : classDefault;
-  var arrClassIn = classIn && classIn.split ? classIn.split(" ") : classIn;
-  var arrClassNew = ["nu_btn"];
+  var arrClassNew = [];
   var variantClass = null;
-
   [].concat(arrClassDefault, arrClassIn).forEach(function (item) {
@@ -53,4 +52,4 @@ // remove empty
       Component = _ref$Component === undefined ? "button" : _ref$Component,
-      _ref$SubComponent = _ref.SubComponent,
-      SubComponent = _ref$SubComponent === undefined ? "span" : _ref$SubComponent,
+      _ref$ComponentSub = _ref.ComponentSub,
+      ComponentSub = _ref$ComponentSub === undefined ? "span" : _ref$ComponentSub,
       _ref$href = _ref.href,
@@ -60,5 +59,18 @@ href = _ref$href === undefined ? null : _ref$href,
       disabled = _ref$disabled === undefined ? false : _ref$disabled,
-      otherProps = _objectWithoutProperties(_ref, ["className", "classNameDefault", "children", "Component", "SubComponent", "href", "disabled"]);
+      otherProps = _objectWithoutProperties(_ref, ["className", "classNameDefault", "children", "Component", "ComponentSub", "href", "disabled"]);
 
   var ComponentTag = !!href ? "a" : Component;
+  var classNames = getClassNames(classNameDefault, className);
+  // only button got button type
+  if (ComponentTag === "button" && !otherProps.type) {
+    otherProps.type = "button";
+  }
+  // set the title of button
+  if (!otherProps.title && typeof children === "string") {
+    otherProps.title = children;
+  }
+
+  // subItem
+  var ComponentSubTag = ComponentSub && typeof children === "string" ? ComponentSub : Fragment;
+
   return React.createElement(
@@ -68,8 +80,7 @@ ComponentTag,
       href: href,
-      type: ComponentTag === "button" ? "button" : false,
       disabled: disabled,
-      className: getClassNames(classNameDefault, className)
+      className: classNames
     }, otherProps),
     React.createElement(
-      SubComponent,
+      ComponentSubTag,
       null,
@@ -83,2 +94,6 @@ children
   /**
+   * title of component
+   */
+  title: PropTypes.string,
+  /**
    * children of component
@@ -104,5 +119,5 @@ */
   /**
-   * shell of button
+   * subComponent of button
    */
-  SubComponent: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.object]),
+  ComponentSub: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.object]),
   /**
@@ -109,0 +124,0 @@ * status of disabled

lib/index.js

 "use strict";
 
 exports.__esModule = true;
+exports.getClassNames = undefined;
 
@@ -25,12 +26,11 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
  */
-var getClassNames = function getClassNames() {
-  var classDefault = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : "";
-  var classIn = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : "";
+var getClassNames = exports.getClassNames = function getClassNames() {
+  var classDefault = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var classIn = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
 
+  var arrClassDefault = classDefault && classDefault.split ? classDefault.split(" ") : classDefault || [];
+  var arrClassIn = classIn && classIn.split ? classIn.split(" ") : classIn || [];
   var arrClassVariant = ["_fill", "_ghost", "_link"];
-  var arrClassDefault = classDefault && classDefault.split ? classDefault.split(" ") : classDefault;
-  var arrClassIn = classIn && classIn.split ? classIn.split(" ") : classIn;
-  var arrClassNew = ["nu_btn"];
+  var arrClassNew = [];
   var variantClass = null;
-
   [].concat(arrClassDefault, arrClassIn).forEach(function (item) {
@@ -63,4 +63,4 @@ // remove empty
       Component = _ref$Component === undefined ? "button" : _ref$Component,
-      _ref$SubComponent = _ref.SubComponent,
-      SubComponent = _ref$SubComponent === undefined ? "span" : _ref$SubComponent,
+      _ref$ComponentSub = _ref.ComponentSub,
+      ComponentSub = _ref$ComponentSub === undefined ? "span" : _ref$ComponentSub,
       _ref$href = _ref.href,
@@ -70,5 +70,18 @@ href = _ref$href === undefined ? null : _ref$href,
       disabled = _ref$disabled === undefined ? false : _ref$disabled,
-      otherProps = _objectWithoutProperties(_ref, ["className", "classNameDefault", "children", "Component", "SubComponent", "href", "disabled"]);
+      otherProps = _objectWithoutProperties(_ref, ["className", "classNameDefault", "children", "Component", "ComponentSub", "href", "disabled"]);
 
   var ComponentTag = !!href ? "a" : Component;
+  var classNames = getClassNames(classNameDefault, className);
+  // only button got button type
+  if (ComponentTag === "button" && !otherProps.type) {
+    otherProps.type = "button";
+  }
+  // set the title of button
+  if (!otherProps.title && typeof children === "string") {
+    otherProps.title = children;
+  }
+
+  // subItem
+  var ComponentSubTag = ComponentSub && typeof children === "string" ? ComponentSub : _react.Fragment;
+
   return _react2.default.createElement(
@@ -78,8 +91,7 @@ ComponentTag,
       href: href,
-      type: ComponentTag === "button" ? "button" : false,
       disabled: disabled,
-      className: getClassNames(classNameDefault, className)
+      className: classNames
     }, otherProps),
     _react2.default.createElement(
-      SubComponent,
+      ComponentSubTag,
       null,
@@ -93,2 +105,6 @@ children
   /**
+   * title of component
+   */
+  title: _propTypes2.default.string,
+  /**
    * children of component
@@ -114,5 +130,5 @@ */
   /**
-   * shell of button
+   * subComponent of button
    */
-  SubComponent: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),
+  ComponentSub: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.func, _propTypes2.default.object]),
   /**
@@ -124,3 +140,2 @@ * status of disabled
 Button.defaultProps = {};
-exports.default = Button;
-module.exports = exports["default"];
+exports.default = Button;

package.json

 {
   "name": "@_nu/react-button",
-  "version": "0.0.9",
+  "version": "0.1.0",
   "description": "No UI dependency Button of react",
@@ -27,5 +27,4 @@ "main": "lib/index.js",
     "start": "nwb serve-react-demo",
-    "test": "nwb test-react",
-    "test:coverage": "nwb test-react --coverage",
-    "test:watch": "nwb test-react --server",
+    "test": "jest",
+    "test:coverage": "jest --coverage",
     "log": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0",
@@ -45,4 +44,10 @@ "commitizenInit": "commitizen init cz-conventional-changelog --yarn --dev --exact",
     "@_nu/css-button": "^0.0.6",
+    "@babel/preset-env": "^7.8.7",
+    "@babel/preset-react": "^7.8.3",
+    "babel-jest": "^25.1.0",
     "conventional-changelog-cli": "^2.0.23",
     "cz-conventional-changelog": "3.0.2",
+    "enzyme": "^3.11.0",
+    "enzyme-adapter-react-16": "^1.15.2",
+    "jest": "^25.1.0",
     "prettier": "1.19.1",
@@ -49,0 +54,0 @@ "react": "^16.8.6",

README.md

@@ -63,3 +63,3 @@ # Button
 <Component>
-    <SubComponent>{children}</SubComponent>
+    <ComponentSub>{children}</ComponentSub>
 </Component>
@@ -78,6 +78,7 @@ ```
 | Component        | string &#124; func &#124; object | 'button' |          wrapper          |
-| SubComponent     | string &#124; func &#124; object |  'span'  |         container         |
+| ComponentSub     | string &#124; func &#124; object |  'span'  |         container         |
 
 ```JSX
 <Button>hello</Button>
+<Button><strong>hello</strong></Button>
 <Button disabled>hello</Button>
@@ -91,2 +92,3 @@ <Button className="_primary">hello</Button>
 <button class="nu_btn _fill" type="button"><span>hello</span></button>
+<button class="nu_btn _fill" type="button"><strong>hello</strong></button>
 <button class="nu_btn _fill" type="button" disabled><span>hello</span></button>
@@ -140,1 +142,13 @@ <button class="nu_btn _primary _fill" type="button"><span>hello</span></button>
 Go to [@\_nu/css-button](https://nu-system.github.io/css/button/)
+
+## test
+
+```
+// How to start
+npm test
+```
+
+```
+// generate coverage report
+npm run test:coverage
+```

No alert changes

Improved metrics

Total package byte prevSize

15876

10.09%

Lines of code

230

13.86%

Number of lines in readme file

151

10.22%

Worsened metrics

Dev dependency count

12

100%

No dependency changes