@kaiheila/ui-components 0.1.14 → 0.1.17

package/dist/main.css

@@ -243,6 +243,7 @@ textarea {
 .chuanyu-button.disabled,
 .chuanyu-button:disabled {
   cursor: not-allowed;
+  opacity: 0.5;
 }
 .chuanyu-button.size-xs {
   font-size: 12px;
@@ -294,19 +295,15 @@ textarea {
 .chuanyu-button.type-primary:not(.disabled):active {
   background-color: var(--color-primary-active);
 }
-.chuanyu-button.type-primary:disabled {
-  opacity: 0.5;
-  background-color: var(--color-primary);
-}
 .chuanyu-button.type-simple-primary {
   background-color: transparent;
   color: var(--color-primary);
 }
-.chuanyu-button.type-simple-primary:hover {
+.chuanyu-button.type-simple-primary:not(.disabled):hover {
   background-color: var(--color-primary);
   color: #fff;
 }
-.chuanyu-button.type-simple-primary:active {
+.chuanyu-button.type-simple-primary:not(.disabled):active {
   background-color: var(--color-primary-active);
   color: #fff;
 }
@@ -316,13 +313,9 @@ textarea {
 .chuanyu-button.type-appprimary:not(.disabled):hover {
   background-color: var(--color-primary-hover);
 }
-.chuanyu-button.type-appprimary:active {
+.chuanyu-button.type-appprimary:not(.disabled):active {
   background-color: var(--color-primary-active);
 }
-.chuanyu-button.type-appprimary:disabled {
-  opacity: 0.5;
-  background-color: var(--color-primary);
-}
 .chuanyu-button.type-danger {
   background-color: var(--color-error);
 }
@@ -372,10 +365,6 @@ textarea {
 .chuanyu-button.type-simple:not(.disabled):active {
   background-color: var(--button-simple-active);
 }
-.chuanyu-button.type-simple:disabled {
-  opacity: 0.5;
-  background-color: transparent;
-}
 .chuanyu-button.type-default {
   color: var(--text-description-color);
   background-color: var(--button-default);
@@ -387,9 +376,8 @@ textarea {
   background-color: var(--button-default-active);
 }
 .chuanyu-button.type-default:disabled {
-  cursor: not-allowed;
   opacity: 0.5;
-  background: rgba(187, 190, 196, 0.3);
+  background-color: var(--button-default);
 }
 .chuanyu-button.type-ghost {
   color: var(--text-description-color);
@@ -402,21 +390,17 @@ textarea {
 .chuanyu-button.type-ghost:not(.disabled):active {
   background-color: var(--button-simple-active);
 }
-.chuanyu-button.type-ghost:disabled {
-  cursor: not-allowed;
-  opacity: 0.5;
-}
 .chuanyu-button.type-ghost-danger {
   color: var(--color-error);
   border-color: var(--color-error);
   border-width: 1px;
   border-style: solid;
 }
-.chuanyu-button.type-ghost-danger:hover {
+.chuanyu-button.type-ghost-danger:not(.disabled):hover {
   color: var(--color-error-hover);
   border-color: var(--color-error-hover);
 }
-.chuanyu-button.type-ghost-danger:active {
+.chuanyu-button.type-ghost-danger:not(.disabled):active {
   color: var(--color-error-hover);
   border-color: var(--color-error-hover);
 }
@@ -425,10 +409,10 @@ textarea {
   background-color: transparent;
   border: 1px solid rgba(228, 75, 77);
 }
-.chuanyu-button.type-simple-danger:hover {
+.chuanyu-button.type-simple-danger:not(.disabled):hover {
   border: 1px solid rgba(230, 93, 95);
 }
-.chuanyu-button.type-simple-danger:active {
+.chuanyu-button.type-simple-danger:not(.disabled):active {
   background-color: rgba(228, 75, 77, 0.1);
 }
 .chuanyu-button.loading .loading-ico {
@@ -1067,16 +1051,20 @@ textarea {
   border-radius: 12px;
   border: 1px solid var(--border-color);
 }
-.selector-search-select:hover {
+.selector-search-select.disabled {
+  cursor: not-allowed;
+  opacity: 0.5;
+}
+.selector-search-select:not(.disabled):hover {
   border-color: var(--border-hover-color);
 }
-.selector-search-select:active,
-.selector-search-select.active {
+.selector-search-select:not(.disabled):active,
+.selector-search-select:not(.disabled).active {
   border-color: var(--border-hover-color);
   box-shadow: 0 0 0 3px var(--border-active-color);
 }
-.selector-search-select:active .dropdown-icon,
-.selector-search-select.active .dropdown-icon {
+.selector-search-select:not(.disabled):active .dropdown-icon,
+.selector-search-select:not(.disabled).active .dropdown-icon {
   transform: translateY(-50%) rotate(180deg);
 }
 .selector-search-select .selector-search-label {
@@ -1244,7 +1232,7 @@ body .__react_component_tooltip.type-success {
   z-index: 100;
   pointer-events: none;
   border-radius: 10px;
-  background-color: #64dc00;
+  background-color: #7acc35;
 }
 body .__react_component_tooltip.type-success.useMaxWidth {
   max-width: 160px;
@@ -1262,16 +1250,16 @@ body .__react_component_tooltip.type-success .user-fullname {
   vertical-align: middle;
 }
 body .__react_component_tooltip.type-success.place-right:after {
-  border-right-color: #64dc00;
+  border-right-color: #7acc35;
 }
 body .__react_component_tooltip.type-success.place-top:after {
-  border-top-color: #64dc00;
+  border-top-color: #7acc35;
 }
 body .__react_component_tooltip.type-success.place-bottom:after {
-  border-bottom-color: #64dc00;
+  border-bottom-color: #7acc35;
 }
 body .__react_component_tooltip.type-success.place-left:after {
-  border-left-color: #64dc00;
+  border-left-color: #7acc35;
 }
 body .__react_component_tooltip.type-dark {
   margin-top: 0;
@@ -1308,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 {
@@ -1324,7 +1311,7 @@ body .__react_component_tooltip.type-dark.place-right:after {
   transition: 200ms ease-out all;
 }
 .ui-switch small::before {
-  content: '';
+  content: "";
   position: absolute;
   left: 0;
   top: 0;
@@ -1343,11 +1330,11 @@ body .__react_component_tooltip.type-dark.place-right:after {
 .ui-switch.checked small::before {
   background-color: var(--color-primary);
 }
-.ui-switch:active small::before {
+.ui-switch:active:not(.disabled) small::before {
   left: 0;
   right: -100%;
 }
-.ui-switch.checked:active small::before {
+.ui-switch.checked:active:not(.disabled) small::before {
   right: 0;
   left: -100%;
 }
@@ -1365,7 +1352,7 @@ body .__react_component_tooltip.type-dark.place-right:after {
   right: 10%;
   top: 25%;
   z-index: 0;
-  color: #A9A9A9;
+  color: #a9a9a9;
 }
 .ui-switch .on {
   display: none;
@@ -1398,8 +1385,12 @@ body .__react_component_tooltip.type-dark.place-right:after {
   cursor: pointer;
 }
 .kaihei-auth-switch.disabled {
+  opacity: 0.5;
   cursor: not-allowed;
 }
+.kaihei-auth-switch:not(.disabled) .auth-status-item:hover {
+  background-color: var(--menu-hover);
+}
 .kaihei-auth-switch .auth-status-item {
   flex: 1;
   display: flex;
@@ -1410,9 +1401,6 @@ body .__react_component_tooltip.type-dark.place-right:after {
 .kaihei-auth-switch .auth-status-item .xy-iconfont {
   font-size: 24px;
 }
-.kaihei-auth-switch .auth-status-item:hover {
-  background-color: var(--menu-hover);
-}
 .kaihei-auth-switch .auth-status-item.close-status {
   border-top-left-radius: 8px;
   border-bottom-left-radius: 8px;
@@ -1448,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;
 }
@@ -1488,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.13\",\"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.16\",\"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);
@@ -6086,10 +6088,12 @@ var selector_search_SelectorSearch = /*#__PURE__*/function (_Component) {
           filterData = _this$state.filterData,
           optionsStyle = _this$state.optionsStyle;
       var _this$props2 = this.props,
+          _this$props2$disabled = _this$props2.disabled,
+          disabled = _this$props2$disabled === void 0 ? false : _this$props2$disabled,
           placeholder = _this$props2.placeholder,
           renderOption = _this$props2.renderOption,
-          _this$props2$disabled = _this$props2.disabledValues,
-          disabledValues = _this$props2$disabled === void 0 ? [] : _this$props2$disabled,
+          _this$props2$disabled2 = _this$props2.disabledValues,
+          disabledValues = _this$props2$disabled2 === void 0 ? [] : _this$props2$disabled2,
           _this$props2$labelKey = _this$props2.labelKey,
           labelKey = _this$props2$labelKey === void 0 ? 'label' : _this$props2$labelKey,
           _this$props2$valueKey = _this$props2.valueKey,
@@ -6121,7 +6125,8 @@ var selector_search_SelectorSearch = /*#__PURE__*/function (_Component) {
         className: "selector-search-contain"
       }, /*#__PURE__*/external_react_default.a.createElement("div", {
         className: external_classnames_default()('selector-search-select theme-input-bg-base', {
-          'active': showList
+          'active': showList,
+          disabled: disabled
         }),
         ref: this.selectRef,
         onClick: this.toggle
@@ -6873,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
@@ -6907,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,
@@ -6931,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.14",
+  "version": "0.1.17",
   "description": "开黑啦 UI Components",
   "main": "dist/ui-components.js",
   "scripts": {