@_nu/react-button - npm Package Compare versions

Comparing version 0.0.8 to 0.0.9

CHANGELOG.md

@@ -0,14 +1,11 @@
+## [0.0.8](https://github.com/nu-system/react-button/compare/v0.0.7...v0.0.8) (2020-03-15)
+
 ## [0.0.7](https://github.com/nu-system/react-button/compare/e4dae1b172f00b9811e9755d3a49e61e5559d090...v0.0.7) (2020-03-15)
 
-
 ### Bug Fixes
 
-* 修改版本依赖 ([e4dae1b](https://github.com/nu-system/react-button/commit/e4dae1b172f00b9811e9755d3a49e61e5559d090))
+- 修改版本依赖 ([e4dae1b](https://github.com/nu-system/react-button/commit/e4dae1b172f00b9811e9755d3a49e61e5559d090))
 
-
 ### Features
 
-* remove ui dependecy of button ([5e96db0](https://github.com/nu-system/react-button/commit/5e96db076c764f7d7fbc38ad820a0ea459a89985))
-
-
-
+- remove ui dependecy of button ([5e96db0](https://github.com/nu-system/react-button/commit/5e96db076c764f7d7fbc38ad820a0ea459a89985))

es/index.js

@@ -8,2 +8,36 @@ 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; };
 
+/**
+ * [get new classNames]
+ * @param classDefault {string}
+ * @param classIn {string}
+ * @returns {string}
+ */
+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 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 variantClass = null;
+
+  [].concat(arrClassDefault, arrClassIn).forEach(function (item) {
+    // remove empty
+    if (!item) {
+      return;
+    }
+    // find last in arrClassVariant
+    if (arrClassVariant.includes(item)) {
+      variantClass = item;
+    } else if (!arrClassNew.includes(item)) {
+      // remove the same class
+      arrClassNew.push(item);
+    }
+  });
+  // push the variant class back
+  !!variantClass && arrClassNew.push(variantClass);
+  return arrClassNew.join(" ");
+};
+
 var Button = function Button(_ref) {
@@ -13,3 +47,3 @@ var _ref$className = _ref.className,
       _ref$classNameDefault = _ref.classNameDefault,
-      classNameDefault = _ref$classNameDefault === undefined ? "_fill" : _ref$classNameDefault,
+      classNameDefault = _ref$classNameDefault === undefined ? "nu_btn _fill" : _ref$classNameDefault,
       _ref$children = _ref.children,
@@ -28,9 +62,2 @@ children = _ref$children === undefined ? null : _ref$children,
   var ComponentTag = !!href ? "a" : Component;
-  /**
-   * this can ignore the empty
-   * className can be string and array
-   */
-  var strClassName = ["nu_btn", classNameDefault, className].flat().filter(function (item) {
-    return !!item;
-  }).join(" ");
   return React.createElement(
@@ -42,3 +69,3 @@ ComponentTag,
       disabled: disabled,
-      className: strClassName
+      className: getClassNames(classNameDefault, className)
     }, otherProps),
@@ -45,0 +72,0 @@ React.createElement(

lib/index.js

@@ -19,2 +19,36 @@ "use strict";
 
+/**
+ * [get new classNames]
+ * @param classDefault {string}
+ * @param classIn {string}
+ * @returns {string}
+ */
+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 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 variantClass = null;
+
+  [].concat(arrClassDefault, arrClassIn).forEach(function (item) {
+    // remove empty
+    if (!item) {
+      return;
+    }
+    // find last in arrClassVariant
+    if (arrClassVariant.includes(item)) {
+      variantClass = item;
+    } else if (!arrClassNew.includes(item)) {
+      // remove the same class
+      arrClassNew.push(item);
+    }
+  });
+  // push the variant class back
+  !!variantClass && arrClassNew.push(variantClass);
+  return arrClassNew.join(" ");
+};
+
 var Button = function Button(_ref) {
@@ -24,3 +58,3 @@ var _ref$className = _ref.className,
       _ref$classNameDefault = _ref.classNameDefault,
-      classNameDefault = _ref$classNameDefault === undefined ? "_fill" : _ref$classNameDefault,
+      classNameDefault = _ref$classNameDefault === undefined ? "nu_btn _fill" : _ref$classNameDefault,
       _ref$children = _ref.children,
@@ -39,9 +73,2 @@ children = _ref$children === undefined ? null : _ref$children,
   var ComponentTag = !!href ? "a" : Component;
-  /**
-   * this can ignore the empty
-   * className can be string and array
-   */
-  var strClassName = ["nu_btn", classNameDefault, className].flat().filter(function (item) {
-    return !!item;
-  }).join(" ");
   return _react2.default.createElement(
@@ -53,3 +80,3 @@ ComponentTag,
       disabled: disabled,
-      className: strClassName
+      className: getClassNames(classNameDefault, className)
     }, otherProps),
@@ -56,0 +83,0 @@ _react2.default.createElement(

package.json

 {
   "name": "@_nu/react-button",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "No UI dependency Button of react",
@@ -25,3 +25,3 @@ "main": "lib/index.js",
     "clean": "nwb clean-module && nwb clean-demo",
-    "prepublishOnly": "npm run build",
+    "prepublishOnly": "npm run prettier && npm run build",
     "start": "nwb serve-react-demo",
@@ -40,7 +40,7 @@ "test": "nwb test-react",
   "peerDependencies": {
-    "@_nu/css-button": "^0.0.5",
+    "@_nu/css-button": "^0.0.6",
     "react": "16.x"
   },
   "devDependencies": {
-    "@_nu/css-button": "^0.0.5",
+    "@_nu/css-button": "^0.0.6",
     "conventional-changelog-cli": "^2.0.23",
@@ -47,0 +47,0 @@ "cz-conventional-changelog": "3.0.2",

README.md

@@ -59,3 +59,3 @@ # Button
 
-## 结构
+## Struct
 
@@ -72,6 +72,6 @@ ```JSX
 | :--------------- | :------------------------------: | :------: | :-----------------------: |
-| children         |        string|Array         |   null   |         children          |
-| className        |        string|Array         |    ''    |         className         |
-| classNameDefault |        string|Array,        | '\_fill' |     default className     |
-| href             |              string              |   null   |       href for `a`        |
+| children         |       string | Array        | ' ' |         children          |
+| className        |       string | Array        | ' ' |         className         |
+| classNameDefault |       string | Array        | '\_fill' |     default className     |
+| href             |              string              | ' ' |       href for `a`        |
 | disabled         |             boolean              |  false   | disabled status of button |
@@ -92,3 +92,3 @@ | Component        | string | func | object | 'button' |          wrapper          |
 <button class="nu_btn _fill" type="button" disabled><span>hello</span></button>
-<button class="nu_btn _fill _primary" type="button"><span>hello</span></button>
+<button class="nu_btn _primary _fill" type="button"><span>hello</span></button>
 <button class="nu_btn _fill" type="button"><strong>hello</strong></button>
@@ -98,2 +98,17 @@ <a class="nu_btn _fill" href="." title="hello"><span>hello</span></a>
 
+## classNames
+
+```JSX
+<Button className="_primary _fill _ghost _primary">hello</Button>
+<Button className={['_primary','_fill','_ghost','_primary','','',null]}>hello</Button>
+```
+
+```HTML
+<button class="nu_btn _primary _ghost" type="button"><span>hello</span></button>
+```
+
+- duplicate class will remove;
+- `_fill`,`_ghost`,`_link` show on className. only the last one will be render;
+- empty will be ignore;
+
 ## Use with Link？
@@ -125,2 +140,2 @@
 
-Go to [@_nu/css-button](https://nu-system.github.io/css/button/)
+Go to [@\_nu/css-button](https://nu-system.github.io/css/button/)

No alert changes

Improved metrics

Total package byte prevSize

14421

19.71%

Lines of code

202

31.17%

Number of lines in readme file

137

12.3%

No dependency changes