dtable-ui-component 6.0.26 → 6.0.27

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 (73) hide show
  1. package/lib/DateEditor/mb-date-editor-popover/index.js +3 -3
  2. package/lib/FileFormatter/index.js +98 -38
  3. package/lib/FileItemFormatter/index.js +3 -1
  4. package/lib/index.js +1 -106
  5. package/package.json +3 -12
  6. package/lib/ActionSheet/index.js +0 -194
  7. package/lib/ActionSheet/style/index.css +0 -365
  8. package/lib/ActivityIndicator/index.css +0 -108
  9. package/lib/ActivityIndicator/index.js +0 -76
  10. package/lib/Badge/index.css +0 -96
  11. package/lib/Badge/index.js +0 -65
  12. package/lib/DatePicker/index.js +0 -120
  13. package/lib/DatePicker/locale/en_US.js +0 -14
  14. package/lib/DatePicker/locale/ru_RU.js +0 -14
  15. package/lib/DatePicker/locale/sv_SE.js +0 -14
  16. package/lib/DatePicker/locale/zh_CN.js +0 -14
  17. package/lib/DatePicker/style/index.css +0 -290
  18. package/lib/DatePicker/utils.js +0 -36
  19. package/lib/Drawer/index.css +0 -142
  20. package/lib/Drawer/index.js +0 -21
  21. package/lib/Icon/index.css +0 -50
  22. package/lib/Icon/index.js +0 -35
  23. package/lib/Icon/load-sprite.js +0 -56
  24. package/lib/InputItem/custom-input.js +0 -321
  25. package/lib/InputItem/custom-keyboard.js +0 -162
  26. package/lib/InputItem/index.js +0 -389
  27. package/lib/InputItem/input.js +0 -45
  28. package/lib/InputItem/locale/en_US.js +0 -12
  29. package/lib/InputItem/locale/ru_RU.js +0 -12
  30. package/lib/InputItem/locale/sv_SE.js +0 -12
  31. package/lib/InputItem/locale/zh_CN.js +0 -12
  32. package/lib/InputItem/portal.js +0 -23
  33. package/lib/InputItem/style/index.css +0 -512
  34. package/lib/List/index.css +0 -381
  35. package/lib/List/index.js +0 -41
  36. package/lib/List/list-item.js +0 -169
  37. package/lib/Modal/alert.js +0 -82
  38. package/lib/Modal/index.js +0 -16
  39. package/lib/Modal/modal.js +0 -118
  40. package/lib/Modal/operation.js +0 -77
  41. package/lib/Modal/prompt.js +0 -207
  42. package/lib/Modal/style/index.css +0 -580
  43. package/lib/Picker/AbstractPicker.js +0 -190
  44. package/lib/Picker/index.js +0 -28
  45. package/lib/Picker/locale/en_US.js +0 -12
  46. package/lib/Picker/locale/ru_RU.js +0 -12
  47. package/lib/Picker/locale/sv_SE.js +0 -12
  48. package/lib/Picker/locale/zh_CN.js +0 -12
  49. package/lib/Picker/popupProps.js +0 -12
  50. package/lib/Picker/style/index.css +0 -141
  51. package/lib/Popover/index.js +0 -63
  52. package/lib/Popover/item.js +0 -55
  53. package/lib/Popover/style/index.css +0 -229
  54. package/lib/Progress/index.css +0 -22
  55. package/lib/Progress/index.js +0 -66
  56. package/lib/Radio/Radio.js +0 -47
  57. package/lib/Radio/RadioItem.js +0 -57
  58. package/lib/Radio/index.css +0 -90
  59. package/lib/Radio/index.js +0 -12
  60. package/lib/TabBar/Tab.js +0 -76
  61. package/lib/TabBar/index.css +0 -138
  62. package/lib/TabBar/index.js +0 -129
  63. package/lib/Tabs/index.css +0 -443
  64. package/lib/Tabs/index.js +0 -39
  65. package/lib/TextareaItem/index.css +0 -231
  66. package/lib/TextareaItem/index.js +0 -231
  67. package/lib/Toast/index.css +0 -65
  68. package/lib/Toast/index.js +0 -131
  69. package/lib/_util/class.js +0 -34
  70. package/lib/_util/closest.js +0 -17
  71. package/lib/_util/exenv.js +0 -8
  72. package/lib/_util/getDataAttr.js +0 -15
  73. package/lib/_util/getLocale.js +0 -42
