@kaiheila/ui-components 0.1.9 → 0.1.12

package/dist/main.css

@@ -100,15 +100,21 @@ textarea {
   border-radius: 50%;
 }
 .kaihei-loading-spin:before {
-  border: 3px solid var(--border-color);
+  border: 3px solid rgba(0, 0, 0, 0.12);
+}
+.theme-dark .kaihei-loading-spin:before {
+  border-color: rgba(255, 255, 255, 0.12);
 }
 .kaihei-loading-spin:after {
   animation-duration: 0.6s;
   border: 3px solid transparent;
-  border-top-color: var(--text-tip-color);
+  border-top-color: rgba(0, 0, 0, 0.32);
   -webkit-animation: loaderSpin 0.6s linear infinite;
   animation: loaderSpin 0.6s linear infinite;
 }
+.theme-dark .kaihei-loading-spin:after {
+  border-top-color: rgba(255, 255, 255, 0.32);
+}
 .kaihei-loading-spin.block-loading-spin {
   display: block;
   margin-left: auto;
@@ -227,6 +233,10 @@ textarea {
   text-align: center;
   outline: none;
   border: 0 none;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  max-width: 100%;
   /*按钮大小*/
   /*按钮颜色样式*/
 }
@@ -253,6 +263,7 @@ textarea {
   height: 36px;
   min-width: 80px;
   font-size: 14px;
+  line-height: 36px;
   padding: 0 12px;
   border-radius: 12px;
 }
@@ -440,6 +451,12 @@ textarea {
   width: 18px;
   line-height: 1;
 }
+.chuanyu-button.loading .btn-loading-ico .kaihei-loading-spin:before {
+  border-color: rgba(255, 255, 255, 0.4);
+}
+.chuanyu-button.loading .btn-loading-ico .kaihei-loading-spin:after {
+  border-top-color: rgba(255, 255, 255, 0.72);
+}
 .size-sm .button-loading-spin {
   transform-origin: 50%;
   transform: scale(0.9);
@@ -504,6 +521,15 @@ textarea {
   vertical-align: middle;
   box-sizing: border-box;
 }
+.kaihei-checkbox-mute.type-appprimary:hover:not(.disabled) {
+  border-color: var(--color-primary);
+}
+.kaihei-checkbox-mute.type-danger:hover:not(.disabled) {
+  border-color: var(--color-error);
+}
+.kaihei-checkbox-mute svg {
+  visibility: hidden;
+}
 .kaihei-checkbox-mute.active {
   display: inline-flex;
   justify-content: center;
@@ -520,6 +546,9 @@ textarea {
 .kaihei-checkbox-mute.active:before {
   color: white;
 }
+.kaihei-checkbox-mute.active svg {
+  visibility: visible;
+}
 .kaihei-checkbox-mute.disabled {
   opacity: 0.5;
   cursor: not-allowed;
@@ -886,14 +915,13 @@ textarea {
   color: var(--text-description-color);
 }
 .selector-contain.type-ghost .selector-select {
-  padding: 6px 32px 6px 12px;
+  padding: 6px 32px 6px 16px;
   border-radius: 16px;
-  border-width: 0;
   background-color: var(--menu-background);
 }
 .selector-contain.simple .selector-select {
   border: none;
-  padding: 0 30px 0 0;
+  padding: 0 16px 0 0;
   line-height: 1;
   box-shadow: none;
   color: var(--text-description-color);
@@ -904,6 +932,9 @@ textarea {
   box-shadow: none;
   color: var(--text-color);
 }
+.selector-contain.simple .selector-select .dropdown-icon {
+  right: 0;
+}
 .selector-option.simple {
   margin-left: 50%;
   margin-top: 10px;
@@ -926,7 +957,7 @@ textarea {
   display: flex;
   position: relative;
   width: 100%;
-  padding: 9px 35px 9px 16px;
+  padding: 9px 48px 9px 16px;
   border: 1px solid var(--border-color);
   border-radius: 12px;
   cursor: pointer;
@@ -961,13 +992,13 @@ textarea {
   display: flex;
   top: 50%;
   transform: translateY(-50%);
-  right: 10px;
+  right: 16px;
   font-size: 24px;
   transition: transform 0.2s;
 }
 .selector-select .dropdown-icon svg {
-  width: 24px;
-  height: 24px;
+  width: 16px;
+  height: 16px;
 }
 .selector-option {
   position: absolute;
@@ -1025,7 +1056,7 @@ textarea {
 .selector-search-select {
   position: relative;
   width: 100%;
-  padding: 9px 35px 9px 16px;
+  padding: 9px 48px 9px 16px;
   border-radius: 12px;
   border: 1px solid var(--border-color);
 }
@@ -1052,6 +1083,7 @@ textarea {
   overflow: hidden;
   text-overflow: ellipsis;
   vertical-align: middle;
+  line-height: 20px;
 }
 .selector-search-select .selector-search-label.none {
   color: var(--text-tip-color);
@@ -1061,15 +1093,16 @@ textarea {
   display: flex;
   top: 50%;
   transform: translateY(-50%);
-  right: 10px;
+  right: 16px;
   font-size: 24px;
   transition: transform 0.2s;
 }
 .selector-search-select .dropdown-icon svg {
-  width: 24px;
-  height: 24px;
+  width: 16px;
+  height: 16px;
 }
 .selector-search-select input {
+  height: 19px;
   width: 100%;
   border: none;
   cursor: default;
@@ -1488,21 +1521,21 @@ body .__react_component_tooltip.type-dark.place-right:after {
 }
 .time-selector-select:active .dropdown-icon,
 .time-selector-select.active .dropdown-icon {
-  transform: rotate(180deg);
+  transform: translateY(-50%) rotate(180deg);
 }
 .time-selector-select .dropdown-icon {
   position: absolute;
   display: flex;
   top: 50%;
-  margin-top: -12px;
-  right: 8px;
+  transform: translateY(-50%);
+  right: 16px;
   font-size: 24px;
   color: var(--text-description-color);
   transition: transform 200ms linear;
 }
 .time-selector-select .dropdown-icon svg {
-  width: 24px;
-  height: 24px;
+  width: 16px;
+  height: 16px;
 }
 .time-selector-option {
   position: absolute;

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.8\",\"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.10\",\"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 */
@@ -3315,10 +3315,41 @@ var checkbox_Checkbox = /*#__PURE__*/function (_Component) {
       })), multe ? /*#__PURE__*/external_react_default.a.createElement("a", {
         onClick: this.handleClick,
         className: external_classnames_default()('kaihei-checkbox-mute', {
-          'active xy-iconfont xy-icon-Qos_checkbox_s': checked,
+          'active': checked,
           disabled: disabled
         }, 'type-' + type)
-      }) : /*#__PURE__*/external_react_default.a.createElement("a", {
+      }, /*#__PURE__*/external_react_default.a.createElement("svg", {
+        width: "12px",
+        height: "12px",
+        viewBox: "0 0 12 12",
+        version: "1.1",
+        xmlns: "http://www.w3.org/2000/svg"
+      }, /*#__PURE__*/external_react_default.a.createElement("g", {
+        id: "\u57FA\u7840\u7840\u4EF6",
+        stroke: "none",
+        strokeWidth: "1",
+        fill: "none",
+        fillRule: "evenodd"
+      }, /*#__PURE__*/external_react_default.a.createElement("g", {
+        id: "\u63A7\u4EF6",
+        transform: "translate(-117.000000, -2389.000000)"
+      }, /*#__PURE__*/external_react_default.a.createElement("g", {
+        id: "\u72B6\u6001",
+        transform: "translate(80.000000, 2387.000000)"
+      }, /*#__PURE__*/external_react_default.a.createElement("g", {
+        id: "\u5B8C\u6210",
+        transform: "translate(35.000000, 0.000000)"
+      }, /*#__PURE__*/external_react_default.a.createElement("g", {
+        id: "\u6B63\u786E",
+        transform: "translate(2.000000, 2.000000)"
+      }, /*#__PURE__*/external_react_default.a.createElement("polyline", {
+        id: "\u8DEF\u5F84-9",
+        stroke: "#FFFFFF",
+        strokeWidth: "2",
+        strokeLinecap: "round",
+        strokeLinejoin: "round",
+        points: "2.26 5.84768747 4.06476748 8.90524154 10.1330175 2.90524154"
+      })))))))) : /*#__PURE__*/external_react_default.a.createElement("a", {
         onClick: this.handleClick,
         className: external_classnames_default()("kaihei-checkbox ".concat(checked ? ' active' : ''), {
           disabled: disabled
@@ -5427,6 +5458,40 @@ function printEmoji(str) {
   });
   return str;
 }
+// CONCATENATED MODULE: ./src/components/icon/IconDropDown.jsx
+
+function IconDropDown() {
+  return /*#__PURE__*/external_react_default.a.createElement("svg", {
+    width: "16px",
+    height: "16px",
+    viewBox: "0 0 16 16",
+    version: "1.1",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/external_react_default.a.createElement("g", {
+    id: "\u57FA\u7840\u7840\u4EF6",
+    stroke: "none",
+    strokeWidth: "1",
+    fill: "none",
+    fillRule: "evenodd"
+  }, /*#__PURE__*/external_react_default.a.createElement("g", {
+    id: "\u63A7\u4EF6",
+    transform: "translate(-1136.000000, -236.000000)"
+  }, /*#__PURE__*/external_react_default.a.createElement("g", {
+    id: "\u4E0B\u62C9\u6846",
+    transform: "translate(848.000000, 224.000000)"
+  }, /*#__PURE__*/external_react_default.a.createElement("g", {
+    id: "\u5C55\u5F00",
+    transform: "translate(288.000000, 12.000000)"
+  }, /*#__PURE__*/external_react_default.a.createElement("g", {
+    id: "\u77E9\u5F62",
+    opacity: "0.100000001"
+  }), /*#__PURE__*/external_react_default.a.createElement("path", {
+    d: "M8.70710678,6.20710678 L12.2928932,9.79289322 12.6834175,10.1834175 12.6834175,10.8165825 12.2928932,11.2071068 C12.1053568,11.3946432 11.8510029,11.5 11.5857864,11.5 L4.41421356,11.5 C3.86192881,11.5 3.41421356,11.0522847 3.41421356,10.5 C3.41421356,10.2347835 3.5195704,9.9804296 3.70710678,9.79289322 L7.29289322,6.20710678 C7.68341751,5.81658249 8.31658249,5.81658249 8.70710678,6.20710678 Z",
+    id: "\u4E09\u89D2\u5F62",
+    fill: "currentColor",
+    transform: "translate(8.000000, 8.500000) rotate(-180.000000) translate(-8.000000, -8.500000) "
+  }))))));
+}
 // CONCATENATED MODULE: ./src/components/selector/selector.jsx
 function selector_typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { selector_typeof = function _typeof(obj) { return typeof obj; }; } else { selector_typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return selector_typeof(obj); }
 
@@ -5463,6 +5528,7 @@ function selector_defineProperty(obj, key, value) { if (key in obj) { Object.def
 
 
 
+
 var selector_Selector = /*#__PURE__*/function (_Component) {
   selector_inherits(Selector, _Component);
 
@@ -5535,8 +5601,9 @@ var selector_Selector = /*#__PURE__*/function (_Component) {
           noTheme = _this$props2.noTheme,
           _this$props2$simple = _this$props2.simple,
           simple = _this$props2$simple === void 0 ? false : _this$props2$simple,
-          optionsWidth = _this$props2.optionsWidth;
-      var baseStyle = {};
+          optionsWidth = _this$props2.optionsWidth,
+          optionStyle = _this$props2.optionStyle;
+      var baseStyle = optionStyle || {};
 
       if (optionsWidth) {
         baseStyle.width = optionsWidth;
@@ -5676,19 +5743,7 @@ var selector_Selector = /*#__PURE__*/function (_Component) {
         }
       })), /*#__PURE__*/external_react_default.a.createElement("span", {
         className: "dropdown-icon"
-      }, /*#__PURE__*/external_react_default.a.createElement("svg", {
-        t: "1655362138862",
-        viewBox: "0 0 1024 1024",
-        version: "1.1",
-        xmlns: "http://www.w3.org/2000/svg",
-        pId: "5770",
-        width: "200",
-        height: "200"
-      }, /*#__PURE__*/external_react_default.a.createElement("path", {
-        d: "M286.144 448.192l24.512 23.808 23.104 21.632 21.76 19.584 20.736 17.472c107.392 87.488 171.52 84.672 281.664-8.448l21.248-18.56 22.4-20.608 23.808-22.72 12.416-12.16a10.752 10.752 0 0 0-7.552-18.432H293.76a10.752 10.752 0 0 0-7.616 18.432z",
-        pId: "5771",
-        fill: "currentColor"
-      })))), this.renderOptions(list, showList), /*#__PURE__*/external_react_default.a.createElement("div", {
+      }, /*#__PURE__*/external_react_default.a.createElement(IconDropDown, null))), this.renderOptions(list, showList), /*#__PURE__*/external_react_default.a.createElement("div", {
         className: "ab-shadow",
         ref: this.loadShadowRef
       }));
@@ -5752,6 +5807,7 @@ function selector_search_defineProperty(obj, key, value) { if (key in obj) { Obj
 
 
 
+
 var selector_search_SelectorSearch = /*#__PURE__*/function (_Component) {
   selector_search_inherits(SelectorSearch, _Component);
 
@@ -6006,19 +6062,7 @@ var selector_search_SelectorSearch = /*#__PURE__*/function (_Component) {
         className: "selector-search-label"
       }, label)), /*#__PURE__*/external_react_default.a.createElement("span", {
         className: "dropdown-icon"
-      }, /*#__PURE__*/external_react_default.a.createElement("svg", {
-        t: "1655362138862",
-        viewBox: "0 0 1024 1024",
-        version: "1.1",
-        xmlns: "http://www.w3.org/2000/svg",
-        pId: "5770",
-        width: "200",
-        height: "200"
-      }, /*#__PURE__*/external_react_default.a.createElement("path", {
-        d: "M286.144 448.192l24.512 23.808 23.104 21.632 21.76 19.584 20.736 17.472c107.392 87.488 171.52 84.672 281.664-8.448l21.248-18.56 22.4-20.608 23.808-22.72 12.416-12.16a10.752 10.752 0 0 0-7.552-18.432H293.76a10.752 10.752 0 0 0-7.616 18.432z",
-        pId: "5771",
-        fill: "currentColor"
-      })))), showList ? /*#__PURE__*/external_react_default.a.createElement("ul", {
+      }, /*#__PURE__*/external_react_default.a.createElement(IconDropDown, null))), showList ? /*#__PURE__*/external_react_default.a.createElement("ul", {
         className: "selector-search-option theme-scroll-bar",
         style: optionsStyle
       }, list) : null);
@@ -6857,6 +6901,7 @@ function time_selector_defineProperty(obj, key, value) { if (key in obj) { Objec
 
 
 
+
 var time_selector_TimeSelector = /*#__PURE__*/function (_Component) {
   time_selector_inherits(TimeSelector, _Component);
 
@@ -7035,19 +7080,7 @@ var time_selector_TimeSelector = /*#__PURE__*/function (_Component) {
         className: "time-selector-label"
       }, "".concat(hour.toString().padStart(2, '0'), ":").concat(minute.toString().padStart(2, '0'))), /*#__PURE__*/external_react_default.a.createElement("span", {
         className: "dropdown-icon"
-      }, /*#__PURE__*/external_react_default.a.createElement("svg", {
-        t: "1655362138862",
-        viewBox: "0 0 1024 1024",
-        version: "1.1",
-        xmlns: "http://www.w3.org/2000/svg",
-        pId: "5770",
-        width: "200",
-        height: "200"
-      }, /*#__PURE__*/external_react_default.a.createElement("path", {
-        d: "M286.144 448.192l24.512 23.808 23.104 21.632 21.76 19.584 20.736 17.472c107.392 87.488 171.52 84.672 281.664-8.448l21.248-18.56 22.4-20.608 23.808-22.72 12.416-12.16a10.752 10.752 0 0 0-7.552-18.432H293.76a10.752 10.752 0 0 0-7.616 18.432z",
-        pId: "5771",
-        fill: "currentColor"
-      })))), displayOption && /*#__PURE__*/external_react_default.a.createElement("div", {
+      }, /*#__PURE__*/external_react_default.a.createElement(IconDropDown, null))), displayOption && /*#__PURE__*/external_react_default.a.createElement("div", {
         className: "time-selector-option",
         ref: function ref(e) {
           return _this2.optionRef = e;

package/package.json

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