@nutui/nutui-react-taro 3.0.19-cpp.25 → 3.0.19-cpp.26-beta.2

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 (138) hide show
  1. package/dist/cjs/locales/base.d.ts +3 -0
  2. package/dist/cjs/locales/en-US.js +4 -1
  3. package/dist/cjs/locales/id-ID.js +4 -1
  4. package/dist/cjs/locales/ja-JP.js +4 -1
  5. package/dist/cjs/locales/tr-TR.js +4 -1
  6. package/dist/cjs/locales/zh-CN.js +4 -1
  7. package/dist/cjs/locales/zh-TW.js +4 -1
  8. package/dist/cjs/locales/zh-UG.js +4 -1
  9. package/dist/cjs/packages/actionsheet/style/style.harmony.css +45 -24
  10. package/dist/cjs/packages/address/style/style.harmony.css +45 -24
  11. package/dist/cjs/packages/calendar/style/style.harmony.css +45 -24
  12. package/dist/cjs/packages/cascader/style/style.harmony.css +45 -24
  13. package/dist/cjs/packages/configprovider/types.d.ts +1 -1
  14. package/dist/cjs/packages/datepicker/style/style.harmony.css +46 -25
  15. package/dist/cjs/packages/imagepreview/style/style.harmony.css +45 -24
  16. package/dist/cjs/packages/numberkeyboard/style/style.css +1 -1
  17. package/dist/cjs/packages/numberkeyboard/style/style.harmony.css +46 -25
  18. package/dist/cjs/packages/nutui.react.build.d.ts +3 -1
  19. package/dist/cjs/packages/nutui.react.build.js +18 -14
  20. package/dist/cjs/packages/nutui.react.d.ts +4 -1
  21. package/dist/cjs/packages/nutui.react.js +19 -14
  22. package/dist/cjs/packages/nutui.react.scss.d.ts +1 -0
  23. package/dist/cjs/packages/nutui.react.scss.js +1 -0
  24. package/dist/cjs/packages/overlay/overlay.js +11 -17
  25. package/dist/cjs/packages/picker/style/style.css +1 -1
  26. package/dist/cjs/packages/picker/style/style.harmony.css +46 -25
  27. package/dist/cjs/packages/popover/style/style.harmony.css +45 -24
  28. package/dist/cjs/packages/popup/popup.js +171 -99
  29. package/dist/cjs/packages/popup/style/popup.scss +29 -9
  30. package/dist/cjs/packages/popup/style/style.css +45 -24
  31. package/dist/cjs/packages/popup/style/style.harmony.css +45 -24
  32. package/dist/cjs/packages/popup/style-jmapp/popup.scss +29 -9
  33. package/dist/cjs/packages/popup/style-jmapp/style.css +29 -8
  34. package/dist/cjs/packages/popup/style-jrkf/popup.scss +29 -9
  35. package/dist/cjs/packages/popup/style-jrkf/style.css +29 -8
  36. package/dist/cjs/packages/quickenter/index.d.ts +3 -0
  37. package/dist/cjs/packages/quickenter/index.js +13 -0
  38. package/dist/cjs/packages/quickenter/quickenter.d.ts +4 -0
  39. package/dist/cjs/packages/quickenter/quickenter.js +147 -0
  40. package/dist/cjs/packages/quickenter/style/css.js +2 -0
  41. package/dist/cjs/packages/quickenter/style/index.js +2 -0
  42. package/dist/cjs/packages/quickenter/style/quickenter.scss +110 -0
  43. package/dist/cjs/packages/quickenter/style/style.css +99 -0
  44. package/dist/cjs/packages/quickenter/style/style.harmony.css +500 -0
  45. package/dist/cjs/packages/quickenter/style-jmapp/css.js +2 -0
  46. package/dist/cjs/packages/quickenter/style-jmapp/index.js +2 -0
  47. package/dist/cjs/packages/quickenter/style-jmapp/quickenter.scss +110 -0
  48. package/dist/cjs/packages/quickenter/style-jmapp/style.css +99 -0
  49. package/dist/cjs/packages/quickenter/style-jrkf/css.js +2 -0
  50. package/dist/cjs/packages/quickenter/style-jrkf/index.js +2 -0
  51. package/dist/cjs/packages/quickenter/style-jrkf/quickenter.scss +110 -0
  52. package/dist/cjs/packages/quickenter/style-jrkf/style.css +99 -0
  53. package/dist/cjs/packages/shortpassword/style/style.harmony.css +45 -24
  54. package/dist/cjs/packages/timeselect/style/style.harmony.css +45 -24
  55. package/dist/cjs/packages/tour/style/style.harmony.css +45 -24
  56. package/dist/cjs/types/index.d.ts +3 -0
  57. package/dist/cjs/types/index.js +3 -0
  58. package/dist/cjs/types/spec/quickenter/base.d.ts +26 -0
  59. package/dist/cjs/types/spec/quickenter/base.js +4 -0
  60. package/dist/cjs/types/spec/quickenter/h5.d.ts +5 -0
  61. package/dist/cjs/types/spec/quickenter/h5.js +4 -0
  62. package/dist/cjs/types/spec/quickenter/taro.d.ts +5 -0
  63. package/dist/cjs/types/spec/quickenter/taro.js +4 -0
  64. package/dist/cjs/utils/taro/ConfigurableCSSTransition.d.ts +15 -0
  65. package/dist/cjs/utils/taro/ConfigurableCSSTransition.js +90 -0
  66. package/dist/es/locales/base.d.ts +3 -0
  67. package/dist/es/locales/en-US.js +4 -1
  68. package/dist/es/locales/id-ID.js +4 -1
  69. package/dist/es/locales/ja-JP.js +4 -1
  70. package/dist/es/locales/tr-TR.js +4 -1
  71. package/dist/es/locales/zh-CN.js +4 -1
  72. package/dist/es/locales/zh-TW.js +4 -1
  73. package/dist/es/locales/zh-UG.js +4 -1
  74. package/dist/es/packages/actionsheet/style/style.harmony.css +45 -24
  75. package/dist/es/packages/address/style/style.harmony.css +45 -24
  76. package/dist/es/packages/calendar/style/style.harmony.css +45 -24
  77. package/dist/es/packages/cascader/style/style.harmony.css +45 -24
  78. package/dist/es/packages/configprovider/types.d.ts +1 -1
  79. package/dist/es/packages/datepicker/style/style.harmony.css +46 -25
  80. package/dist/es/packages/imagepreview/style/style.harmony.css +45 -24
  81. package/dist/es/packages/numberkeyboard/style/style.css +1 -1
  82. package/dist/es/packages/numberkeyboard/style/style.harmony.css +46 -25
  83. package/dist/es/packages/nutui.react.build.d.ts +3 -1
  84. package/dist/es/packages/nutui.react.build.js +3 -1
  85. package/dist/es/packages/overlay/overlay.js +11 -17
  86. package/dist/es/packages/picker/style/style.css +1 -1
  87. package/dist/es/packages/picker/style/style.harmony.css +46 -25
  88. package/dist/es/packages/popover/style/style.harmony.css +45 -24
  89. package/dist/es/packages/popup/popup.js +172 -101
  90. package/dist/es/packages/popup/style/popup.scss +29 -9
  91. package/dist/es/packages/popup/style/style.css +45 -24
  92. package/dist/es/packages/popup/style/style.harmony.css +45 -24
  93. package/dist/es/packages/popup/style-jmapp/popup.scss +29 -9
  94. package/dist/es/packages/popup/style-jmapp/style.css +29 -8
  95. package/dist/es/packages/popup/style-jrkf/popup.scss +29 -9
  96. package/dist/es/packages/popup/style-jrkf/style.css +29 -8
  97. package/dist/es/packages/quickenter/index.d.ts +3 -0
  98. package/dist/es/packages/quickenter/index.js +2 -0
  99. package/dist/es/packages/quickenter/quickenter.d.ts +4 -0
  100. package/dist/es/packages/quickenter/quickenter.js +135 -0
  101. package/dist/es/packages/quickenter/style/css.js +2 -0
  102. package/dist/es/packages/quickenter/style/index.js +2 -0
  103. package/dist/es/packages/quickenter/style/quickenter.scss +110 -0
  104. package/dist/es/packages/quickenter/style/style.css +99 -0
  105. package/dist/es/packages/quickenter/style/style.harmony.css +500 -0
  106. package/dist/es/packages/quickenter/style-jmapp/css.js +2 -0
  107. package/dist/es/packages/quickenter/style-jmapp/index.js +2 -0
  108. package/dist/es/packages/quickenter/style-jmapp/quickenter.scss +110 -0
  109. package/dist/es/packages/quickenter/style-jmapp/style.css +99 -0
  110. package/dist/es/packages/quickenter/style-jrkf/css.js +2 -0
  111. package/dist/es/packages/quickenter/style-jrkf/index.js +2 -0
  112. package/dist/es/packages/quickenter/style-jrkf/quickenter.scss +110 -0
  113. package/dist/es/packages/quickenter/style-jrkf/style.css +99 -0
  114. package/dist/es/packages/shortpassword/style/style.harmony.css +45 -24
  115. package/dist/es/packages/timeselect/style/style.harmony.css +45 -24
  116. package/dist/es/packages/tour/style/style.harmony.css +45 -24
  117. package/dist/es/types/index.d.ts +3 -0
  118. package/dist/es/types/index.js +3 -0
  119. package/dist/es/types/spec/quickenter/base.d.ts +44 -0
  120. package/dist/es/types/spec/quickenter/base.js +1 -0
  121. package/dist/es/types/spec/quickenter/h5.d.ts +5 -0
  122. package/dist/es/types/spec/quickenter/h5.js +1 -0
  123. package/dist/es/types/spec/quickenter/taro.d.ts +5 -0
  124. package/dist/es/types/spec/quickenter/taro.js +1 -0
  125. package/dist/es/utils/taro/ConfigurableCSSTransition.d.ts +15 -0
  126. package/dist/es/utils/taro/ConfigurableCSSTransition.js +79 -0
  127. package/dist/nutui.react.umd.js +631 -332
  128. package/dist/style-jmapp.css +1 -1
  129. package/dist/style-jmapp.scss +35 -34
  130. package/dist/style-jrkf.css +1 -1
  131. package/dist/style-jrkf.scss +34 -33
  132. package/dist/style.css +1 -1
  133. package/dist/style.scss +35 -34
  134. package/dist/styles/variables-daojia.scss +36 -0
  135. package/dist/styles/variables-jmapp.scss +36 -0
  136. package/dist/styles/variables-jrkf.scss +36 -0
  137. package/dist/styles/variables.scss +37 -1
  138. package/package.json +1 -1
