@kaiheila/ui-components 0.1.11 → 0.1.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/main.css CHANGED
@@ -100,15 +100,21 @@ textarea {
100
100
  border-radius: 50%;
101
101
  }
102
102
  .kaihei-loading-spin:before {
103
- border: 3px solid var(--border-color);
103
+ border: 3px solid rgba(0, 0, 0, 0.12);
104
+ }
105
+ .theme-dark .kaihei-loading-spin:before {
106
+ border-color: rgba(255, 255, 255, 0.12);
104
107
  }
105
108
  .kaihei-loading-spin:after {
106
109
  animation-duration: 0.6s;
107
110
  border: 3px solid transparent;
108
- border-top-color: var(--text-tip-color);
111
+ border-top-color: rgba(0, 0, 0, 0.32);
109
112
  -webkit-animation: loaderSpin 0.6s linear infinite;
110
113
  animation: loaderSpin 0.6s linear infinite;
111
114
  }
115
+ .theme-dark .kaihei-loading-spin:after {
116
+ border-top-color: rgba(255, 255, 255, 0.32);
117
+ }
112
118
  .kaihei-loading-spin.block-loading-spin {
113
119
  display: block;
114
120
  margin-left: auto;
@@ -227,6 +233,10 @@ textarea {
227
233
  text-align: center;
228
234
  outline: none;
229
235
  border: 0 none;
236
+ overflow: hidden;
237
+ white-space: nowrap;
238
+ text-overflow: ellipsis;
239
+ max-width: 100%;
230
240
  /*按钮大小*/
231
241
  /*按钮颜色样式*/
232
242
  }
@@ -253,6 +263,7 @@ textarea {
253
263
  height: 36px;
254
264
  min-width: 80px;
255
265
  font-size: 14px;
266
+ line-height: 36px;
256
267
  padding: 0 12px;
257
268
  border-radius: 12px;
258
269
  }
@@ -440,6 +451,12 @@ textarea {
440
451
  width: 18px;
441
452
  line-height: 1;
442
453
  }
454
+ .chuanyu-button.loading .btn-loading-ico .kaihei-loading-spin:before {
455
+ border-color: rgba(255, 255, 255, 0.4);
456
+ }
457
+ .chuanyu-button.loading .btn-loading-ico .kaihei-loading-spin:after {
458
+ border-top-color: rgba(255, 255, 255, 0.72);
459
+ }
443
460
  .size-sm .button-loading-spin {
444
461
  transform-origin: 50%;
445
462
  transform: scale(0.9);
@@ -504,6 +521,15 @@ textarea {
504
521
  vertical-align: middle;
505
522
  box-sizing: border-box;
506
523
  }
524
+ .kaihei-checkbox-mute.type-appprimary:hover:not(.disabled) {
525
+ border-color: var(--color-primary);
526
+ }
527
+ .kaihei-checkbox-mute.type-danger:hover:not(.disabled) {
528
+ border-color: var(--color-error);
529
+ }
530
+ .kaihei-checkbox-mute svg {
531
+ visibility: hidden;
532
+ }
507
533
  .kaihei-checkbox-mute.active {
508
534
  display: inline-flex;
509
535
  justify-content: center;
@@ -520,6 +546,9 @@ textarea {
520
546
  .kaihei-checkbox-mute.active:before {
521
547
  color: white;
522
548
  }
549
+ .kaihei-checkbox-mute.active svg {
550
+ visibility: visible;
551
+ }
523
552
  .kaihei-checkbox-mute.disabled {
524
553
  opacity: 0.5;
525
554
  cursor: not-allowed;
@@ -892,7 +921,7 @@ textarea {
892
921
  }
893
922
  .selector-contain.simple .selector-select {
894
923
  border: none;
895
- padding: 0 30px 0 0;
924
+ padding: 0 16px 0 0;
896
925
  line-height: 1;
897
926
  box-shadow: none;
898
927
  color: var(--text-description-color);
@@ -903,6 +932,9 @@ textarea {
903
932
  box-shadow: none;
904
933
  color: var(--text-color);
905
934
  }
935
+ .selector-contain.simple .selector-select .dropdown-icon {
936
+ right: 0;
937
+ }
906
938
  .selector-option.simple {
907
939
  margin-left: 50%;
908
940
  margin-top: 10px;
@@ -925,7 +957,7 @@ textarea {
925
957
  display: flex;
926
958
  position: relative;
927
959
  width: 100%;
928
- padding: 9px 35px 9px 16px;
960
+ padding: 9px 48px 9px 16px;
929
961
  border: 1px solid var(--border-color);
930
962
  border-radius: 12px;
931
963
  cursor: pointer;
@@ -960,13 +992,13 @@ textarea {
960
992
  display: flex;
961
993
  top: 50%;
962
994
  transform: translateY(-50%);
963
- right: 10px;
995
+ right: 16px;
964
996
  font-size: 24px;
965
997
  transition: transform 0.2s;
966
998
  }
967
999
  .selector-select .dropdown-icon svg {
968
- width: 24px;
969
- height: 24px;
1000
+ width: 16px;
1001
+ height: 16px;
970
1002
  }
971
1003
  .selector-option {
972
1004
  position: absolute;
@@ -1024,7 +1056,7 @@ textarea {
1024
1056
  .selector-search-select {
1025
1057
  position: relative;
1026
1058
  width: 100%;
1027
- padding: 9px 35px 9px 16px;
1059
+ padding: 9px 48px 9px 16px;
1028
1060
  border-radius: 12px;
1029
1061
  border: 1px solid var(--border-color);
1030
1062
  }
@@ -1051,6 +1083,7 @@ textarea {
1051
1083
  overflow: hidden;
1052
1084
  text-overflow: ellipsis;
1053
1085
  vertical-align: middle;
1086
+ line-height: 20px;
1054
1087
  }
1055
1088
  .selector-search-select .selector-search-label.none {
1056
1089
  color: var(--text-tip-color);
@@ -1060,15 +1093,16 @@ textarea {
1060
1093
  display: flex;
1061
1094
  top: 50%;
1062
1095
  transform: translateY(-50%);
1063
- right: 10px;
1096
+ right: 16px;
1064
1097
  font-size: 24px;
1065
1098
  transition: transform 0.2s;
1066
1099
  }
1067
1100
  .selector-search-select .dropdown-icon svg {
1068
- width: 24px;
1069
- height: 24px;
1101
+ width: 16px;
1102
+ height: 16px;
1070
1103
  }
1071
1104
  .selector-search-select input {
1105
+ height: 19px;
1072
1106
  width: 100%;
1073
1107
  border: none;
1074
1108
  cursor: default;
@@ -1487,21 +1521,21 @@ body .__react_component_tooltip.type-dark.place-right:after {
1487
1521
  }
1488
1522
  .time-selector-select:active .dropdown-icon,
1489
1523
  .time-selector-select.active .dropdown-icon {
1490
- transform: rotate(180deg);
1524
+ transform: translateY(-50%) rotate(180deg);
1491
1525
  }
1492
1526
  .time-selector-select .dropdown-icon {
1493
1527
  position: absolute;
1494
1528
  display: flex;
1495
1529
  top: 50%;
1496
- margin-top: -12px;
1497
- right: 8px;
1530
+ transform: translateY(-50%);
1531
+ right: 16px;
1498
1532
  font-size: 24px;
1499
1533
  color: var(--text-description-color);
1500
1534
  transition: transform 200ms linear;
1501
1535
  }
1502
1536
  .time-selector-select .dropdown-icon svg {
1503
- width: 24px;
1504
- height: 24px;
1537
+ width: 16px;
1538
+ height: 16px;
1505
1539
  }
1506
1540
  .time-selector-option {
1507
1541
  position: absolute;
@@ -3315,10 +3315,41 @@ var checkbox_Checkbox = /*#__PURE__*/function (_Component) {
3315
3315
  })), multe ? /*#__PURE__*/external_react_default.a.createElement("a", {
3316
3316
  onClick: this.handleClick,
3317
3317
  className: external_classnames_default()('kaihei-checkbox-mute', {
3318
- 'active xy-iconfont xy-icon-Qos_checkbox_s': checked,
3318
+ 'active': checked,
3319
3319
  disabled: disabled
3320
3320
  }, 'type-' + type)
3321
- }) : /*#__PURE__*/external_react_default.a.createElement("a", {
3321
+ }, /*#__PURE__*/external_react_default.a.createElement("svg", {
3322
+ width: "12px",
3323
+ height: "12px",
3324
+ viewBox: "0 0 12 12",
3325
+ version: "1.1",
3326
+ xmlns: "http://www.w3.org/2000/svg"
3327
+ }, /*#__PURE__*/external_react_default.a.createElement("g", {
3328
+ id: "\u57FA\u7840\u7840\u4EF6",
3329
+ stroke: "none",
3330
+ strokeWidth: "1",
3331
+ fill: "none",
3332
+ fillRule: "evenodd"
3333
+ }, /*#__PURE__*/external_react_default.a.createElement("g", {
3334
+ id: "\u63A7\u4EF6",
3335
+ transform: "translate(-117.000000, -2389.000000)"
3336
+ }, /*#__PURE__*/external_react_default.a.createElement("g", {
3337
+ id: "\u72B6\u6001",
3338
+ transform: "translate(80.000000, 2387.000000)"
3339
+ }, /*#__PURE__*/external_react_default.a.createElement("g", {
3340
+ id: "\u5B8C\u6210",
3341
+ transform: "translate(35.000000, 0.000000)"
3342
+ }, /*#__PURE__*/external_react_default.a.createElement("g", {
3343
+ id: "\u6B63\u786E",
3344
+ transform: "translate(2.000000, 2.000000)"
3345
+ }, /*#__PURE__*/external_react_default.a.createElement("polyline", {
3346
+ id: "\u8DEF\u5F84-9",
3347
+ stroke: "#FFFFFF",
3348
+ strokeWidth: "2",
3349
+ strokeLinecap: "round",
3350
+ strokeLinejoin: "round",
3351
+ points: "2.26 5.84768747 4.06476748 8.90524154 10.1330175 2.90524154"
3352
+ })))))))) : /*#__PURE__*/external_react_default.a.createElement("a", {
3322
3353
  onClick: this.handleClick,
3323
3354
  className: external_classnames_default()("kaihei-checkbox ".concat(checked ? ' active' : ''), {
3324
3355
  disabled: disabled
@@ -5427,6 +5458,40 @@ function printEmoji(str) {
5427
5458
  });
5428
5459
  return str;
5429
5460
  }
5461
+ // CONCATENATED MODULE: ./src/components/icon/IconDropDown.jsx
5462
+
5463
+ function IconDropDown() {
5464
+ return /*#__PURE__*/external_react_default.a.createElement("svg", {
5465
+ width: "16px",
5466
+ height: "16px",
5467
+ viewBox: "0 0 16 16",
5468
+ version: "1.1",
5469
+ xmlns: "http://www.w3.org/2000/svg"
5470
+ }, /*#__PURE__*/external_react_default.a.createElement("g", {
5471
+ id: "\u57FA\u7840\u7840\u4EF6",
5472
+ stroke: "none",
5473
+ strokeWidth: "1",
5474
+ fill: "none",
5475
+ fillRule: "evenodd"
5476
+ }, /*#__PURE__*/external_react_default.a.createElement("g", {
5477
+ id: "\u63A7\u4EF6",
5478
+ transform: "translate(-1136.000000, -236.000000)"
5479
+ }, /*#__PURE__*/external_react_default.a.createElement("g", {
5480
+ id: "\u4E0B\u62C9\u6846",
5481
+ transform: "translate(848.000000, 224.000000)"
5482
+ }, /*#__PURE__*/external_react_default.a.createElement("g", {
5483
+ id: "\u5C55\u5F00",
5484
+ transform: "translate(288.000000, 12.000000)"
5485
+ }, /*#__PURE__*/external_react_default.a.createElement("g", {
5486
+ id: "\u77E9\u5F62",
5487
+ opacity: "0.100000001"
5488
+ }), /*#__PURE__*/external_react_default.a.createElement("path", {
5489
+ 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",
5490
+ id: "\u4E09\u89D2\u5F62",
5491
+ fill: "currentColor",
5492
+ transform: "translate(8.000000, 8.500000) rotate(-180.000000) translate(-8.000000, -8.500000) "
5493
+ }))))));
5494
+ }
5430
5495
  // CONCATENATED MODULE: ./src/components/selector/selector.jsx
5431
5496
  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); }
5432
5497
 
@@ -5463,6 +5528,7 @@ function selector_defineProperty(obj, key, value) { if (key in obj) { Object.def
5463
5528
 
5464
5529
 
5465
5530
 
5531
+
5466
5532
  var selector_Selector = /*#__PURE__*/function (_Component) {
5467
5533
  selector_inherits(Selector, _Component);
5468
5534
 
@@ -5677,19 +5743,7 @@ var selector_Selector = /*#__PURE__*/function (_Component) {
5677
5743
  }
5678
5744
  })), /*#__PURE__*/external_react_default.a.createElement("span", {
5679
5745
  className: "dropdown-icon"
5680
- }, /*#__PURE__*/external_react_default.a.createElement("svg", {
5681
- t: "1655362138862",
5682
- viewBox: "0 0 1024 1024",
5683
- version: "1.1",
5684
- xmlns: "http://www.w3.org/2000/svg",
5685
- pId: "5770",
5686
- width: "200",
5687
- height: "200"
5688
- }, /*#__PURE__*/external_react_default.a.createElement("path", {
5689
- 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",
5690
- pId: "5771",
5691
- fill: "currentColor"
5692
- })))), this.renderOptions(list, showList), /*#__PURE__*/external_react_default.a.createElement("div", {
5746
+ }, /*#__PURE__*/external_react_default.a.createElement(IconDropDown, null))), this.renderOptions(list, showList), /*#__PURE__*/external_react_default.a.createElement("div", {
5693
5747
  className: "ab-shadow",
5694
5748
  ref: this.loadShadowRef
5695
5749
  }));
@@ -5753,6 +5807,7 @@ function selector_search_defineProperty(obj, key, value) { if (key in obj) { Obj
5753
5807
 
5754
5808
 
5755
5809
 
5810
+
5756
5811
  var selector_search_SelectorSearch = /*#__PURE__*/function (_Component) {
5757
5812
  selector_search_inherits(SelectorSearch, _Component);
5758
5813
 
@@ -6007,19 +6062,7 @@ var selector_search_SelectorSearch = /*#__PURE__*/function (_Component) {
6007
6062
  className: "selector-search-label"
6008
6063
  }, label)), /*#__PURE__*/external_react_default.a.createElement("span", {
6009
6064
  className: "dropdown-icon"
6010
- }, /*#__PURE__*/external_react_default.a.createElement("svg", {
6011
- t: "1655362138862",
6012
- viewBox: "0 0 1024 1024",
6013
- version: "1.1",
6014
- xmlns: "http://www.w3.org/2000/svg",
6015
- pId: "5770",
6016
- width: "200",
6017
- height: "200"
6018
- }, /*#__PURE__*/external_react_default.a.createElement("path", {
6019
- 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",
6020
- pId: "5771",
6021
- fill: "currentColor"
6022
- })))), showList ? /*#__PURE__*/external_react_default.a.createElement("ul", {
6065
+ }, /*#__PURE__*/external_react_default.a.createElement(IconDropDown, null))), showList ? /*#__PURE__*/external_react_default.a.createElement("ul", {
6023
6066
  className: "selector-search-option theme-scroll-bar",
6024
6067
  style: optionsStyle
6025
6068
  }, list) : null);
@@ -6858,6 +6901,7 @@ function time_selector_defineProperty(obj, key, value) { if (key in obj) { Objec
6858
6901
 
6859
6902
 
6860
6903
 
6904
+
6861
6905
  var time_selector_TimeSelector = /*#__PURE__*/function (_Component) {
6862
6906
  time_selector_inherits(TimeSelector, _Component);
6863
6907
 
@@ -7036,19 +7080,7 @@ var time_selector_TimeSelector = /*#__PURE__*/function (_Component) {
7036
7080
  className: "time-selector-label"
7037
7081
  }, "".concat(hour.toString().padStart(2, '0'), ":").concat(minute.toString().padStart(2, '0'))), /*#__PURE__*/external_react_default.a.createElement("span", {
7038
7082
  className: "dropdown-icon"
7039
- }, /*#__PURE__*/external_react_default.a.createElement("svg", {
7040
- t: "1655362138862",
7041
- viewBox: "0 0 1024 1024",
7042
- version: "1.1",
7043
- xmlns: "http://www.w3.org/2000/svg",
7044
- pId: "5770",
7045
- width: "200",
7046
- height: "200"
7047
- }, /*#__PURE__*/external_react_default.a.createElement("path", {
7048
- 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",
7049
- pId: "5771",
7050
- fill: "currentColor"
7051
- })))), displayOption && /*#__PURE__*/external_react_default.a.createElement("div", {
7083
+ }, /*#__PURE__*/external_react_default.a.createElement(IconDropDown, null))), displayOption && /*#__PURE__*/external_react_default.a.createElement("div", {
7052
7084
  className: "time-selector-option",
7053
7085
  ref: function ref(e) {
7054
7086
  return _this2.optionRef = e;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kaiheila/ui-components",
3
- "version": "0.1.11",
3
+ "version": "0.1.12",
4
4
  "description": "开黑啦 UI Components",
5
5
  "main": "dist/ui-components.js",
6
6
  "scripts": {