@qn-pandora/pandora-component 5.0.2 → 5.1.1

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.
Files changed (105) hide show
  1. package/es/components/AutoComplete/index.js +2 -2
  2. package/es/components/AutoComplete/style.css +110 -22
  3. package/es/components/Breadcrumb/style.css +13 -3
  4. package/es/components/Button/style.css +215 -109
  5. package/es/components/Card/RowExtra/style.css +6 -0
  6. package/es/components/Card/style.css +50 -55
  7. package/es/components/CheckTransformList/style.css +327 -103
  8. package/es/components/Checkbox/style.css +5 -0
  9. package/es/components/CheckboxList/style.css +5 -0
  10. package/es/components/Collapse/style.css +34 -2
  11. package/es/components/DateTimePicker/Base/style.css +446 -56
  12. package/es/components/DateTimePicker/DisplayInput/style.css +218 -40
  13. package/es/components/DateTimePicker/index.js +1 -1
  14. package/es/components/DateTimePicker/style.css +77 -46
  15. package/es/components/Descriptions/style.css +77 -46
  16. package/es/components/Drawer/index.d.ts +6 -6
  17. package/es/components/Drawer/index.js +4 -4
  18. package/es/components/Drawer/style.css +244 -169
  19. package/es/components/Drawer/style.less +8 -0
  20. package/es/components/FileResumable/style.css +12 -42
  21. package/es/components/Input/index.d.ts +1 -1
  22. package/es/components/Input/style.css +218 -40
  23. package/es/components/Menu/style.css +16 -7
  24. package/es/components/Modal/style.css +10 -7
  25. package/es/components/NameLimiter/index.js +1 -1
  26. package/es/components/NameLimiter/style.css +83 -55
  27. package/es/components/OptionList/InlineOptionList/style.css +21 -8
  28. package/es/components/OptionList/OptionItem/style.css +83 -55
  29. package/es/components/OptionList/PopoverOptionList/index.js +1 -1
  30. package/es/components/OptionList/PopoverOptionList/style.css +77 -46
  31. package/es/components/OptionList/style.css +181 -109
  32. package/es/components/RadioGroup/style.css +27 -16
  33. package/es/components/RangeInput/style.css +581 -64
  34. package/es/components/RemarkName/style.css +83 -55
  35. package/es/components/Selector/style.css +110 -22
  36. package/es/components/Spin/style.css +8 -6
  37. package/es/components/Steps/style.css +43 -5
  38. package/es/components/Table/ColumnSetting/style.css +2 -5
  39. package/es/components/Table/ColumnSetting/style.less +2 -3
  40. package/es/components/Table/index.d.ts +12 -9
  41. package/es/components/Table/index.js +73 -84
  42. package/es/components/Table/style.css +99 -61
  43. package/es/components/Tabs/style.css +117 -68
  44. package/es/components/TopologyChart/index.d.ts +7 -0
  45. package/es/components/TopologyChart/index.js +19 -0
  46. package/es/components/TopologyChart/style.css +14 -0
  47. package/es/components/TopologyChart/style.less +14 -0
  48. package/es/components/TreeSelector/style.css +21 -9
  49. package/es/index.css +4134 -3054
  50. package/es/index.d.ts +1 -0
  51. package/es/index.js +1 -0
  52. package/es/index.less +16 -15
  53. package/lib/components/AutoComplete/index.js +2 -2
  54. package/lib/components/AutoComplete/style.css +110 -22
  55. package/lib/components/Breadcrumb/style.css +13 -3
  56. package/lib/components/Button/style.css +215 -109
  57. package/lib/components/Card/RowExtra/style.css +6 -0
  58. package/lib/components/Card/style.css +50 -55
  59. package/lib/components/CheckTransformList/style.css +327 -103
  60. package/lib/components/Checkbox/style.css +5 -0
  61. package/lib/components/CheckboxList/style.css +5 -0
  62. package/lib/components/Collapse/style.css +34 -2
  63. package/lib/components/DateTimePicker/Base/style.css +446 -56
  64. package/lib/components/DateTimePicker/DisplayInput/style.css +218 -40
  65. package/lib/components/DateTimePicker/index.js +1 -1
  66. package/lib/components/DateTimePicker/style.css +77 -46
  67. package/lib/components/Descriptions/style.css +77 -46
  68. package/lib/components/Drawer/index.d.ts +6 -6
  69. package/lib/components/Drawer/index.js +4 -4
  70. package/lib/components/Drawer/style.css +244 -169
  71. package/lib/components/Drawer/style.less +8 -0
  72. package/lib/components/FileResumable/style.css +12 -42
  73. package/lib/components/Input/index.d.ts +1 -1
  74. package/lib/components/Input/style.css +218 -40
  75. package/lib/components/Menu/style.css +16 -7
  76. package/lib/components/Modal/style.css +10 -7
  77. package/lib/components/NameLimiter/index.js +1 -1
  78. package/lib/components/NameLimiter/style.css +83 -55
  79. package/lib/components/OptionList/InlineOptionList/style.css +21 -8
  80. package/lib/components/OptionList/OptionItem/style.css +83 -55
  81. package/lib/components/OptionList/PopoverOptionList/index.js +1 -1
  82. package/lib/components/OptionList/PopoverOptionList/style.css +77 -46
  83. package/lib/components/OptionList/style.css +181 -109
  84. package/lib/components/RadioGroup/style.css +27 -16
  85. package/lib/components/RangeInput/style.css +581 -64
  86. package/lib/components/RemarkName/style.css +83 -55
  87. package/lib/components/Selector/style.css +110 -22
  88. package/lib/components/Spin/style.css +8 -6
  89. package/lib/components/Steps/style.css +43 -5
  90. package/lib/components/Table/ColumnSetting/style.css +2 -5
  91. package/lib/components/Table/ColumnSetting/style.less +2 -3
  92. package/lib/components/Table/index.d.ts +12 -9
  93. package/lib/components/Table/index.js +73 -84
  94. package/lib/components/Table/style.css +99 -61
  95. package/lib/components/Tabs/style.css +117 -68
  96. package/lib/components/TopologyChart/index.d.ts +7 -0
  97. package/lib/components/TopologyChart/index.js +28 -0
  98. package/lib/components/TopologyChart/style.css +14 -0
  99. package/lib/components/TopologyChart/style.less +14 -0
  100. package/lib/components/TreeSelector/style.css +21 -9
  101. package/lib/index.css +10899 -9819
  102. package/lib/index.d.ts +1 -0
  103. package/lib/index.js +6 -1
  104. package/lib/index.less +23 -22
  105. package/package.json +7 -6
