@kaiheila/ui-components 0.1.15 → 0.1.16

package/dist/main.css

@@ -1296,7 +1296,6 @@ body .__react_component_tooltip.type-dark.place-right:after {
   border: 2px solid var(--text-tip-color);
   cursor: pointer;
   transition: 0.3s ease-out all;
-  top: -1px;
 }
 /*adding a wide width for larger switch text*/
 .ui-switch.wide {
@@ -1437,18 +1436,19 @@ body .__react_component_tooltip.type-dark.place-right:after {
   position: relative;
   border: 1px solid var(--border-color);
   border-radius: 12px;
+  padding: 12px 16px;
 }
-.textarea-box.show-max-length textarea {
-  padding-right: 24px;
+.textarea-box.show-max-length {
+  padding-bottom: 30px;
 }
 .textarea-box textarea {
+  padding: 0;
+  margin: 0;
   width: 100%;
   height: 70px;
-  padding: 8px 0 0 16px;
   border: none;
   background-color: initial;
   color: inherit;
-  margin-top: 1px;
   line-height: 1.5;
   resize: none;
 }
@@ -1477,10 +1477,13 @@ body .__react_component_tooltip.type-dark.place-right:after {
   font-family: "Helvetica Neue", "Helvetica", "Arial", "sans-serif";
   position: absolute;
   bottom: 7px;
-  right: 12px;
+  right: 16px;
   font-size: 12px;
   color: var(--text-tip-color);
 }
+.textarea-box .footer.error {
+  color: var(--color-error);
+}
 .textarea-box.size-sm {
   border-width: 0px;
 }

package/dist/ui-components.js

@@ -2803,7 +2803,7 @@ module.exports = require("react-dom");
 /* 6 */
 /***/ (function(module) {
 
-module.exports = JSON.parse("{\"name\":\"@kaiheila/ui-components\",\"version\":\"0.1.14\",\"description\":\"开黑啦 UI Components\",\"main\":\"dist/ui-components.js\",\"scripts\":{\"build\":\"webpack\",\"demo\":\"webpack-dev-server --config webpack.config.demo.js\"},\"keywords\":[\"UI\",\"Components\"],\"author\":\"yangchuan\",\"license\":\"ISC\",\"files\":[\"dist\"],\"devDependencies\":{\"@babel/core\":\"^7.15.5\",\"@babel/preset-env\":\"^7.15.6\",\"@babel/preset-react\":\"^7.14.5\",\"@webpack-cli/serve\":\"^1.6.0\",\"babel-loader\":\"^8.2.2\",\"classnames\":\"^2.3.1\",\"css-loader\":\"^2.1.1\",\"html-webpack-plugin\":\"^4.5.2\",\"less\":\"^4.1.2\",\"less-loader\":\"^5.0.0\",\"mini-css-extract-plugin\":\"^0.8.0\",\"prop-types\":\"^15.7.2\",\"react\":\"^16.9.0\",\"react-dom\":\"^16.9.0\",\"react-tooltip\":\"^4.2.21\",\"style-loader\":\"^1.0.0\",\"url-loader\":\"^2.1.0\",\"webpack\":\"^4.40.2\",\"webpack-cli\":\"^3.3.1\",\"webpack-dev-server\":\"^3.2.1\"},\"peerDependencies\":{\"react\":\"^16.9.0\",\"react-dom\":\"^16.9.0\"},\"browserslist\":{\"production\":[\">0.2%\",\"not dead\",\"not op_mini all\"],\"development\":[\"last 1 chrome version\",\"last 1 firefox version\",\"last 1 safari version\"]}}");
+module.exports = JSON.parse("{\"name\":\"@kaiheila/ui-components\",\"version\":\"0.1.15\",\"description\":\"开黑啦 UI Components\",\"main\":\"dist/ui-components.js\",\"scripts\":{\"build\":\"webpack\",\"demo\":\"webpack-dev-server --config webpack.config.demo.js\"},\"keywords\":[\"UI\",\"Components\"],\"author\":\"yangchuan\",\"license\":\"ISC\",\"files\":[\"dist\"],\"devDependencies\":{\"@babel/core\":\"^7.15.5\",\"@babel/preset-env\":\"^7.15.6\",\"@babel/preset-react\":\"^7.14.5\",\"@webpack-cli/serve\":\"^1.6.0\",\"babel-loader\":\"^8.2.2\",\"classnames\":\"^2.3.1\",\"css-loader\":\"^2.1.1\",\"html-webpack-plugin\":\"^4.5.2\",\"less\":\"^4.1.2\",\"less-loader\":\"^5.0.0\",\"mini-css-extract-plugin\":\"^0.8.0\",\"prop-types\":\"^15.7.2\",\"react\":\"^16.9.0\",\"react-dom\":\"^16.9.0\",\"react-tooltip\":\"^4.2.21\",\"style-loader\":\"^1.0.0\",\"url-loader\":\"^2.1.0\",\"webpack\":\"^4.40.2\",\"webpack-cli\":\"^3.3.1\",\"webpack-dev-server\":\"^3.2.1\"},\"peerDependencies\":{\"react\":\"^16.9.0\",\"react-dom\":\"^16.9.0\"},\"browserslist\":{\"production\":[\">0.2%\",\"not dead\",\"not op_mini all\"],\"development\":[\"last 1 chrome version\",\"last 1 firefox version\",\"last 1 safari version\"]}}");
 
 /***/ }),
 /* 7 */
@@ -4819,7 +4819,8 @@ var search_input_SearchInput = /*#__PURE__*/function (_Component) {
           _this$props$size = _this$props.size,
           size = _this$props$size === void 0 ? '' : _this$props$size,
           _this$props$type = _this$props.type,
-          type = _this$props$type === void 0 ? '' : _this$props$type;
+          type = _this$props$type === void 0 ? '' : _this$props$type,
+          maxLength = _this$props.maxLength;
       return /*#__PURE__*/external_react_default.a.createElement("div", {
         className: external_classnames_default()('search-input', size, type, {
           'active': isFocus
@@ -4827,6 +4828,7 @@ var search_input_SearchInput = /*#__PURE__*/function (_Component) {
       }, /*#__PURE__*/external_react_default.a.createElement("input", {
         ref: this.refInput,
         value: value,
+        maxLength: maxLength,
         onChange: this.onChange,
         onBlur: function onBlur() {
           return _this2.onFocusChange(false);
@@ -6876,7 +6878,7 @@ var textarea_Textarea = /*#__PURE__*/function (_Component) {
       _this.props.onChange && _this.props.onChange(value);
     });
 
-    _this.maxLength = 512;
+    _this.maxLength = 500;
     _this.state = {
       focus: false,
       value: props.value
@@ -6910,12 +6912,14 @@ var textarea_Textarea = /*#__PURE__*/function (_Component) {
           size = _this$props$size === void 0 ? '' : _this$props$size,
           disabled = _this$props.disabled,
           _this$props$themeFocu = _this$props.themeFocus,
-          themeFocus = _this$props$themeFocu === void 0 ? true : _this$props$themeFocu;
+          themeFocus = _this$props$themeFocu === void 0 ? true : _this$props$themeFocu,
+          _this$props$maxLength = _this$props.maxLength,
+          maxLength = _this$props$maxLength === void 0 ? this.maxLength : _this$props$maxLength;
       var _this$state = this.state,
           focus = _this$state.focus,
           _this$state$value = _this$state.value,
           value = _this$state$value === void 0 ? '' : _this$state$value;
-      var length = (this.props.maxLength || this.maxLength) - value.length;
+      var lengthLimit = value.length >= maxLength;
       return /*#__PURE__*/external_react_default.a.createElement("div", {
         className: external_classnames_default()('textarea-box', className, size ? "size-".concat(size) : '', {
           'theme-focus': themeFocus && focus,
@@ -6934,8 +6938,10 @@ var textarea_Textarea = /*#__PURE__*/function (_Component) {
         onCompositionStart: this.onCompositionStart,
         onCompositionEnd: this.onCompositionEnd
       }), showMaxLength && /*#__PURE__*/external_react_default.a.createElement("div", {
-        className: "footer"
-      }, Math.max(0, length)));
+        className: external_classnames_default()('footer', {
+          error: lengthLimit
+        })
+      }, value.length, "/", maxLength));
     }
   }]);
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kaiheila/ui-components",
-  "version": "0.1.15",
+  "version": "0.1.16",
   "description": "开黑啦 UI Components",
   "main": "dist/ui-components.js",
   "scripts": {