@jiaozhiye/qm-design-react 1.3.0-beta.37 → 1.3.0-beta.39

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.
@@ -1,308 +1,311 @@
1
- /*
2
- * @Author: 焦质晔
3
- * @Date: 2021-07-23 19:05:57
4
- * @Last Modified by: 焦质晔
5
- * @Last Modified time: 2022-09-13 10:21:00
6
- */
7
- @import '../../style/common';
8
-
9
- @prefix-form: ~'@{qm-prefix}-form';
10
-
11
- .@{prefix-form} {
12
- position: relative;
13
- .ant-form-item {
14
- margin-bottom: @--margin-md + 2px;
15
- .ant-form-item-label {
16
- & > label[title=''] {
17
- width: 100%;
18
- .ant-select {
19
- text-align: left;
20
- }
21
- }
22
- &-wrap {
23
- line-height: 1.075;
24
- }
25
- }
26
- // placeholder
27
- input::placeholder {
28
- text-align: left;
29
- }
30
- // ant-form-inline
31
- &-with-help {
32
- margin-bottom: @--margin-md + 2px;
33
- }
34
- // valigator
35
- .ant-form-item-explain {
36
- .text-overflow-cut();
37
- display: flex;
38
- gap: @--margin-md;
39
- min-height: auto;
40
- height: @--font-size-sm;
41
- font-size: @--font-size-sm;
42
- line-height: 1;
43
- }
44
- // search
45
- .ant-input-search > .ant-input-group > .ant-input-group-addon {
46
- line-height: 1;
47
- }
48
- // textarea
49
- .ant-input-textarea-show-count {
50
- position: relative;
51
- &::after {
52
- position: absolute;
53
- right: 3px;
54
- bottom: 0;
55
- margin: 0;
56
- }
57
- }
58
- // input extra
59
- .extra-tooltip {
60
- color: @--text-color-secondary-dark;
61
- vertical-align: -0.4em;
62
- transform: scale(1.2);
63
- }
64
- .extra-text {
65
- height: 100%;
66
- display: flex;
67
- align-items: center;
68
- }
69
- .extra-overflow-cut {
70
- .text-overflow-cut();
71
- }
72
- // select
73
- .ant-select {
74
- width: 100%;
75
- }
76
- // input number
77
- .ant-input-number.right {
78
- input {
79
- text-align: right;
80
- }
81
- &.controls {
82
- input {
83
- padding-right: 30px;
84
- }
85
- }
86
- }
87
- // range input
88
- .site-input-left {
89
- border-right-width: 0;
90
- z-index: 1;
91
- }
92
- .site-input-left:hover,
93
- .site-input-left:focus {
94
- border-right-width: 1px;
95
- }
96
- .site-input-right {
97
- border-left-width: 0;
98
- &.ant-input-search .ant-input-affix-wrapper {
99
- border-left-width: 0;
100
- }
101
- }
102
- .site-input-right:hover,
103
- .site-input-right:focus {
104
- border-left-width: 1px;
105
- &.ant-input-search .ant-input-affix-wrapper {
106
- border-left-width: 1px;
107
- }
108
- }
109
- // search-helper-multiple
110
- .search-helper-multiple {
111
- .ant-input-group > .ant-select:first-child {
112
- z-index: 1;
113
- .ant-select-selector {
114
- border-top-right-radius: 0;
115
- border-bottom-right-radius: 0;
116
- }
117
- }
118
- }
119
- // select-multiple
120
- .ant-select-multiple {
121
- .ant-select-selection-overflow-item-rest {
122
- pointer-events: none;
123
- }
124
- }
125
- }
126
- &__only-show {
127
- // ...
128
- }
129
- // ------ size ------
130
- // 40 32 24
131
- &--lg {
132
- }
133
- &--sm {
134
- .ant-form-item-label > label,
135
- .ant-form-item-label .ant-form-item-tooltip {
136
- font-size: @--font-size-sm;
137
- }
138
- }
139
- }
140
-
141
- .ant-picker-footer-extra {
142
- .ant-tag {
143
- cursor: pointer;
144
- }
145
- }
146
-
147
- // immediate
148
- .@{prefix-form}-immediate {
149
- padding: 5px 15px;
150
- .table {
151
- width: 100%;
152
- th,
153
- td {
154
- height: 32px;
155
- text-align: left;
156
- border-bottom: 1px solid @--border-color-secondary;
157
- }
158
- tbody {
159
- tr td {
160
- cursor: pointer;
161
- }
162
- tr:hover,
163
- tr.active {
164
- background-color: @--primary-1;
165
- }
166
- }
167
- }
168
- // 40 32 24
169
- &--lg {
170
- .table {
171
- th,
172
- td {
173
- height: 40px;
174
- }
175
- }
176
- }
177
- &--sm {
178
- .table {
179
- th,
180
- td {
181
- height: 24px;
182
- }
183
- }
184
- }
185
- }
186
-
187
- // city-select
188
- .@{prefix-form}-city-select {
189
- padding: 15px 15px 10px;
190
- max-width: 420px;
191
- .container {
192
- .city-drop {
193
- &-toper {
194
- margin-bottom: 10px;
195
- display: flex;
196
- &__type {
197
- display: inline-block;
198
- }
199
- &__search {
200
- margin-left: 10px;
201
- }
202
- }
203
- &-letter {
204
- display: flex;
205
- flex-wrap: wrap;
206
- margin-bottom: 4px;
207
- .tag {
208
- list-style: none;
209
- line-height: 1.75;
210
- font-size: @--font-size-sm;
211
- padding: 0 8px;
212
- margin: 0 4px 4px 0;
213
- border: 1px solid @--border-color-secondary;
214
- border-radius: @--border-radius-base;
215
- cursor: pointer;
216
- &.actived {
217
- color: @--white;
218
- background-color: @--primary-color;
219
- border-color: @--primary-color;
220
- }
221
- }
222
- }
223
- &-list {
224
- margin-right: -2px;
225
- max-height: 350px;
226
- overflow-y: auto;
227
- dl {
228
- margin: 0;
229
- dt {
230
- float: left;
231
- font-size: 13px;
232
- font-weight: 700;
233
- line-height: 20px;
234
- }
235
- dd {
236
- white-space: normal;
237
- margin-inline-start: 50px;
238
- margin-bottom: 8px;
239
- line-height: 20px;
240
- li {
241
- display: inline-block;
242
- margin-right: 8px;
243
- font-size: 13px;
244
- cursor: pointer;
245
- &:hover {
246
- color: @--primary-color;
247
- }
248
- &.actived {
249
- color: @--primary-color;
250
- }
251
- }
252
- }
253
- }
254
- }
255
- }
256
- }
257
- }
258
-
259
- // region-select
260
- .@{prefix-form}-region-select {
261
- padding: 10px 15px;
262
- .container {
263
- margin-top: -10px;
264
- .region-box {
265
- display: flex;
266
- flex-wrap: wrap;
267
- width: 440px;
268
- line-height: @--line-height-base;
269
- &__item {
270
- margin: 0 5px;
271
- width: 100px;
272
- cursor: pointer;
273
- .text-overflow-cut();
274
- &:hover {
275
- color: @--primary-color;
276
- }
277
- &.actived {
278
- color: @--primary-color;
279
- }
280
- }
281
- }
282
- }
283
- }
284
-
285
- // fields-filter
286
- .@{prefix-form}-fields-filter {
287
- .fields-list {
288
- padding: 4px @--padding-md;
289
- ul {
290
- margin: 0;
291
- li.item {
292
- line-height: 1.75;
293
- .text-overflow-cut();
294
- .handle {
295
- padding: 2px;
296
- color: @--text-color-secondary;
297
- cursor: s-resize;
298
- transform: scale(0.9);
299
- }
300
- }
301
- }
302
- }
303
- &--lg {
304
- }
305
- &--sm {
306
- font-size: @--font-size-sm;
307
- }
308
- }
1
+ /*
2
+ * @Author: 焦质晔
3
+ * @Date: 2021-07-23 19:05:57
4
+ * @Last Modified by: 焦质晔
5
+ * @Last Modified time: 2022-09-13 10:21:00
6
+ */
7
+ @import '../../style/common';
8
+
9
+ @prefix-form: ~'@{qm-prefix}-form';
10
+
11
+ .@{prefix-form} {
12
+ position: relative;
13
+ .ant-form-item {
14
+ margin-bottom: @--margin-md + 2px;
15
+ .ant-form-item-label {
16
+ & > label[title=''] {
17
+ width: 100%;
18
+ .ant-select {
19
+ text-align: left;
20
+ }
21
+ }
22
+ &-wrap {
23
+ line-height: 1.075;
24
+ }
25
+ }
26
+ // placeholder
27
+ input::placeholder {
28
+ text-align: left;
29
+ }
30
+ // ant-form-inline
31
+ &-with-help {
32
+ margin-bottom: @--margin-md + 2px;
33
+ }
34
+ // valigator
35
+ .ant-form-item-explain {
36
+ .text-overflow-cut();
37
+ display: flex;
38
+ gap: @--margin-md;
39
+ min-height: auto;
40
+ height: @--font-size-sm;
41
+ font-size: @--font-size-sm;
42
+ line-height: 1;
43
+ }
44
+ // search
45
+ .ant-input-search > .ant-input-group > .ant-input-group-addon {
46
+ line-height: 1;
47
+ }
48
+ // textarea
49
+ .ant-input-textarea-show-count {
50
+ position: relative;
51
+ &::after {
52
+ position: absolute;
53
+ right: 3px;
54
+ bottom: 0;
55
+ margin: 0;
56
+ }
57
+ }
58
+ // input extra
59
+ .extra-tooltip {
60
+ color: @--text-color-secondary-dark;
61
+ vertical-align: -0.4em;
62
+ transform: scale(1.2);
63
+ }
64
+ .extra-text {
65
+ height: 100%;
66
+ display: flex;
67
+ align-items: center;
68
+ }
69
+ .extra-overflow-cut {
70
+ .text-overflow-cut();
71
+ }
72
+ // select
73
+ .ant-select {
74
+ width: 100%;
75
+ }
76
+ // input number
77
+ .ant-input-number.right {
78
+ input {
79
+ text-align: right;
80
+ }
81
+ &.controls {
82
+ input {
83
+ padding-right: 30px;
84
+ }
85
+ }
86
+ }
87
+ // range input
88
+ .site-input-left {
89
+ border-right-width: 0;
90
+ z-index: 1;
91
+ }
92
+ .site-input-left:hover,
93
+ .site-input-left:focus {
94
+ border-right-width: 1px;
95
+ }
96
+ .site-input-right {
97
+ border-left-width: 0;
98
+ &.ant-input-search .ant-input-affix-wrapper {
99
+ border-left-width: 0;
100
+ }
101
+ }
102
+ .site-input-right:hover,
103
+ .site-input-right:focus {
104
+ border-left-width: 1px;
105
+ &.ant-input-search .ant-input-affix-wrapper {
106
+ border-left-width: 1px;
107
+ }
108
+ }
109
+ // search-helper-multiple
110
+ .search-helper-multiple {
111
+ .ant-input-group > .ant-select:first-child {
112
+ z-index: 1;
113
+ .ant-select-selector {
114
+ border-top-right-radius: 0;
115
+ border-bottom-right-radius: 0;
116
+ }
117
+ }
118
+ }
119
+ // select-multiple
120
+ .ant-select-multiple {
121
+ .ant-select-selection-overflow-item-rest {
122
+ cursor: pointer;
123
+ * {
124
+ pointer-events: none;
125
+ }
126
+ }
127
+ }
128
+ }
129
+ &__only-show {
130
+ // ...
131
+ }
132
+ // ------ size ------
133
+ // 40 32 24
134
+ &--lg {
135
+ }
136
+ &--sm {
137
+ .ant-form-item-label > label,
138
+ .ant-form-item-label .ant-form-item-tooltip {
139
+ font-size: @--font-size-sm;
140
+ }
141
+ }
142
+ }
143
+
144
+ .ant-picker-footer-extra {
145
+ .ant-tag {
146
+ cursor: pointer;
147
+ }
148
+ }
149
+
150
+ // immediate
151
+ .@{prefix-form}-immediate {
152
+ padding: 5px 15px;
153
+ .table {
154
+ width: 100%;
155
+ th,
156
+ td {
157
+ height: 32px;
158
+ text-align: left;
159
+ border-bottom: 1px solid @--border-color-secondary;
160
+ }
161
+ tbody {
162
+ tr td {
163
+ cursor: pointer;
164
+ }
165
+ tr:hover,
166
+ tr.active {
167
+ background-color: @--primary-1;
168
+ }
169
+ }
170
+ }
171
+ // 40 32 24
172
+ &--lg {
173
+ .table {
174
+ th,
175
+ td {
176
+ height: 40px;
177
+ }
178
+ }
179
+ }
180
+ &--sm {
181
+ .table {
182
+ th,
183
+ td {
184
+ height: 24px;
185
+ }
186
+ }
187
+ }
188
+ }
189
+
190
+ // city-select
191
+ .@{prefix-form}-city-select {
192
+ padding: 15px 15px 10px;
193
+ max-width: 420px;
194
+ .container {
195
+ .city-drop {
196
+ &-toper {
197
+ margin-bottom: 10px;
198
+ display: flex;
199
+ &__type {
200
+ display: inline-block;
201
+ }
202
+ &__search {
203
+ margin-left: 10px;
204
+ }
205
+ }
206
+ &-letter {
207
+ display: flex;
208
+ flex-wrap: wrap;
209
+ margin-bottom: 4px;
210
+ .tag {
211
+ list-style: none;
212
+ line-height: 1.75;
213
+ font-size: @--font-size-sm;
214
+ padding: 0 8px;
215
+ margin: 0 4px 4px 0;
216
+ border: 1px solid @--border-color-secondary;
217
+ border-radius: @--border-radius-base;
218
+ cursor: pointer;
219
+ &.actived {
220
+ color: @--white;
221
+ background-color: @--primary-color;
222
+ border-color: @--primary-color;
223
+ }
224
+ }
225
+ }
226
+ &-list {
227
+ margin-right: -2px;
228
+ max-height: 350px;
229
+ overflow-y: auto;
230
+ dl {
231
+ margin: 0;
232
+ dt {
233
+ float: left;
234
+ font-size: 13px;
235
+ font-weight: 700;
236
+ line-height: 20px;
237
+ }
238
+ dd {
239
+ white-space: normal;
240
+ margin-inline-start: 50px;
241
+ margin-bottom: 8px;
242
+ line-height: 20px;
243
+ li {
244
+ display: inline-block;
245
+ margin-right: 8px;
246
+ font-size: 13px;
247
+ cursor: pointer;
248
+ &:hover {
249
+ color: @--primary-color;
250
+ }
251
+ &.actived {
252
+ color: @--primary-color;
253
+ }
254
+ }
255
+ }
256
+ }
257
+ }
258
+ }
259
+ }
260
+ }
261
+
262
+ // region-select
263
+ .@{prefix-form}-region-select {
264
+ padding: 10px 15px;
265
+ .container {
266
+ margin-top: -10px;
267
+ .region-box {
268
+ display: flex;
269
+ flex-wrap: wrap;
270
+ width: 440px;
271
+ line-height: @--line-height-base;
272
+ &__item {
273
+ margin: 0 5px;
274
+ width: 100px;
275
+ cursor: pointer;
276
+ .text-overflow-cut();
277
+ &:hover {
278
+ color: @--primary-color;
279
+ }
280
+ &.actived {
281
+ color: @--primary-color;
282
+ }
283
+ }
284
+ }
285
+ }
286
+ }
287
+
288
+ // fields-filter
289
+ .@{prefix-form}-fields-filter {
290
+ .fields-list {
291
+ padding: 4px @--padding-md;
292
+ ul {
293
+ margin: 0;
294
+ li.item {
295
+ line-height: 1.75;
296
+ .text-overflow-cut();
297
+ .handle {
298
+ padding: 2px;
299
+ color: @--text-color-secondary;
300
+ cursor: s-resize;
301
+ transform: scale(0.9);
302
+ }
303
+ }
304
+ }
305
+ }
306
+ &--lg {
307
+ }
308
+ &--sm {
309
+ font-size: @--font-size-sm;
310
+ }
311
+ }
@@ -0,0 +1 @@
1
+ export declare const OutsideClick: (WrappedComponent: any) => any;