@@ -28,7 +28,7 @@ import { SDK_PREFIX } from '../../constants/style';
28
28
  import debounceWrapper from '../../hoc/debounce';
29
29
  export function AutoComplete(props) {
30
30
  var _a;
31
- var className = props.className, dropdownClassName = props.dropdownClassName, ellipsis = props.ellipsis, selectorRef = props.selectorRef, other = __rest(props, ["className", "dropdownClassName", "ellipsis", "selectorRef"]);
31
+ var className = props.className, popupClassName = props.popupClassName, ellipsis = props.ellipsis, selectorRef = props.selectorRef, other = __rest(props, ["className", "popupClassName", "ellipsis", "selectorRef"]);
32
32
  var filterOption = React.useCallback(function (inputValue, option) {
33
33
  var prefix = (inputValue === null || inputValue === void 0 ? void 0 : inputValue.toLowerCase()) || '';
34
34
  var _a = option || {}, value = _a.value, title = _a.title, children = _a.children, label = _a.label;
@@ -48,6 +48,6 @@ export function AutoComplete(props) {
48
48
  ? includes(value.toLowerCase(), prefix)
49
49
  : true;
50
50
  }, []);
51
- return (React.createElement(BaseAutoComplete, __assign({ ref: selectorRef, className: classnames(className, SDK_PREFIX + "-auto-complete", SDK_PREFIX + "-selector"), dropdownClassName: classnames(SDK_PREFIX + "-selector-dropdown", (_a = {}, _a[SDK_PREFIX + "-selector-no-ellipsis"] = !ellipsis, _a), dropdownClassName), filterOption: filterOption, showSearch: true }, other)));
51
+ return (React.createElement(BaseAutoComplete, __assign({ ref: selectorRef, className: classnames(className, SDK_PREFIX + "-auto-complete", SDK_PREFIX + "-selector"), popupClassName: classnames(SDK_PREFIX + "-selector-dropdown", (_a = {}, _a[SDK_PREFIX + "-selector-no-ellipsis"] = !ellipsis, _a), popupClassName), filterOption: filterOption, showSearch: true }, other)));
52
52
  }
53
53
  export default debounceWrapper(AutoComplete);
@@ -37,14 +37,8 @@
37
37
  .ant-select-single .ant-select-selector .ant-select-selection-placeholder {
38
38
  padding: 0;
39
39
  line-height: 30px;
40
- -webkit-transition: all 0.3s;
41
- transition: all 0.3s;
42
- }
43
- @supports (-moz-appearance: meterbar) {
44
- .ant-select-single .ant-select-selector .ant-select-selection-item,
45
- .ant-select-single .ant-select-selector .ant-select-selection-placeholder {
46
- line-height: 30px;
47
- }
40
+ -webkit-transition: all 0.3s, visibility 0s;
41
+ transition: all 0.3s, visibility 0s;
48
42
  }
49
43
  .ant-select-single .ant-select-selector .ant-select-selection-item {
50
44
  position: relative;
@@ -54,6 +48,8 @@
54
48
  user-select: none;
55
49
  }
56
50
  .ant-select-single .ant-select-selector .ant-select-selection-placeholder {
51
+ -webkit-transition: none;
52
+ transition: none;
57
53
  pointer-events: none;
58
54
  }
59
55
  .ant-select-single .ant-select-selector::after,
@@ -187,6 +183,7 @@
187
183
  width: 0;
188
184
  margin: 2px 0;
189
185
  line-height: 24px;
186
+ visibility: hidden;
190
187
  content: '\a0';
191
188
  }