@@ -1,365 +0,0 @@
1
- .am-action-sheet-wrap {
2
- position: fixed;
3
- overflow: auto;
4
- top: 0;
5
- right: 0;
6
- bottom: 0;
7
- left: 0;
8
- z-index: 1000;
9
- -webkit-overflow-scrolling: touch;
10
- outline: 0;
11
- }
12
-
13
- .am-action-sheet-mask {
14
- position: fixed;
15
- top: 0;
16
- right: 0;
17
- left: 0;
18
- bottom: 0;
19
- background-color: rgba(0, 0, 0, 0.4);
20
- height: 100%;
21
- z-index: 1000;
22
- }
23
-
24
- .am-action-sheet-mask-hidden {
25
- display: none;
26
- }
27
-
28
- .am-action-sheet-close {
29
- display: none;
30
- }
31
-
32
- .am-action-sheet {
33
- position: fixed;
34
- left: 0;
35
- bottom: 0;
36
- width: 100%;
37
- background-color: #fff;
38
- padding-bottom: env(safe-area-inset-bottom);
39
- }
40
-
41
- .am-action-sheet.am-action-sheet-share {
42
- background-color: #f2f2f2;
43
- }
44
-
45
- .am-action-sheet-title,
46
- .am-action-sheet-message {
47
- margin: 15px auto;
48
- padding: 0 15px;
49
- text-align: center;
50
- }
51
-
52
- .am-action-sheet-title {
53
- font-size: 17px;
54
- }
55
-
56
- .am-action-sheet-message {
57
- color: #888;
58
- font-size: 14px;
59
- }
60
-
61
- .am-action-sheet-button-list {
62
- text-align: center;
63
- color: #000;
64
- }
65
-
66
- .am-action-sheet-button-list-item {
67
- font-size: 18px;
68
- padding: 0 8px;
69
- margin: 0;
70
- position: relative;
71
- height: 50px;
72
- line-height: 50px;
73
- -webkit-box-sizing: border-box;
74
- box-sizing: border-box;
75
- white-space: nowrap;
76
- text-overflow: ellipsis;
77
- overflow-x: hidden;
78
- border-top: 1PX solid #ddd;
79
- }
80
-
81
- @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
82
- html:not([data-scale]) .am-action-sheet-button-list-item {
83
- border-top: none;
84
- }
85
-
86
- html:not([data-scale]) .am-action-sheet-button-list-item::before {
87
- content: '';
88
- position: absolute;
89
- background-color: #ddd;
90
- display: block;
91
- z-index: 1;
92
- top: 0;
93
- right: auto;
94
- bottom: auto;
95
- left: 0;
96
- width: 100%;
97
- height: 1PX;
98
- -webkit-transform-origin: 50% 50%;
99
- -ms-transform-origin: 50% 50%;
100
- transform-origin: 50% 50%;
101
- -webkit-transform: scaleY(0.5);
102
- -ms-transform: scaleY(0.5);
103
- transform: scaleY(0.5);
104
- }
105
- }
106
-
107
- @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
108
- html:not([data-scale]) .am-action-sheet-button-list-item::before {
109
- -webkit-transform: scaleY(0.33);
110
- -ms-transform: scaleY(0.33);
111
- transform: scaleY(0.33);
112
- }
113
- }
114
-
115
- .am-action-sheet-button-list-item.am-action-sheet-button-list-item-active {
116
- background-color: #ddd;
117
- }
118
-
119
- .am-action-sheet-button-list-badge {
120
- display: -webkit-box;
121
- display: -webkit-flex;
122
- display: -ms-flexbox;
123
- display: flex;
124
- -webkit-box-align: center;
125
- -webkit-align-items: center;
126
- -ms-flex-align: center;
127
- align-items: center;
128
- -webkit-box-pack: center;
129
- -webkit-justify-content: center;
130
- -ms-flex-pack: center;
131
- justify-content: center;
132
- }
133
-
134
- .am-action-sheet-button-list-badge .am-badge {
135
- margin-left: 8px;
136
- -webkit-flex-shrink: 0;
137
- -ms-flex-negative: 0;
138
- flex-shrink: 0;
139
- }
140
-
141
- .am-action-sheet-button-list-item-content {
142
- display: inline-block;
143
- white-space: nowrap;
144
- overflow: hidden;
145
- text-overflow: ellipsis;
146
- }
147
-
148
- .am-action-sheet-button-list .am-action-sheet-cancel-button {
149
- padding-top: 6px;
150
- position: relative;
151
- }
152
-
153
- .am-action-sheet-button-list .am-action-sheet-cancel-button-mask {
154
- position: absolute;
155
- top: 0;
156
- left: 0;
157
- width: 100%;
158
- height: 6px;
159
- background-color: #e7e7ed;
160
- border-top: 1PX solid #ddd;
161
- border-bottom: 1PX solid #ddd;
162
- }
163
-
164
- @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
165
- html:not([data-scale]) .am-action-sheet-button-list .am-action-sheet-cancel-button-mask {
166
- border-top: none;
167
- }
168
-
169
- html:not([data-scale]) .am-action-sheet-button-list .am-action-sheet-cancel-button-mask::before {
170
- content: '';
171
- position: absolute;
172
- background-color: #ddd;
173
- display: block;
174
- z-index: 1;
175
- top: 0;
176
- right: auto;
177
- bottom: auto;
178
- left: 0;
179
- width: 100%;
180
- height: 1PX;
181
- -webkit-transform-origin: 50% 50%;
182
- -ms-transform-origin: 50% 50%;
183
- transform-origin: 50% 50%;
184
- -webkit-transform: scaleY(0.5);
185
- -ms-transform: scaleY(0.5);
186
- transform: scaleY(0.5);
187
- }
188
- }
189
-
190
- @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
191
- html:not([data-scale]) .am-action-sheet-button-list .am-action-sheet-cancel-button-mask::before {
192
- -webkit-transform: scaleY(0.33);
193
- -ms-transform: scaleY(0.33);
194
- transform: scaleY(0.33);
195
- }
196
- }
197
-
198
- @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
199
- html:not([data-scale]) .am-action-sheet-button-list .am-action-sheet-cancel-button-mask {
200
- border-bottom: none;
201
- }
202
-
203
- html:not([data-scale]) .am-action-sheet-button-list .am-action-sheet-cancel-button-mask::after {
204
- content: '';
205
- position: absolute;
206
- background-color: #ddd;
207
- display: block;
208
- z-index: 1;
209
- top: auto;
210
- right: auto;
211
- bottom: 0;
212
- left: 0;
213
- width: 100%;
214
- height: 1PX;
215
- -webkit-transform-origin: 50% 100%;
216
- -ms-transform-origin: 50% 100%;
217
- transform-origin: 50% 100%;
218
- -webkit-transform: scaleY(0.5);
219
- -ms-transform: scaleY(0.5);
220
- transform: scaleY(0.5);
221
- }
222
- }
223
-
224
- @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
225
- html:not([data-scale]) .am-action-sheet-button-list .am-action-sheet-cancel-button-mask::after {
226
- -webkit-transform: scaleY(0.33);
227
- -ms-transform: scaleY(0.33);
228
- transform: scaleY(0.33);
229
- }
230
- }
231
-
232
- .am-action-sheet-button-list .am-action-sheet-destructive-button {
233
- color: #f4333c;
234
- }
235
-
236
- .am-action-sheet-share-list {
237
- display: -webkit-box;
238
- display: -webkit-flex;
239
- display: -ms-flexbox;
240
- display: flex;
241
- position: relative;
242
- border-top: 1PX solid #ddd;
243
- padding: 21px 0 21px 15px;
244
- overflow-y: scroll;
245
- -webkit-overflow-scrolling: touch;
246
- }
247
-
248
- @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
249
- html:not([data-scale]) .am-action-sheet-share-list {
250
- border-top: none;
251
- }
252
-
253
- html:not([data-scale]) .am-action-sheet-share-list::before {
254
- content: '';
255
- position: absolute;
256
- background-color: #ddd;
257
- display: block;
258
- z-index: 1;
259
- top: 0;
260
- right: auto;
261
- bottom: auto;
262
- left: 0;
263
- width: 100%;
264
- height: 1PX;
265
- -webkit-transform-origin: 50% 50%;
266
- -ms-transform-origin: 50% 50%;
267
- transform-origin: 50% 50%;
268
- -webkit-transform: scaleY(0.5);
269
- -ms-transform: scaleY(0.5);
270
- transform: scaleY(0.5);
271
- }
272
- }
273
-
274
- @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
275
- html:not([data-scale]) .am-action-sheet-share-list::before {
276
- -webkit-transform: scaleY(0.33);
277
- -ms-transform: scaleY(0.33);
278
- transform: scaleY(0.33);
279
- }
280
- }
281
-
282
- .am-action-sheet-share-list-item {
283
- -webkit-box-flex: 0;
284
- -webkit-flex: none;
285
- -ms-flex: none;
286
- flex: none;
287
- margin: 0 12px 0 0;
288
- }
289
-
290
- .am-action-sheet-share-list-item-icon {
291
- margin-bottom: 9px;
292
- width: 60px;
293
- height: 60px;
294
- background-color: #fff;
295
- border-radius: 3px;
296
- display: -webkit-box;
297
- display: -webkit-flex;
298
- display: -ms-flexbox;
299
- display: flex;
300
- -webkit-box-pack: center;
301
- -webkit-justify-content: center;
302
- -ms-flex-pack: center;
303
- justify-content: center;
304
- -webkit-box-align: center;
305
- -webkit-align-items: center;
306
- -ms-flex-align: center;
307
- align-items: center;
308
- }
309
-
310
- .am-action-sheet-share-list-item-title {
311
- color: #888;
312
- font-size: 10px;
313
- text-align: center;
314
- }
315
-
316
- .am-action-sheet-share-cancel-button {
317
- height: 50px;
318
- line-height: 50px;
319
- text-align: center;
320
- background-color: #fff;
321
- color: #000;
322
- font-size: 18px;
323
- position: relative;
324
- border-top: 1PX solid #ddd;
325
- -webkit-box-sizing: border-box;
326
- box-sizing: border-box;
327
- }
328
-
329
- @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
330
- html:not([data-scale]) .am-action-sheet-share-cancel-button {
331
- border-top: none;
332
- }
333
-
334
- html:not([data-scale]) .am-action-sheet-share-cancel-button::before {
335
- content: '';
336
- position: absolute;
337
- background-color: #ddd;
338
- display: block;
339
- z-index: 1;
340
- top: 0;
341
- right: auto;
342
- bottom: auto;
343
- left: 0;
344
- width: 100%;
345
- height: 1PX;
346
- -webkit-transform-origin: 50% 50%;
347
- -ms-transform-origin: 50% 50%;
348
- transform-origin: 50% 50%;
349
- -webkit-transform: scaleY(0.5);
350
- -ms-transform: scaleY(0.5);
351
- transform: scaleY(0.5);
352
- }
353
- }
354
-
355
- @media (-webkit-min-device-pixel-ratio: 2) and (-webkit-min-device-pixel-ratio: 3), (min-resolution: 2dppx) and (min-resolution: 3dppx) {
356
- html:not([data-scale]) .am-action-sheet-share-cancel-button::before {
357
- -webkit-transform: scaleY(0.33);
358
- -ms-transform: scaleY(0.33);
359
- transform: scaleY(0.33);
360
- }
361
- }
362
-
363
- .am-action-sheet-share-cancel-button.am-action-sheet-share-cancel-button-active {
364
- background-color: #ddd;
365
- }
@@ -1,108 +0,0 @@
1
- .am-activity-indicator {
2
- display: -webkit-box;
3
- display: -webkit-flex;
4
- display: -ms-flexbox;
5
- display: flex;
6
- -webkit-box-align: center;
7
- -webkit-align-items: center;
8
- -ms-flex-align: center;
9
- align-items: center;
10
- z-index: 99;
11
- }
12
-
13
- .am-activity-indicator-spinner {
14
- display: inline-block;
15
- width: 20px;
16
- height: 20px;
17
- background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%22-2.125%20-1.875%2064%2064%22%3E%3Cpath%20fill%3D%22%23CCC%22%20d%3D%22M29.875-1.875c-17.673%200-32%2014.327-32%2032s14.327%2032%2032%2032%2032-14.327%2032-32-14.327-32-32-32zm0%2060.7c-15.85%200-28.7-12.85-28.7-28.7s12.85-28.7%2028.7-28.7%2028.7%2012.85%2028.7%2028.7-12.85%2028.7-28.7%2028.7z%22%2F%3E%3Cpath%20fill%3D%22%23108ee9%22%20d%3D%22M61.858%2030.34c.003-.102.008-.203.008-.305%200-11.43-5.996-21.452-15.01-27.113l-.013.026c-.24-.137-.515-.22-.81-.22-.912%200-1.65.738-1.65%201.65%200%20.654.384%201.215.937%201.482%207.963%205.1%2013.247%2014.017%2013.247%2024.176%200%20.147-.01.293-.01.44h.022c0%20.01-.004.02-.004.03%200%20.91.74%201.65%201.65%201.65s1.65-.74%201.65-1.65c0-.06-.012-.112-.018-.167z%22%2F%3E%3C%2Fsvg%3E");
18
- background-position: 50%;
19
- background-size: 100%;
20
- background-repeat: no-repeat;
21
- -webkit-animation: spinner-anime 1s linear infinite;
22
- animation: spinner-anime 1s linear infinite;
23
- }
24
-
25
- .am-activity-indicator-tip {
26
- font-size: 14px;
27
- margin-left: 8px;
28
- color: #000;
29
- opacity: 0.4;
30
- }
31
-
32
- .am-activity-indicator.am-activity-indicator-toast {
33
- position: fixed;
34
- top: 0;
35
- left: 0;
36
- width: 100%;
37
- height: 100%;
38
- display: -webkit-box;
39
- display: -webkit-flex;
40
- display: -ms-flexbox;
41
- display: flex;
42
- -webkit-box-pack: center;
43
- -webkit-justify-content: center;
44
- -ms-flex-pack: center;
45
- justify-content: center;
46
- -webkit-box-align: center;
47
- -webkit-align-items: center;
48
- -ms-flex-align: center;
49
- align-items: center;
50
- text-align: center;
51
- z-index: 1999;
52
- }
53
-
54
- .am-activity-indicator.am-activity-indicator-toast .am-activity-indicator-spinner {
55
- margin: 0;
56
- }
57
-
58
- .am-activity-indicator.am-activity-indicator-toast .am-activity-indicator-toast {
59
- display: inline-block;
60
- position: relative;
61
- top: 4px;
62
- }
63
-
64
- .am-activity-indicator-content {
65
- display: -webkit-box;
66
- display: -webkit-flex;
67
- display: -ms-flexbox;
68
- display: flex;
69
- -webkit-box-orient: vertical;
70
- -webkit-box-direction: normal;
71
- -webkit-flex-direction: column;
72
- -ms-flex-direction: column;
73
- flex-direction: column;
74
- -webkit-box-pack: center;
75
- -webkit-justify-content: center;
76
- -ms-flex-pack: center;
77
- justify-content: center;
78
- -webkit-box-align: center;
79
- -webkit-align-items: center;
80
- -ms-flex-align: center;
81
- align-items: center;
82
- padding: 15px 15px;
83
- border-radius: 7px;
84
- background-clip: padding-box;
85
- color: #fff;
86
- background-color: rgba(58, 58, 58, 0.9);
87
- font-size: 15px;
88
- line-height: 20px;
89
- }
90
-
91
- .am-activity-indicator-spinner-lg {
92
- width: 32px;
93
- height: 32px;
94
- }
95
-
96
- @-webkit-keyframes spinner-anime {
97
- 100% {
98
- -webkit-transform: rotate(360deg);
99
- transform: rotate(360deg);
100
- }
101
- }
102
-
103
- @keyframes spinner-anime {
104
- 100% {
105
- -webkit-transform: rotate(360deg);
106
- transform: rotate(360deg);
107
- }
108
- }
@@ -1,76 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
- var _classnames = _interopRequireDefault(require("classnames"));
10
- var React = _interopRequireWildcard(require("react"));
11
- require("./index.css");
12
- /* tslint:disable:jsx-no-multiline-js */
13
-
14
- class ActivityIndicator extends React.Component {
15
- render() {
16
- const {
17
- prefixCls,
18
- className,
19
- animating,
20
- toast,
21
- size,
22
- text
23
- } = this.props;
24
- const wrapClass = (0, _classnames.default)(prefixCls, className, {
25
- ["".concat(prefixCls, "-lg")]: size === 'large',
26
- ["".concat(prefixCls, "-sm")]: size === 'small',
27
- ["".concat(prefixCls, "-toast")]: !!toast
28
- });
29
- const spinnerClass = (0, _classnames.default)("".concat(prefixCls, "-spinner"), {
30
- ["".concat(prefixCls, "-spinner-lg")]: !!toast || size === 'large'
31
- });
32
- if (animating) {
33
- if (toast) {
34
- return /*#__PURE__*/React.createElement("div", {
35
- className: wrapClass
36
- }, text ? /*#__PURE__*/React.createElement("div", {
37
- className: "".concat(prefixCls, "-content")
38
- }, /*#__PURE__*/React.createElement("span", {
39
- className: spinnerClass,
40
- "aria-hidden": "true"
41
- }), /*#__PURE__*/React.createElement("span", {
42
- className: "".concat(prefixCls, "-toast")
43
- }, text)) : /*#__PURE__*/React.createElement("div", {
44
- className: "".concat(prefixCls, "-content")
45
- }, /*#__PURE__*/React.createElement("span", {
46
- className: spinnerClass,
47
- "aria-label": "Loading"
48
- })));
49
- } else {
50
- return text ? /*#__PURE__*/React.createElement("div", {
51
- className: wrapClass
52
- }, /*#__PURE__*/React.createElement("span", {
53
- className: spinnerClass,
54
- "aria-hidden": "true"
55
- }), /*#__PURE__*/React.createElement("span", {
56
- className: "".concat(prefixCls, "-tip")
57
- }, text)) : /*#__PURE__*/React.createElement("div", {
58
- className: wrapClass
59
- }, /*#__PURE__*/React.createElement("span", {
60
- className: spinnerClass,
61
- "aria-label": "loading"
62
- }));
63
- }
64
- } else {
65
- return null;
66
- }
67
- }
68
- }
69
- exports.default = ActivityIndicator;
70
- ActivityIndicator.defaultProps = {
71
- prefixCls: 'am-activity-indicator',
72
- animating: true,
73
- size: 'small',
74
- panelColor: 'rgba(34,34,34,0.6)',
75
- toast: false
76
- };
@@ -1,96 +0,0 @@
1
- .am-badge {
2
- position: relative;
3
- display: inline-block;
4
- line-height: 1;
5
- vertical-align: middle;
6
- }
7
-
8
- .am-badge-text {
9
- text-rendering: optimizeLegibility;
10
- -webkit-font-smoothing: antialiased;
11
- -moz-osx-font-smoothing: grayscale;
12
- position: absolute;
13
- top: -6px;
14
- height: 18px;
15
- line-height: 18px;
16
- min-width: 9px;
17
- border-radius: 12px;
18
- padding: 0 5px;
19
- text-align: center;
20
- font-size: 12px;
21
- color: #fff;
22
- background-color: #ff5b05;
23
- white-space: nowrap;
24
- -webkit-transform: translateX(-45%);
25
- -ms-transform: translateX(-45%);
26
- transform: translateX(-45%);
27
- -webkit-transform-origin: -10% center;
28
- -ms-transform-origin: -10% center;
29
- transform-origin: -10% center;
30
- z-index: 10;
31
- font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "\5FAE\8F6F\96C5\9ED1", SimSun, sans-serif;
32
- }
33
-
34
- .am-badge-text a {
35
- color: #fff;
36
- }
37
-
38
- .am-badge-text p {
39
- margin: 0;
40
- padding: 0;
41
- }
42
-
43
- .am-badge-hot .am-badge-text {
44
- background-color: #f96268;
45
- }
46
-
47
- .am-badge-dot {
48
- position: absolute;
49
- -webkit-transform: translateX(-50%);
50
- -ms-transform: translateX(-50%);
51
- transform: translateX(-50%);
52
- -webkit-transform-origin: 0 center;
53
- -ms-transform-origin: 0 center;
54
- transform-origin: 0 center;
55
- top: -4px;
56
- height: 8px;
57
- width: 8px;
58
- border-radius: 100%;
59
- background: #ff5b05;
60
- z-index: 10;
61
- }
62
-
63
- .am-badge-dot-large {
64
- height: 16px;
65
- width: 16px;
66
- }
67
-
68
- .am-badge-not-a-wrapper .am-badge-text,
69
- .am-badge-not-a-wrapper .am-badge-dot {
70
- top: auto;
71
- display: block;
72
- position: relative;
73
- -webkit-transform: translateX(0);
74
- -ms-transform: translateX(0);
75
- transform: translateX(0);
76
- }
77
-
78
- .am-badge-corner {
79
- width: 80px;
80
- padding: 8px;
81
- position: absolute;
82
- right: -32px;
83
- top: 8px;
84
- background-color: #ff5b05;
85
- color: #fff;
86
- white-space: nowrap;
87
- -webkit-transform: rotate(45deg);
88
- -ms-transform: rotate(45deg);
89
- transform: rotate(45deg);
90
- text-align: center;
91
- font-size: 15px;
92
- }
93
-
94
- .am-badge-corner-wrapper {
95
- overflow: hidden;
96
- }
@@ -1,65 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
5
- Object.defineProperty(exports, "__esModule", {
6
- value: true
7
- });
8
- exports.default = void 0;
9
- var _classnames = _interopRequireDefault(require("classnames"));
10
- var React = _interopRequireWildcard(require("react"));
11
- require("./index.css");
12
- class Badge extends React.Component {
13
- render() {
14
- // tslint:disable:prefer-const
15
- let {
16
- className,
17
- prefixCls,
18
- children,
19
- text,
20
- size,
21
- overflowCount,
22
- dot,
23
- corner,
24
- hot,
25
- ...restProps
26
- } = this.props;
27
- // eslint-disable-next-line no-self-assign
28
- overflowCount = overflowCount;
29
- text = typeof text === 'number' && text > overflowCount ? "".concat(overflowCount, "+") : text;
30
-
31
- // dot mode don't need text
32
- if (dot) {
33
- text = '';
34
- }
35
- const scrollNumberCls = (0, _classnames.default)({
36
- ["".concat(prefixCls, "-dot")]: dot,
37
- ["".concat(prefixCls, "-dot-large")]: dot && size === 'large',
38
- ["".concat(prefixCls, "-text")]: !dot && !corner,
39
- ["".concat(prefixCls, "-corner")]: corner,
40
- ["".concat(prefixCls, "-corner-large")]: corner && size === 'large'
41
- });
42
- const badgeCls = (0, _classnames.default)(prefixCls, className, {
43
- ["".concat(prefixCls, "-not-a-wrapper")]: !children,
44
- ["".concat(prefixCls, "-corner-wrapper")]: corner,
45
- ["".concat(prefixCls, "-hot")]: !!hot,
46
- ["".concat(prefixCls, "-corner-wrapper-large")]: corner && size === 'large'
47
- });
48
- return /*#__PURE__*/React.createElement("span", {
49
- className: badgeCls
50
- }, children, (text || dot) &&
51
- /*#__PURE__*/
52
- // tslint:disable-next-line:jsx-no-multiline-js
53
- React.createElement("sup", Object.assign({
54
- className: scrollNumberCls
55
- }, restProps), text));
56
- }
57
- }
58
- exports.default = Badge;
59
- Badge.defaultProps = {
60
- prefixCls: 'am-badge',
61
- size: 'small',
62
- overflowCount: 99,
63
- dot: false,
64
- corner: false
65
- };