@zat-design/sisyphus-react 4.3.1 → 4.3.2-beta.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.
@@ -108,6 +108,12 @@
108
108
  flex: 1;
109
109
  margin-right: 0;
110
110
  margin-bottom: 0;
111
+ position: relative;
112
+
113
+ &:hover,
114
+ &:focus-within {
115
+ z-index: 2;
116
+ }
111
117
 
112
118
  // 第一个元素后面的所有元素都左移1px以实现紧密连接
113
119
  &:not(:first-child) {
@@ -311,6 +317,12 @@
311
317
  flex: 1;
312
318
  margin-right: 0;
313
319
  margin-bottom: 0;
320
+ position: relative;
321
+
322
+ &:hover,
323
+ &:focus-within {
324
+ z-index: 2;
325
+ }
314
326
 
315
327
  // 第一个元素后面的所有元素都左移1px以实现紧密连接
316
328
  &:not(:first-child) {
@@ -475,6 +487,15 @@
475
487
  border-radius: 0 !important;
476
488
  }
477
489
 
490
+ > .pro-group-form-item {
491
+ position: relative;
492
+
493
+ &:hover,
494
+ &:focus-within {
495
+ z-index: 2;
496
+ }
497
+ }
498
+
478
499
  > .pro-group-form-item:not(:first-child) {
479
500
  .@{ant-prefix}-input,
480
501
  .@{ant-prefix}-select,
@@ -90,24 +90,9 @@
90
90
  ):not(.@{ant-prefix}-btn-compact-item-rtl) {
91
91
  &:hover {
92
92
  position: relative;
93
- z-index: 1;
94
- transition: none;
95
- border-color: var(--ant-primary-color-hover, #1677ff) !important;
96
- &::before {
97
- opacity: 1;
98
- }
99
- }
100
- &::before {
101
- content: '';
102
- position: absolute;
103
- top: -1px;
104
- left: -1px;
105
- width: 1px;
106
- height: calc(100% + 2px);
107
- background: var(--ant-primary-color-hover, #1677ff);
108
- opacity: 0;
109
- display: block;
110
93
  z-index: 2;
94
+ border-color: var(--zaui-brand-hover, #3387ff) !important;
95
+ box-shadow: -1px 0 0 0 var(--zaui-brand-hover, #3387ff);
111
96
  }
112
97
  }
113
98
 
@@ -26,13 +26,13 @@ span.@{ant-prefix}-input-group-compact,
26
26
 
27
27
  .@{ant-prefix}-picker {
28
28
  flex: 1;
29
- border-right: 0;
30
29
  border-top-right-radius: 0 !important;
31
30
  border-bottom-right-radius: 0 !important;
32
31
  }
33
32
 
34
- .@{ant-prefix}-picker-focused {
35
- z-index: 1;
33
+ .@{ant-prefix}-picker-focused,
34
+ .@{ant-prefix}-picker:not(.@{ant-prefix}-picker-disabled):hover {
35
+ z-index: 2;
36
36
  }
37
37
 
38
38
  .forever-checkbox {
@@ -50,12 +50,14 @@ span.@{ant-prefix}-input-group-compact,
50
50
  padding: 4px 11px;
51
51
  background-color: #ffffff;
52
52
  border: 1px solid #d9d9d9;
53
- margin-left: 1px;
53
+ margin-left: 0;
54
+ position: relative;
54
55
  border-top-right-radius: 6px !important;
55
56
  border-bottom-right-radius: 6px !important;
56
57
  transition: all 0.2s;
57
58
 
58
59
  &:hover {
60
+ z-index: 2;
59
61
  border-color: #40a9ff;
60
62
  }
61
63
 
@@ -79,21 +81,18 @@ span.@{ant-prefix}-input-group-compact,
79
81
 
80
82
  // 确保焦点状态下的边框连接正确
81
83
  .@{ant-prefix}-picker:focus {
82
- z-index: 1;
83
- border-right: 0;
84
+ z-index: 2;
84
85
  }
85
86
 
86
87
  .forever-checkbox.@{ant-prefix}-input:focus {
87
- z-index: 1;
88
+ z-index: 2;
88
89
  border-color: #40a9ff;
89
- border-left: 0;
90
90
  box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
91
91
  }
92
92
 
93
93
  // 当日期选择器聚焦时,复选框也要有相应的样式
94
94
  .@{ant-prefix}-picker-focused + .forever-checkbox.@{ant-prefix}-input {
95
95
  border-color: #40a9ff;
96
- border-left: 0;
97
96
  }
98
97
  }
99
98
  }
@@ -310,26 +310,20 @@ const ProIcon = props => {
310
310
  children: /*#__PURE__*/_jsx(Tooltip, {
311
311
  title: iconText,
312
312
  children: buttonIcon && !willBeWrappedByButton ? /*#__PURE__*/_jsx(Button, {
313
+ className: "pro-icon-btn-inner",
313
314
  style: {
314
315
  width: size,
315
- height: size,
316
- border: 'none',
317
- borderRadius: 0,
318
- padding: 0,
319
- verticalAlign: 'baseline'
316
+ height: size
320
317
  },
321
318
  type: "text",
322
319
  icon: icon,
323
320
  ...buttonProps
324
321
  }) : /*#__PURE__*/_jsx(Space, {
325
322
  children: /*#__PURE__*/_jsx("span", {
323
+ className: "pro-icon-wrapper",
326
324
  style: {
327
325
  width: size,
328
- height: size,
329
- border: 'none',
330
- borderRadius: 0,
331
- padding: 0,
332
- verticalAlign: 'baseline'
326
+ height: size
333
327
  },
334
328
  children: icon
335
329
  })
@@ -12,6 +12,17 @@
12
12
  }
13
13
  }
14
14
 
15
+ // 内层图标容器(buttonIcon=false 时的 span,buttonIcon=true 时的 Button)
16
+ // 静态样式统一在此,动态 width/height 通过内联 style 传入
17
+ .pro-icon-wrapper,
18
+ .pro-icon-btn-inner {
19
+ display: inline-block;
20
+ border: none;
21
+ border-radius: 0;
22
+ padding: 0;
23
+ vertical-align: baseline;
24
+ }
25
+
15
26
  .pro-icon-btn {
16
27
  .anticon {
17
28
  display: inline-block;
@@ -20,8 +31,6 @@
20
31
  &.@{ant-prefix}-btn-icon-only {
21
32
  width: auto;
22
33
  height: auto;
23
- padding: 0;
24
34
  vertical-align: 0;
25
- border: 0;
26
35
  }
27
36
  }
@@ -165,8 +165,9 @@
165
165
  background: transparent !important;
166
166
 
167
167
  .@{ant-prefix}-menu-title-content div {
168
- .pro-layout-icon {
169
- color: var(--zaui-text, #343434);
168
+ .pro-layout-icon,
169
+ .anticon {
170
+ color: var(--zaui-text, #343434) !important;
170
171
  }
171
172
 
172
173
  h2 {
@@ -365,7 +365,7 @@
365
365
  .pro-layout-content {
366
366
  margin: 0 !important;
367
367
  background: #fff;
368
- border-top: none;
368
+ border: none;
369
369
  }
370
370
  }
371
371
 
@@ -52,13 +52,13 @@
52
52
  }
53
53
  }
54
54
 
55
- &:hover {
56
- .pro-enum-input-addonAfter:not(.trigger-no-hover):not(.pro-enum-input-addonAfter-not-allowed) {
57
- border-color: var(--zaui-brand-hover, #3387ff);
58
- color: var(--zaui-brand-hover, #3387ff);
59
- }
60
- .pro-enum-input-addonAfter:not(.trigger-no-hover):not(.pro-enum-input-addonAfter-not-allowed)
61
- .pro-tree-modal-view-svg-active {
55
+ .pro-enum-input-addonAfter:not(.trigger-no-hover):not(.pro-enum-input-addonAfter-not-allowed):hover {
56
+ z-index: 2;
57
+ border-color: var(--zaui-brand-hover, #3387ff);
58
+ color: var(--zaui-brand-hover, #3387ff);
59
+ box-shadow: -1px 0 0 0 var(--zaui-brand-hover, #3387ff);
60
+
61
+ .pro-tree-modal-view-svg-active {
62
62
  color: var(--zaui-brand-hover, #3387ff);
63
63
  }
64
64
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zat-design/sisyphus-react",
3
- "version": "4.3.1",
3
+ "version": "4.3.2-beta.1",
4
4
  "license": "MIT",
5
5
  "files": [
6
6
  "es",