192
189
  .ant-select-multiple.ant-select-show-arrow .ant-select-selector,
@@ -244,10 +241,15 @@
244
241
  text-align: center;
245
242
  text-transform: none;
246
243
  vertical-align: -0.125em;
247
- text-rendering: optimizeLegibility;
244
+ text-rendering: optimizelegibility;
248
245
  -webkit-font-smoothing: antialiased;
249
246
  -moz-osx-font-smoothing: grayscale;
250
- display: inline-block;
247
+ display: -webkit-inline-box;
248
+ display: -ms-inline-flexbox;
249
+ display: inline-flex;
250
+ -webkit-box-align: center;
251
+ -ms-flex-align: center;
252
+ align-items: center;
251
253
  color: rgba(0, 0, 0, 0.45);
252
254
  font-weight: bold;
253
255
  font-size: 10px;
@@ -267,7 +269,7 @@
267
269
  display: block;
268
270
  }
269
271
  .ant-select-multiple .ant-select-selection-item-remove > .anticon {
270
- vertical-align: -0.2em;
272
+ vertical-align: middle;
271
273
  }
272
274
  .ant-select-multiple .ant-select-selection-item-remove:hover {
273
275
  color: rgba(0, 0, 0, 0.75);
@@ -279,8 +281,6 @@
279
281
  .ant-select-multiple .ant-select-selection-search {
280
282
  position: relative;
281
283
  max-width: 100%;
282
- margin-top: 2px;
283
- margin-bottom: 2px;
284
284
  -webkit-margin-start: 7px;
285
285
  margin-inline-start: 7px;
286
286
  }
@@ -353,13 +353,45 @@
353
353
  -webkit-margin-start: 3px;
354
354
  margin-inline-start: 3px;
355
355
  }
356
- .ant-select-multiple.ant-select-lg .ant-select-selection-item {
357
- height: 32px;
358
- line-height: 32px;
359
- }
360
356
  .ant-select-disabled .ant-select-selection-item-remove {
361
357
  display: none;
362
358
  }