@@ -155,6 +155,9 @@ var zhUG = {
155
155
  watermark: {
156
156
  errorCanvasTips: 'Canvas نى قوللىمايدۇ'
157
157
  },
158
- mask: 'mask'
158
+ mask: 'mask',
159
+ quickenter: {
160
+ title: 'تېز كىرگۈزۈش'
161
+ }
159
162
  };
160
163
  export default zhUG;
@@ -71,7 +71,7 @@
71
71
  align-items: center;
72
72
  justify-content: center;
73
73
  border-bottom: var(--nutui-popup-title-border-bottom, 0);
74
- padding: var(--nutui-popup-title-padding, 16px);
74
+ padding: var(--nutui-popup-title-padding, 11px);
75
75
  position: relative;
76
76
  }
77
77
  .nut-popup-title-wrapper {
@@ -84,7 +84,6 @@
84
84
  color: var(--nutui-color-title, #1a1a1a);
85
85
  font-weight: var(--nutui-font-weight-bold, 600);
86
86
  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
87
- line-height: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
88
87
  }
89
88
  .nut-popup-title-description {
90
89
  color: var(--nutui-color-text, #505259);
@@ -96,13 +95,13 @@
96
95
  }
97
96
  .nut-popup-title-left {
98
97
  position: absolute;
99
- top: var(--nutui-popup-title-padding, 16px);
100
- left: var(--nutui-popup-title-padding, 16px);
98
+ top: var(--nutui-popup-title-padding, 11px);
99
+ left: var(--nutui-popup-title-padding, 11px);
101
100
  }
102
101
  .nut-popup-title-right {
103
102
  position: absolute;
104
- top: var(--nutui-popup-title-padding, 16px);
105
- right: var(--nutui-popup-title-padding, 16px);
103
+ top: var(--nutui-popup-title-padding, 11px);
104
+ right: var(--nutui-popup-title-padding, 11px);
106
105
  z-index: 1;
107
106
  width: var(--nutui-popup-icon-size, 20px);
108
107
  height: var(--nutui-popup-icon-size, 20px);
@@ -113,20 +112,22 @@
113
112
  opacity: 0.7;
114
113
  }
115
114
  .nut-popup-title-right-top-left {
116
- top: var(--nutui-popup-title-padding, 16px);
117
- left: var(--nutui-popup-title-padding, 16px);
115
+ top: var(--nutui-popup-title-padding, 11px);
116
+ left: var(--nutui-popup-title-padding, 11px);
118
117
  }
119
118
  .nut-popup-title-right-bottom-left {
120
- bottom: var(--nutui-popup-title-padding, 16px);
121
- left: var(--nutui-popup-title-padding, 16px);
119
+ bottom: var(--nutui-popup-title-padding, 11px);
120
+ left: var(--nutui-popup-title-padding, 11px);
122
121
  }
123
122
  .nut-popup-title-right-bottom-right {
124
- right: var(--nutui-popup-title-padding, 16px);
125
- bottom: var(--nutui-popup-title-padding, 16px);
123
+ right: var(--nutui-popup-title-padding, 11px);
124
+ bottom: var(--nutui-popup-title-padding, 11px);
126
125
  }
127
126
  .nut-popup-center {
128
127
  top: 50%;
129
128
  left: 50%;
129
+ right: auto;
130
+ bottom: auto;
130
131
  min-height: 10%;
131
132
  max-width: 295px;
132
133
  transform: translate(-50%, -50%);
@@ -137,6 +138,8 @@
137
138
  .nut-popup-bottom {
138
139
  bottom: 0;
139
140
  left: 0;
141
+ right: auto;
142
+ top: auto;
140
143
  width: 100%;
141
144
  }
142
145
  .nut-popup-bottom.nut-popup-round {
@@ -148,6 +151,8 @@
148
151
  .nut-popup-right {
149
152
  top: 0;
150
153
  right: 0;
154
+ left: auto;
155
+ bottom: auto;
151
156
  width: 100px;
152
157
  height: 100%;
153
158
  }
@@ -157,6 +162,8 @@
157
162
  .nut-popup-left {
158
163
  top: 0;
159
164
  left: 0;
165
+ right: auto;
166
+ bottom: auto;
160
167
  width: 100px;
161
168
  height: 100%;
162
169
  }
@@ -166,6 +173,8 @@
166
173
  .nut-popup-top {
167
174
  top: 0;
168
175
  left: 0;
176
+ right: auto;
177
+ bottom: auto;
169
178
  width: 100%;
170
179
  }
171
180
  .nut-popup-top.nut-popup-round {
@@ -242,6 +251,9 @@
242
251
  }
243
252
  }
244
253
  @keyframes popup-slide-top-exit {
254
+ from {
255
+ transform: translate3d(0, 0%, 0);
256
+ }
245
257
  to {
246
258
  transform: translate3d(0, -100%, 0);
247
259
  }
@@ -266,6 +278,9 @@
266
278
  }
267
279
  }
268
280
  @keyframes popup-slide-right-exit {
281
+ from {
282
+ transform: translate3d(0%, 0, 0);
283
+ }
269
284
  to {
270
285
  transform: translate3d(100%, 0, 0);
271
286
  }
@@ -276,7 +291,7 @@
276
291
  animation-name: popup-slide-right-enter;
277
292
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
278
293
  }
279
- .nut-popup-slide-right-exit {
294
+ .nut-popup-slide-right-exit-active {
280
295
  animation-fill-mode: both;
281
296
  animation-name: popup-slide-right-exit;
282
297
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -289,20 +304,23 @@
289
304
  transform: translate3d(0, 0%, 0);
290
305
  }
291
306
  }
292
- @keyframes slide-bottom-exit {
307
+ @keyframes popup-slide-bottom-exit {
308
+ from {
309
+ transform: translate3d(0, 0%, 0);
310
+ }
293
311
  to {
294
312
  transform: translate3d(0, 100%, 0);
295
313
  }
296
314
  }
297
315
  .nut-popup-slide-bottom-enter-active, .nut-popup-slide-bottom-appear-active {
298
- transform: translate(0, 0);
316
+ transform: translate3d(0, 0, 0);
299
317
  animation-fill-mode: both;
300
318
  animation-name: popup-slide-bottom-enter;
301
319
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
302
320
  }
303
- .nut-popup-slide-bottom-exit {
321
+ .nut-popup-slide-bottom-exit-active {
304
322
  animation-fill-mode: both;
305
- animation-name: slide-bottom-exit;
323
+ animation-name: popup-slide-bottom-exit;
306
324
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
307
325
  }
308
326
  @keyframes popup-slide-left-enter {
@@ -314,17 +332,20 @@
314
332
  }
315
333
  }
316
334
  @keyframes popup-slide-left-exit {
335
+ from {
336
+ transform: translate3d(0%, 0, 0);
337
+ }
317
338
  to {
318
339
  transform: translate3d(-100%, 0, 0);
319
340
  }
320
341
  }
321
342
  .nut-popup-slide-left-enter-active, .nut-popup-slide-left-appear-active {
322
- transform: translate(0, 0);
343
+ transform: translate3d(0, 0, 0);
323
344
  animation-fill-mode: both;
324
345
  animation-name: popup-slide-left-enter;
325
346
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
326
347
  }
327
- .nut-popup-slide-left-exit-active, .nut-popup-slide-left-exit-done {
348
+ .nut-popup-slide-left-exit-active {
328
349
  animation-fill-mode: both;
329
350
  animation-name: popup-slide-left-exit;
330
351
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -339,27 +360,27 @@
339
360
  [dir=rtl] .nut-popup-title-left,
340
361
  .nut-rtl .nut-popup-title-left {
341
362
  left: auto;
342
- right: var(--nutui-popup-title-padding, 16px);
363
+ right: var(--nutui-popup-title-padding, 11px);
343
364
  }
344
365
  [dir=rtl] .nut-popup-title-right,
345
366
  .nut-rtl .nut-popup-title-right {
346
367
  right: auto;
347
- left: var(--nutui-popup-title-padding, 16px);
368
+ left: var(--nutui-popup-title-padding, 11px);
348
369
  }
349
370
  [dir=rtl] .nut-popup-title-right-top-left,
350
371
  .nut-rtl .nut-popup-title-right-top-left {
351
372
  left: auto;
352
- right: var(--nutui-popup-title-padding, 16px);
373
+ right: var(--nutui-popup-title-padding, 11px);
353
374
  }
354
375
  [dir=rtl] .nut-popup-title-right-bottom-left,
355
376
  .nut-rtl .nut-popup-title-right-bottom-left {
356
377
  left: auto;
357
- right: var(--nutui-popup-title-padding, 16px);
378
+ right: var(--nutui-popup-title-padding, 11px);
358
379
  }
359
380
  [dir=rtl] .nut-popup-title-right-bottom-right,
360
381
  .nut-rtl .nut-popup-title-right-bottom-right {
361
382
  right: auto;
362
- left: var(--nutui-popup-title-padding, 16px);
383
+ left: var(--nutui-popup-title-padding, 11px);
363
384
  }
364
385
  [dir=rtl] .nut-popup-title .nut-icon-ArrowLeft,
365
386
  .nut-rtl .nut-popup-title .nut-icon-ArrowLeft {
@@ -221,7 +221,7 @@
221
221
  align-items: center;
222
222
  justify-content: center;
223
223
  border-bottom: var(--nutui-popup-title-border-bottom, 0);
224
- padding: var(--nutui-popup-title-padding, 16px);
224
+ padding: var(--nutui-popup-title-padding, 11px);
225
225
  position: relative;
226
226
  }
227
227
  .nut-popup-title-wrapper {
@@ -234,7 +234,6 @@
234
234
  color: var(--nutui-color-title, #1a1a1a);
235
235
  font-weight: var(--nutui-font-weight-bold, 600);
236
236
  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
237
- line-height: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
238
237
  }
239
238
  .nut-popup-title-description {
240
239
  color: var(--nutui-color-text, #505259);
@@ -246,13 +245,13 @@
246
245
  }
247
246
  .nut-popup-title-left {
248
247
  position: absolute;
249
- top: var(--nutui-popup-title-padding, 16px);
250
- left: var(--nutui-popup-title-padding, 16px);
248
+ top: var(--nutui-popup-title-padding, 11px);
249
+ left: var(--nutui-popup-title-padding, 11px);
251
250
  }
252
251
  .nut-popup-title-right {
253
252
  position: absolute;
254
- top: var(--nutui-popup-title-padding, 16px);
255
- right: var(--nutui-popup-title-padding, 16px);
253
+ top: var(--nutui-popup-title-padding, 11px);
254
+ right: var(--nutui-popup-title-padding, 11px);
256
255
  z-index: 1;
257
256
  width: var(--nutui-popup-icon-size, 20px);
258
257
  height: var(--nutui-popup-icon-size, 20px);
@@ -263,20 +262,22 @@
263
262
  opacity: 0.7;
264
263
  }
265
264
  .nut-popup-title-right-top-left {
266
- top: var(--nutui-popup-title-padding, 16px);
267
- left: var(--nutui-popup-title-padding, 16px);
265
+ top: var(--nutui-popup-title-padding, 11px);
266
+ left: var(--nutui-popup-title-padding, 11px);
268
267
  }
269
268
  .nut-popup-title-right-bottom-left {
270
- bottom: var(--nutui-popup-title-padding, 16px);
271
- left: var(--nutui-popup-title-padding, 16px);
269
+ bottom: var(--nutui-popup-title-padding, 11px);
270
+ left: var(--nutui-popup-title-padding, 11px);
272
271
  }
273
272
  .nut-popup-title-right-bottom-right {
274
- right: var(--nutui-popup-title-padding, 16px);
275
- bottom: var(--nutui-popup-title-padding, 16px);
273
+ right: var(--nutui-popup-title-padding, 11px);
274
+ bottom: var(--nutui-popup-title-padding, 11px);
276
275
  }
277
276
  .nut-popup-center {
278
277
  top: 50%;
279
278
  left: 50%;
279
+ right: auto;
280
+ bottom: auto;
280
281
  min-height: 10%;
281
282
  max-width: 295px;
282
283
  transform: translate(-50%, -50%);
@@ -287,6 +288,8 @@
287
288
  .nut-popup-bottom {
288
289
  bottom: 0;
289
290
  left: 0;
291
+ right: auto;
292
+ top: auto;
290
293
  width: 100%;
291
294
  }
292
295
  .nut-popup-bottom.nut-popup-round {
@@ -298,6 +301,8 @@
298
301
  .nut-popup-right {
299
302
  top: 0;
300
303
  right: 0;
304
+ left: auto;
305
+ bottom: auto;
301
306
  width: 100px;
302
307
  height: 100%;
303
308
  }
@@ -307,6 +312,8 @@
307
312
  .nut-popup-left {
308
313
  top: 0;
309
314
  left: 0;
315
+ right: auto;
316
+ bottom: auto;
310
317
  width: 100px;
311
318
  height: 100%;
312
319
  }
@@ -316,6 +323,8 @@
316
323
  .nut-popup-top {
317
324
  top: 0;
318
325
  left: 0;
326
+ right: auto;
327
+ bottom: auto;
319
328
  width: 100%;
320
329
  }
321
330
  .nut-popup-top.nut-popup-round {
@@ -392,6 +401,9 @@
392
401
  }
393
402
  }
394
403
  @keyframes popup-slide-top-exit {
404
+ from {
405
+ transform: translate3d(0, 0%, 0);
406
+ }
395
407
  to {
396
408
  transform: translate3d(0, -100%, 0);
397
409
  }
@@ -416,6 +428,9 @@
416
428
  }
417
429
  }
418
430
  @keyframes popup-slide-right-exit {
431
+ from {
432
+ transform: translate3d(0%, 0, 0);
433
+ }
419
434
  to {
420
435
  transform: translate3d(100%, 0, 0);
421
436
  }
@@ -426,7 +441,7 @@
426
441
  animation-name: popup-slide-right-enter;
427
442
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
428
443
  }
429
- .nut-popup-slide-right-exit {
444
+ .nut-popup-slide-right-exit-active {
430
445
  animation-fill-mode: both;
431
446
  animation-name: popup-slide-right-exit;
432
447
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -439,20 +454,23 @@
439
454
  transform: translate3d(0, 0%, 0);
440
455
  }
441
456
  }
442
- @keyframes slide-bottom-exit {
457
+ @keyframes popup-slide-bottom-exit {
458
+ from {
459
+ transform: translate3d(0, 0%, 0);
460
+ }
443
461
  to {
444
462
  transform: translate3d(0, 100%, 0);
445
463
  }
446
464
  }
447
465
  .nut-popup-slide-bottom-enter-active, .nut-popup-slide-bottom-appear-active {
448
- transform: translate(0, 0);
466
+ transform: translate3d(0, 0, 0);
449
467
  animation-fill-mode: both;
450
468
  animation-name: popup-slide-bottom-enter;
451
469
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
452
470
  }
453
- .nut-popup-slide-bottom-exit {
471
+ .nut-popup-slide-bottom-exit-active {
454
472
  animation-fill-mode: both;
455
- animation-name: slide-bottom-exit;
473
+ animation-name: popup-slide-bottom-exit;
456
474
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
457
475
  }
458
476
  @keyframes popup-slide-left-enter {
@@ -464,17 +482,20 @@
464
482
  }
465
483
  }
466
484
  @keyframes popup-slide-left-exit {
485
+ from {
486
+ transform: translate3d(0%, 0, 0);
487
+ }
467
488
  to {
468
489
  transform: translate3d(-100%, 0, 0);
469
490
  }
470
491
  }
471
492
  .nut-popup-slide-left-enter-active, .nut-popup-slide-left-appear-active {
472
- transform: translate(0, 0);
493
+ transform: translate3d(0, 0, 0);
473
494
  animation-fill-mode: both;
474
495
  animation-name: popup-slide-left-enter;
475
496
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
476
497
  }
477
- .nut-popup-slide-left-exit-active, .nut-popup-slide-left-exit-done {
498
+ .nut-popup-slide-left-exit-active {
478
499
  animation-fill-mode: both;
479
500
  animation-name: popup-slide-left-exit;
480
501
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -489,27 +510,27 @@
489
510
  [dir=rtl] .nut-popup-title-left,
490
511
  .nut-rtl .nut-popup-title-left {
491
512
  left: auto;
492
- right: var(--nutui-popup-title-padding, 16px);
513
+ right: var(--nutui-popup-title-padding, 11px);
493
514
  }
494
515
  [dir=rtl] .nut-popup-title-right,
495
516
  .nut-rtl .nut-popup-title-right {
496
517
  right: auto;
497
- left: var(--nutui-popup-title-padding, 16px);
518
+ left: var(--nutui-popup-title-padding, 11px);
498
519
  }
499
520
  [dir=rtl] .nut-popup-title-right-top-left,
500
521
  .nut-rtl .nut-popup-title-right-top-left {
501
522
  left: auto;
502
- right: var(--nutui-popup-title-padding, 16px);
523
+ right: var(--nutui-popup-title-padding, 11px);
503
524
  }
504
525
  [dir=rtl] .nut-popup-title-right-bottom-left,
505
526
  .nut-rtl .nut-popup-title-right-bottom-left {
506
527
  left: auto;
507
- right: var(--nutui-popup-title-padding, 16px);
528
+ right: var(--nutui-popup-title-padding, 11px);
508
529
  }
509
530
  [dir=rtl] .nut-popup-title-right-bottom-right,
510
531
  .nut-rtl .nut-popup-title-right-bottom-right {
511
532
  right: auto;
512
- left: var(--nutui-popup-title-padding, 16px);
533
+ left: var(--nutui-popup-title-padding, 11px);
513
534
  }
514
535
  [dir=rtl] .nut-popup-title .nut-icon-ArrowLeft,
515
536
  .nut-rtl .nut-popup-title .nut-icon-ArrowLeft {
@@ -71,7 +71,7 @@
71
71
  align-items: center;
72
72
  justify-content: center;
73
73
  border-bottom: var(--nutui-popup-title-border-bottom, 0);
74
- padding: var(--nutui-popup-title-padding, 16px);
74
+ padding: var(--nutui-popup-title-padding, 11px);
75
75
  position: relative;
76
76
  }
77
77
  .nut-popup-title-wrapper {
@@ -84,7 +84,6 @@
84
84
  color: var(--nutui-color-title, #1a1a1a);
85
85
  font-weight: var(--nutui-font-weight-bold, 600);
86
86
  font-size: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
87
- line-height: var(--nutui-popup-title-font-size, var(--nutui-font-size-xl, 18px));
88
87
  }
89
88
  .nut-popup-title-description {
90
89
  color: var(--nutui-color-text, #505259);
@@ -96,13 +95,13 @@
96
95
  }
97
96
  .nut-popup-title-left {
98
97
  position: absolute;
99
- top: var(--nutui-popup-title-padding, 16px);
100
- left: var(--nutui-popup-title-padding, 16px);
98
+ top: var(--nutui-popup-title-padding, 11px);
99
+ left: var(--nutui-popup-title-padding, 11px);
101
100
  }
102
101
  .nut-popup-title-right {
103
102
  position: absolute;
104
- top: var(--nutui-popup-title-padding, 16px);
105
- right: var(--nutui-popup-title-padding, 16px);
103
+ top: var(--nutui-popup-title-padding, 11px);
104
+ right: var(--nutui-popup-title-padding, 11px);
106
105
  z-index: 1;
107
106
  width: var(--nutui-popup-icon-size, 20px);
108
107
  height: var(--nutui-popup-icon-size, 20px);
@@ -113,20 +112,22 @@
113
112
  opacity: 0.7;
114
113
  }
115
114
  .nut-popup-title-right-top-left {
116
- top: var(--nutui-popup-title-padding, 16px);
117
- left: var(--nutui-popup-title-padding, 16px);
115
+ top: var(--nutui-popup-title-padding, 11px);
116
+ left: var(--nutui-popup-title-padding, 11px);
118
117
  }
119
118
  .nut-popup-title-right-bottom-left {
120
- bottom: var(--nutui-popup-title-padding, 16px);
121
- left: var(--nutui-popup-title-padding, 16px);
119
+ bottom: var(--nutui-popup-title-padding, 11px);
120
+ left: var(--nutui-popup-title-padding, 11px);
122
121
  }
123
122
  .nut-popup-title-right-bottom-right {
124
- right: var(--nutui-popup-title-padding, 16px);
125
- bottom: var(--nutui-popup-title-padding, 16px);
123
+ right: var(--nutui-popup-title-padding, 11px);
124
+ bottom: var(--nutui-popup-title-padding, 11px);
126
125
  }
127
126
  .nut-popup-center {
128
127
  top: 50%;
129
128
  left: 50%;
129
+ right: auto;
130
+ bottom: auto;
130
131
  min-height: 10%;
131
132
  max-width: 295px;
132
133
  transform: translate(-50%, -50%);
@@ -137,6 +138,8 @@
137
138
  .nut-popup-bottom {
138
139
  bottom: 0;
139
140
  left: 0;
141
+ right: auto;
142
+ top: auto;
140
143
  width: 100%;
141
144
  }
142
145
  .nut-popup-bottom.nut-popup-round {
@@ -148,6 +151,8 @@
148
151
  .nut-popup-right {
149
152
  top: 0;
150
153
  right: 0;
154
+ left: auto;
155
+ bottom: auto;
151
156
  width: 100px;
152
157
  height: 100%;
153
158
  }
@@ -157,6 +162,8 @@
157
162
  .nut-popup-left {
158
163
  top: 0;
159
164
  left: 0;
165
+ right: auto;
166
+ bottom: auto;
160
167
  width: 100px;
161
168
  height: 100%;
162
169
  }
@@ -166,6 +173,8 @@
166
173
  .nut-popup-top {
167
174
  top: 0;
168
175
  left: 0;
176
+ right: auto;
177
+ bottom: auto;
169
178
  width: 100%;
170
179
  }
171
180
  .nut-popup-top.nut-popup-round {
@@ -242,6 +251,9 @@
242
251
  }
243
252
  }
244
253
  @keyframes popup-slide-top-exit {
254
+ from {
255
+ transform: translate3d(0, 0%, 0);
256
+ }
245
257
  to {
246
258
  transform: translate3d(0, -100%, 0);
247
259
  }
@@ -266,6 +278,9 @@
266
278
  }
267
279
  }
268
280
  @keyframes popup-slide-right-exit {
281
+ from {
282
+ transform: translate3d(0%, 0, 0);
283
+ }
269
284
  to {
270
285
  transform: translate3d(100%, 0, 0);
271
286
  }
@@ -276,7 +291,7 @@
276
291
  animation-name: popup-slide-right-enter;
277
292
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
278
293
  }
279
- .nut-popup-slide-right-exit {
294
+ .nut-popup-slide-right-exit-active {
280
295
  animation-fill-mode: both;
281
296
  animation-name: popup-slide-right-exit;
282
297
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -289,20 +304,23 @@
289
304
  transform: translate3d(0, 0%, 0);
290
305
  }
291
306
  }
292
- @keyframes slide-bottom-exit {
307
+ @keyframes popup-slide-bottom-exit {
308
+ from {
309
+ transform: translate3d(0, 0%, 0);
310
+ }
293
311
  to {
294
312
  transform: translate3d(0, 100%, 0);
295
313
  }
296
314
  }
297
315
  .nut-popup-slide-bottom-enter-active, .nut-popup-slide-bottom-appear-active {
298
- transform: translate(0, 0);
316
+ transform: translate3d(0, 0, 0);
299
317
  animation-fill-mode: both;
300
318
  animation-name: popup-slide-bottom-enter;
301
319
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
302
320
  }
303
- .nut-popup-slide-bottom-exit {
321
+ .nut-popup-slide-bottom-exit-active {
304
322
  animation-fill-mode: both;
305
- animation-name: slide-bottom-exit;
323
+ animation-name: popup-slide-bottom-exit;
306
324
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
307
325
  }
308
326
  @keyframes popup-slide-left-enter {
@@ -314,17 +332,20 @@
314
332
  }
315
333
  }
316
334
  @keyframes popup-slide-left-exit {
335
+ from {
336
+ transform: translate3d(0%, 0, 0);
337
+ }
317
338
  to {
318
339
  transform: translate3d(-100%, 0, 0);
319
340
  }
320
341
  }
321
342
  .nut-popup-slide-left-enter-active, .nut-popup-slide-left-appear-active {
322
- transform: translate(0, 0);
343
+ transform: translate3d(0, 0, 0);
323
344
  animation-fill-mode: both;
324
345
  animation-name: popup-slide-left-enter;
325
346
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
326
347
  }
327
- .nut-popup-slide-left-exit-active, .nut-popup-slide-left-exit-done {
348
+ .nut-popup-slide-left-exit-active {
328
349
  animation-fill-mode: both;
329
350
  animation-name: popup-slide-left-exit;
330
351
  animation-duration: var(--nutui-popup-animation-duration, 0.3s);
@@ -339,27 +360,27 @@
339
360
  [dir=rtl] .nut-popup-title-left,
340
361
  .nut-rtl .nut-popup-title-left {
341
362
  left: auto;
342
- right: var(--nutui-popup-title-padding, 16px);
363
+ right: var(--nutui-popup-title-padding, 11px);
343
364
  }
344
365
  [dir=rtl] .nut-popup-title-right,
345
366
  .nut-rtl .nut-popup-title-right {
346
367
  right: auto;
347
- left: var(--nutui-popup-title-padding, 16px);
368
+ left: var(--nutui-popup-title-padding, 11px);
348
369
  }
349
370
  [dir=rtl] .nut-popup-title-right-top-left,
350
371
  .nut-rtl .nut-popup-title-right-top-left {
351
372
  left: auto;
352
- right: var(--nutui-popup-title-padding, 16px);
373
+ right: var(--nutui-popup-title-padding, 11px);
353
374
  }
354
375
  [dir=rtl] .nut-popup-title-right-bottom-left,
355
376
  .nut-rtl .nut-popup-title-right-bottom-left {
356
377
  left: auto;
357
- right: var(--nutui-popup-title-padding, 16px);
378
+ right: var(--nutui-popup-title-padding, 11px);
358
379
  }
359
380
  [dir=rtl] .nut-popup-title-right-bottom-right,
360
381
  .nut-rtl .nut-popup-title-right-bottom-right {
361
382
  right: auto;
362
- left: var(--nutui-popup-title-padding, 16px);
383
+ left: var(--nutui-popup-title-padding, 11px);
363
384
  }
364
385
  [dir=rtl] .nut-popup-title .nut-icon-ArrowLeft,
365
386
  .nut-rtl .nut-popup-title .nut-icon-ArrowLeft {