359
+ .ant-select-status-error.ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer) .ant-select-selector {
360
+ background-color: #ffffff;
361
+ border-color: #f5222d !important;
362
+ }
363
+ .ant-select-status-error.ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer).ant-select-open .ant-select-selector,
364
+ .ant-select-status-error.ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer).ant-select-focused .ant-select-selector {
365
+ border-color: #ff4d4f;
366
+ -webkit-box-shadow: 0 0 0 2px rgba(245, 34, 45, 0.2);
367
+ box-shadow: 0 0 0 2px rgba(245, 34, 45, 0.2);
368
+ border-right-width: 1px;
369
+ outline: 0;
370
+ }
371
+ .ant-select-status-warning.ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer) .ant-select-selector {
372
+ background-color: transparent;
373
+ border-color: #f0a818 !important;
374
+ }
375
+ .ant-select-status-warning.ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer).ant-select-open .ant-select-selector,
376
+ .ant-select-status-warning.ant-select:not(.ant-select-disabled):not(.ant-select-customize-input):not(.ant-pagination-size-changer).ant-select-focused .ant-select-selector {
377
+ border-color: #fcc442;
378
+ -webkit-box-shadow: 0 0 0 2px rgba(240, 168, 24, 0.2);
379
+ box-shadow: 0 0 0 2px rgba(240, 168, 24, 0.2);
380
+ border-right-width: 1px;
381
+ outline: 0;
382
+ }
383
+ .ant-select-status-error.ant-select-has-feedback .ant-select-clear,
384
+ .ant-select-status-warning.ant-select-has-feedback .ant-select-clear,
385
+ .ant-select-status-success.ant-select-has-feedback .ant-select-clear,
386
+ .ant-select-status-validating.ant-select-has-feedback .ant-select-clear {
387
+ right: 32px;
388
+ }
389
+ .ant-select-status-error.ant-select-has-feedback .ant-select-selection-selected-value,
390
+ .ant-select-status-warning.ant-select-has-feedback .ant-select-selection-selected-value,
391
+ .ant-select-status-success.ant-select-has-feedback .ant-select-selection-selected-value,
392
+ .ant-select-status-validating.ant-select-has-feedback .ant-select-selection-selected-value {
393
+ padding-right: 42px;
394
+ }
363
395
  /* Reset search input style */
364
396
  .ant-select {
365
397
  -webkit-box-sizing: border-box;
@@ -398,7 +430,7 @@
398
430
  border-color: #9ca0a6;
399
431
  -webkit-box-shadow: 0 0 0 2px rgba(122, 134, 154, 0.2);
400
432
  box-shadow: 0 0 0 2px rgba(122, 134, 154, 0.2);
401
- border-right-width: 1px !important;
433
+ border-right-width: 1px;
402
434
  outline: 0;
403
435
  }
404
436
  .ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector {
@@ -429,7 +461,7 @@
429
461
  }
430
462
  .ant-select:not(.ant-select-disabled):hover .ant-select-selector {
431
463
  border-color: #2c6dd2;
432
- border-right-width: 1px !important;
464
+ border-right-width: 1px;
433
465
  }
434
466
  .ant-select-selection-item {
435
467
  -webkit-box-flex: 1;
@@ -465,19 +497,26 @@
465
497
  }
466
498
  }
467
499
  .ant-select-arrow {
468
- display: inline-block;
500
+ display: -webkit-inline-box;
501
+ display: -ms-inline-flexbox;
502
+ display: inline-flex;
469
503
  color: #bfbfbf;
470
504
  font-style: normal;
471
505
  line-height: 0;
472
506
  text-transform: none;
473
507
  vertical-align: -0.125em;
474
- text-rendering: optimizeLegibility;
508
+ text-rendering: optimizelegibility;
475
509
  -webkit-font-smoothing: antialiased;
476
510
  -moz-osx-font-smoothing: grayscale;
477
511
  position: absolute;
478
512
  top: 50%;
479
513
  right: 11px;
480
- width: 12px;
514
+ display: -webkit-box;
515
+ display: -ms-flexbox;
516
+ display: flex;
517
+ -webkit-box-align: center;
518
+ -ms-flex-align: center;
519
+ align-items: center;
481
520
  height: 12px;
482
521
  margin-top: -6px;
483
522
  color: rgba(0, 0, 0, 0.25);
@@ -514,6 +553,10 @@
514
553
  .ant-select-disabled .ant-select-arrow {
515
554
  cursor: not-allowed;
516
555
  }
556
+ .ant-select-arrow > *:not(:last-child) {
557
+ -webkit-margin-end: 8px;
558
+ margin-inline-end: 8px;
559
+ }
517
560
  .ant-select-clear {
518
561
  position: absolute;
519
562
  top: 50%;
@@ -671,6 +714,46 @@
671
714
  -webkit-box-shadow: none !important;
672
715
  box-shadow: none !important;
673
716
  }
717
+ .ant-select.ant-select-in-form-item {
718
+ width: 100%;
719
+ }
720
+ .ant-select-compact-item:not(.ant-select-compact-last-item) {
721
+ margin-right: -1px;
722
+ }
723
+ .ant-select-compact-item:not(.ant-select-compact-last-item).ant-select-compact-item-rtl {
724
+ margin-right: 0;
725
+ margin-left: -1px;
726
+ }
727
+ .ant-select-compact-item:hover > *,
728
+ .ant-select-compact-item:focus > *,
729
+ .ant-select-compact-item:active > * {
730
+ z-index: 2;
731
+ }
732
+ .ant-select-compact-item.ant-select-focused > * {
733
+ z-index: 2;
734
+ }
735
+ .ant-select-compact-item[disabled] > * {
736
+ z-index: 0;
737
+ }
738
+ .ant-select-compact-item:not(.ant-select-compact-first-item):not(.ant-select-compact-last-item).ant-select > .ant-select-selector {
739
+ border-radius: 0;
740
+ }
741
+ .ant-select-compact-item.ant-select-compact-first-item.ant-select:not(.ant-select-compact-last-item):not(.ant-select-compact-item-rtl) > .ant-select-selector {
742
+ border-top-right-radius: 0;
743
+ border-bottom-right-radius: 0;
744
+ }
745
+ .ant-select-compact-item.ant-select-compact-last-item.ant-select:not(.ant-select-compact-first-item):not(.ant-select-compact-item-rtl) > .ant-select-selector {
746
+ border-top-left-radius: 0;
747
+ border-bottom-left-radius: 0;
748
+ }
749
+ .ant-select-compact-item.ant-select.ant-select-compact-first-item.ant-select-compact-item-rtl:not(.ant-select-compact-last-item) > .ant-select-selector {
750
+ border-top-left-radius: 0;
751
+ border-bottom-left-radius: 0;
752
+ }
753
+ .ant-select-compact-item.ant-select.ant-select-compact-last-item.ant-select-compact-item-rtl:not(.ant-select-compact-first-item) > .ant-select-selector {
754
+ border-top-right-radius: 0;
755
+ border-bottom-right-radius: 0;
756
+ }
674
757
  .ant-select-rtl {
675
758
  direction: rtl;
676
759
  }
@@ -874,6 +957,7 @@
874
957
  }
875
958
  .ant-checkbox-disabled .ant-checkbox-input {
876
959
  cursor: not-allowed;
960
+ pointer-events: none;
877
961
  }
878
962
  .ant-checkbox-disabled .ant-checkbox-inner {
879
963
  background-color: #f5f5f5;
@@ -926,6 +1010,10 @@
926
1010
  .ant-checkbox-wrapper + .ant-checkbox-wrapper {
927
1011
  margin-left: 8px;
928
1012
  }
1013
+ .ant-checkbox-wrapper.ant-checkbox-wrapper-in-form-item input[type='checkbox'] {
1014
+ width: 14px;
1015
+ height: 14px;
1016
+ }
929
1017
  .ant-checkbox + span {
930
1018
  padding-right: 8px;
931
1019
  padding-left: 8px;
@@ -20,6 +20,16 @@
20
20
  .ant-breadcrumb .anticon {
21
21
  font-size: 16px;
22
22
  }
23
+ .ant-breadcrumb ol {
24
+ display: -webkit-box;
25
+ display: -ms-flexbox;
26
+ display: flex;
27
+ -ms-flex-wrap: wrap;
28
+ flex-wrap: wrap;
29
+ margin: 0;
30
+ padding: 0;
31
+ list-style: none;
32
+ }
23
33
  .ant-breadcrumb a {
24
34
  color: #999999;
25
35
  -webkit-transition: color 0.3s;
@@ -28,13 +38,13 @@
28
38
  .ant-breadcrumb a:hover {
29
39
  color: #999999;
30
40
  }
31
- .ant-breadcrumb > span:last-child {
41
+ .ant-breadcrumb li:last-child {
32
42
  color: rgba(0, 0, 0, 0.85);
33
43
  }
34
- .ant-breadcrumb > span:last-child a {
44
+ .ant-breadcrumb li:last-child a {
35
45
  color: rgba(0, 0, 0, 0.85);
36
46
  }
37
- .ant-breadcrumb > span:last-child .ant-breadcrumb-separator {
47
+ li:last-child > .ant-breadcrumb-separator {
38
48
  display: none;
39
49
  }
40
50
  .ant-breadcrumb-separator {