rsuite 5.55.0 → 5.56.0

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 (78) hide show
  1. package/AutoComplete/styles/index.css +3 -3
  2. package/CHANGELOG.md +29 -0
  3. package/Calendar/styles/index.css +3 -0
  4. package/Calendar/styles/index.less +3 -1
  5. package/Cascader/styles/index.css +3 -3
  6. package/CheckPicker/styles/index.css +142 -40
  7. package/CheckPicker/styles/index.less +1 -1
  8. package/CheckTree/styles/index.css +143 -41
  9. package/CheckTreePicker/styles/index.css +143 -41
  10. package/CheckTreePicker/styles/index.less +2 -2
  11. package/Checkbox/styles/index.css +159 -36
  12. package/Checkbox/styles/index.less +32 -13
  13. package/DatePicker/styles/index.css +10 -5
  14. package/DatePicker/styles/index.less +5 -2
  15. package/DateRangePicker/styles/index.css +22 -14
  16. package/DateRangePicker/styles/index.less +5 -1
  17. package/InputPicker/styles/index.css +3 -3
  18. package/Message/styles/index.css +1 -1
  19. package/MultiCascader/styles/index.css +141 -39
  20. package/Nav/styles/index.css +1 -2
  21. package/Nav/styles/index.less +1 -2
  22. package/Pagination/styles/index.css +3 -3
  23. package/Radio/styles/index.css +133 -19
  24. package/Radio/styles/index.less +28 -12
  25. package/RadioGroup/styles/index.css +1 -1
  26. package/RadioGroup/styles/index.less +1 -1
  27. package/SelectPicker/styles/index.css +3 -3
  28. package/Tabs/styles/index.css +1 -2
  29. package/TagGroup/styles/index.css +1 -1
  30. package/TagGroup/styles/index.less +1 -1
  31. package/TagInput/styles/index.css +141 -39
  32. package/TagPicker/styles/index.css +141 -39
  33. package/cjs/Checkbox/Checkbox.d.ts +67 -25
  34. package/cjs/Checkbox/Checkbox.js +36 -26
  35. package/cjs/DatePicker/DatePicker.js +1 -1
  36. package/cjs/DateRangePicker/DateRangePicker.js +1 -1
  37. package/cjs/InputPicker/InputPicker.js +2 -2
  38. package/cjs/InputPicker/InputPickerContext.d.ts +1 -1
  39. package/cjs/MultiCascader/TreeView.js +2 -1
  40. package/cjs/Radio/Radio.d.ts +42 -16
  41. package/cjs/Radio/Radio.js +42 -37
  42. package/cjs/RadioGroup/RadioGroup.d.ts +1 -1
  43. package/cjs/RadioGroup/RadioGroup.js +3 -3
  44. package/cjs/TagPicker/index.js +1 -1
  45. package/cjs/internals/Picker/ListCheckItem.d.ts +2 -11
  46. package/cjs/internals/Picker/ListCheckItem.js +8 -6
  47. package/dist/rsuite-no-reset-rtl.css +279 -77
  48. package/dist/rsuite-no-reset-rtl.min.css +1 -1
  49. package/dist/rsuite-no-reset-rtl.min.css.map +1 -1
  50. package/dist/rsuite-no-reset.css +279 -77
  51. package/dist/rsuite-no-reset.min.css +1 -1
  52. package/dist/rsuite-no-reset.min.css.map +1 -1
  53. package/dist/rsuite-rtl.css +279 -77
  54. package/dist/rsuite-rtl.min.css +1 -1
  55. package/dist/rsuite-rtl.min.css.map +1 -1
  56. package/dist/rsuite.css +279 -77
  57. package/dist/rsuite.js +9 -9
  58. package/dist/rsuite.min.css +1 -1
  59. package/dist/rsuite.min.css.map +1 -1
  60. package/dist/rsuite.min.js +1 -1
  61. package/dist/rsuite.min.js.map +1 -1
  62. package/esm/Checkbox/Checkbox.d.ts +67 -25
  63. package/esm/Checkbox/Checkbox.js +38 -28
  64. package/esm/DatePicker/DatePicker.js +1 -1
  65. package/esm/DateRangePicker/DateRangePicker.js +1 -1
  66. package/esm/InputPicker/InputPicker.js +2 -2
  67. package/esm/InputPicker/InputPickerContext.d.ts +1 -1
  68. package/esm/MultiCascader/TreeView.js +2 -1
  69. package/esm/Radio/Radio.d.ts +42 -16
  70. package/esm/Radio/Radio.js +43 -38
  71. package/esm/RadioGroup/RadioGroup.d.ts +1 -1
  72. package/esm/RadioGroup/RadioGroup.js +5 -5
  73. package/esm/TagPicker/index.js +1 -1
  74. package/esm/internals/Picker/ListCheckItem.d.ts +2 -11
  75. package/esm/internals/Picker/ListCheckItem.js +8 -6
  76. package/internals/Picker/styles/index.less +1 -1
  77. package/package.json +1 -1
  78. package/styles/variables.less +1 -1
package/CheckTree/styles/index.css CHANGED
@@ -3188,11 +3188,11 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3188
3188
  .rs-picker-check-menu-group-children .rs-check-item .rs-checkbox-checker > label {
3189
3189
  padding-left: 52px;
3190
3190
  }
3191
- .rs-check-item .rs-checkbox-checker .rs-checkbox-wrapper {
3191
+ .rs-check-item .rs-checkbox-checker .rs-checkbox-control {
3192
3192
  left: 12px;
3193
3193
  }
3194
- .grouped .rs-check-item .rs-checkbox-checker .rs-checkbox-wrapper,
3195
- .rs-picker-check-menu-group-children .rs-check-item .rs-checkbox-checker .rs-checkbox-wrapper {
3194
+ .grouped .rs-check-item .rs-checkbox-checker .rs-checkbox-control,
3195
+ .rs-picker-check-menu-group-children .rs-check-item .rs-checkbox-checker .rs-checkbox-control {
3196
3196
  left: 26px;
3197
3197
  }
3198
3198
  .rs-checkbox {
@@ -3247,17 +3247,16 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3247
3247
  position: relative;
3248
3248
  }
3249
3249
  /* rtl:begin:ignore */
3250
- .rs-checkbox-wrapper::before,
3251
- .rs-checkbox-wrapper::after,
3252
- .rs-checkbox-wrapper .rs-checkbox-inner::before,
3253
- .rs-checkbox-wrapper .rs-checkbox-inner::after {
3250
+ .rs-checkbox-control::before,
3251
+ .rs-checkbox-control .rs-checkbox-inner::before,
3252
+ .rs-checkbox-control .rs-checkbox-inner::after {
3254
3253
  content: '';
3255
3254
  position: absolute;
3256
3255
  left: 0;
3257
3256
  top: 0;
3258
3257
  display: block;
3259
3258
  }
3260
- .rs-checkbox-wrapper .rs-checkbox-inner::after {
3259
+ .rs-checkbox-control .rs-checkbox-inner::after {
3261
3260
  opacity: 0;
3262
3261
  -webkit-transform: rotate(45deg) scale(0);
3263
3262
  transform: rotate(45deg) scale(0);
@@ -3266,12 +3265,12 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3266
3265
  transition: opacity 0.2s ease-in, transform 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46);
3267
3266
  transition: opacity 0.2s ease-in, transform 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46), -webkit-transform 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46);
3268
3267
  }
3269
- .rs-theme-high-contrast .rs-checkbox-wrapper .rs-checkbox-inner::after {
3268
+ .rs-theme-high-contrast .rs-checkbox-control .rs-checkbox-inner::after {
3270
3269
  -webkit-transition: none;
3271
3270
  transition: none;
3272
3271
  }
3273
- .rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::after,
3274
- .rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::after {
3272
+ .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::after,
3273
+ .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::after {
3275
3274
  border: solid #fff;
3276
3275
  border: solid var(--rs-checkbox-icon);
3277
3276
  width: 6px;
@@ -3280,12 +3279,12 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3280
3279
  margin-left: 5px;
3281
3280
  opacity: 1;
3282
3281
  }
3283
- .rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::after {
3282
+ .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::after {
3284
3283
  border-width: 0 2px 2px 0;
3285
3284
  -webkit-transform: rotate(45deg) scale(1);
3286
3285
  transform: rotate(45deg) scale(1);
3287
3286
  }
3288
- .rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::after {
3287
+ .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::after {
3289
3288
  border-width: 0 0 2px;
3290
3289
  -webkit-transform: rotate(0deg) scale(1);
3291
3290
  transform: rotate(0deg) scale(1);
@@ -3295,7 +3294,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3295
3294
  }
3296
3295
  /* rtl:end:ignore */
3297
3296
  /* stylelint-disable-next-line */
3298
- .rs-checkbox-wrapper {
3297
+ .rs-checkbox-control {
3299
3298
  position: absolute;
3300
3299
  width: 16px;
3301
3300
  height: 16px;
@@ -3303,18 +3302,22 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3303
3302
  left: 10px;
3304
3303
  top: 10px;
3305
3304
  }
3306
- .rs-checkbox-wrapper [type='checkbox'] {
3307
- width: 0;
3308
- height: 0;
3305
+ .rs-checkbox-control [type='checkbox'] {
3306
+ position: absolute;
3309
3307
  opacity: 0;
3308
+ z-index: 1;
3309
+ top: -10px;
3310
+ right: -10px;
3311
+ bottom: -10px;
3312
+ left: -10px;
3310
3313
  }
3311
- .rs-checkbox-wrapper::before,
3312
- .rs-checkbox-wrapper .rs-checkbox-inner::before,
3313
- .rs-checkbox-wrapper .rs-checkbox-inner::after {
3314
+ .rs-checkbox-control::before,
3315
+ .rs-checkbox-control .rs-checkbox-inner::before,
3316
+ .rs-checkbox-control .rs-checkbox-inner::after {
3314
3317
  width: 16px;
3315
3318
  height: 16px;
3316
3319
  }
3317
- .rs-checkbox-wrapper::before {
3320
+ .rs-checkbox-control::before {
3318
3321
  border: 1px solid #3498ff;
3319
3322
  border: 1px solid var(--rs-checkbox-checked-bg);
3320
3323
  background-color: transparent;
@@ -3328,23 +3331,17 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3328
3331
  transition: transform 0.2s linear, opacity 0.2s linear;
3329
3332
  transition: transform 0.2s linear, opacity 0.2s linear, -webkit-transform 0.2s linear;
3330
3333
  }
3331
- .rs-theme-high-contrast .rs-checkbox-wrapper::before {
3334
+ .rs-theme-high-contrast .rs-checkbox-control::before {
3332
3335
  -webkit-transition: none;
3333
3336
  transition: none;
3334
3337
  }
3335
- .rs-checkbox-checked .rs-checkbox-wrapper::before {
3338
+ .rs-checkbox-checked .rs-checkbox-control::before {
3336
3339
  -webkit-transform: scale(1.5);
3337
3340
  transform: scale(1.5);
3338
3341
  opacity: 0;
3339
3342
  visibility: visible;
3340
3343
  }
3341
- .rs-checkbox-wrapper::after {
3342
- top: -10px;
3343
- right: -10px;
3344
- bottom: -10px;
3345
- left: -10px;
3346
- }
3347
- .rs-checkbox-wrapper .rs-checkbox-inner::before {
3344
+ .rs-checkbox-control .rs-checkbox-inner::before {
3348
3345
  border: 1px solid #d9d9d9;
3349
3346
  border: 1px solid var(--rs-checkbox-border);
3350
3347
  background-color: transparent;
@@ -3354,35 +3351,140 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3354
3351
  transition: background 0.2s linear, border 0.2s linear, box-shadow 0.2s linear;
3355
3352
  transition: background 0.2s linear, border 0.2s linear, box-shadow 0.2s linear, -webkit-box-shadow 0.2s linear;
3356
3353
  }
3357
- .rs-theme-high-contrast .rs-checkbox-wrapper .rs-checkbox-inner::before {
3354
+ .rs-theme-high-contrast .rs-checkbox-control .rs-checkbox-inner::before {
3358
3355
  -webkit-transition: none;
3359
3356
  transition: none;
3360
3357
  }
3361
- label:hover .rs-checkbox-wrapper .rs-checkbox-inner::before {
3358
+ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
3362
3359
  border-color: #3498ff;
3363
3360
  border-color: var(--rs-checkbox-checked-bg);
3364
3361
  }
3365
- .rs-checkbox-disabled:not(.rs-checkbox-checked):not(.rs-checkbox-indeterminate) .rs-checkbox-wrapper .rs-checkbox-inner::before {
3362
+ .rs-checkbox-disabled:not(.rs-checkbox-checked):not(.rs-checkbox-indeterminate) .rs-checkbox-control .rs-checkbox-inner::before {
3366
3363
  border-color: #f7f7fa;
3367
3364
  border-color: var(--rs-checkbox-disabled-bg);
3368
3365
  background-color: #f7f7fa;
3369
3366
  background-color: var(--rs-checkbox-disabled-bg);
3370
3367
  }
3371
- .rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::before,
3372
- .rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::before {
3368
+ .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::before,
3369
+ .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::before {
3373
3370
  border-color: #3498ff;
3374
3371
  border-color: var(--rs-checkbox-checked-bg);
3375
3372
  background-color: #3498ff;
3376
3373
  background-color: var(--rs-checkbox-checked-bg);
3377
3374
  }
3378
- .rs-checkbox-disabled.rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::before,
3379
- .rs-checkbox-disabled.rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::before {
3375
+ .rs-checkbox-disabled.rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::before,
3376
+ .rs-checkbox-disabled.rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::before {
3380
3377
  opacity: 0.3;
3381
3378
  }
3382
- .rs-theme-high-contrast .rs-checkbox-disabled.rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::before,
3383
- .rs-theme-high-contrast .rs-checkbox-disabled.rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::before {
3379
+ .rs-theme-high-contrast .rs-checkbox-disabled.rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::before,
3380
+ .rs-theme-high-contrast .rs-checkbox-disabled.rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::before {
3384
3381
  opacity: 0.5;
3385
3382
  }
3383
+ .rs-checkbox-red .rs-checkbox-control::before {
3384
+ border-color: #f44336;
3385
+ border-color: var(--rs-red-500);
3386
+ }
3387
+ .rs-checkbox-red label:hover .rs-checkbox-inner::before {
3388
+ border-color: #f44336;
3389
+ border-color: var(--rs-red-500);
3390
+ }
3391
+ .rs-checkbox-red.rs-checkbox-checked .rs-checkbox-inner::before,
3392
+ .rs-checkbox-red.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3393
+ border-color: #f44336;
3394
+ border-color: var(--rs-red-500);
3395
+ background-color: #f44336;
3396
+ background-color: var(--rs-red-500);
3397
+ }
3398
+ .rs-checkbox-orange .rs-checkbox-control::before {
3399
+ border-color: #fa8900;
3400
+ border-color: var(--rs-orange-500);
3401
+ }
3402
+ .rs-checkbox-orange label:hover .rs-checkbox-inner::before {
3403
+ border-color: #fa8900;
3404
+ border-color: var(--rs-orange-500);
3405
+ }
3406
+ .rs-checkbox-orange.rs-checkbox-checked .rs-checkbox-inner::before,
3407
+ .rs-checkbox-orange.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3408
+ border-color: #fa8900;
3409
+ border-color: var(--rs-orange-500);
3410
+ background-color: #fa8900;
3411
+ background-color: var(--rs-orange-500);
3412
+ }
3413
+ .rs-checkbox-yellow .rs-checkbox-control::before {
3414
+ border-color: #ffb300;
3415
+ border-color: var(--rs-yellow-500);
3416
+ }
3417
+ .rs-checkbox-yellow label:hover .rs-checkbox-inner::before {
3418
+ border-color: #ffb300;
3419
+ border-color: var(--rs-yellow-500);
3420
+ }
3421
+ .rs-checkbox-yellow.rs-checkbox-checked .rs-checkbox-inner::before,
3422
+ .rs-checkbox-yellow.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3423
+ border-color: #ffb300;
3424
+ border-color: var(--rs-yellow-500);
3425
+ background-color: #ffb300;
3426
+ background-color: var(--rs-yellow-500);
3427
+ }
3428
+ .rs-checkbox-green .rs-checkbox-control::before {
3429
+ border-color: #4caf50;
3430
+ border-color: var(--rs-green-500);
3431
+ }
3432
+ .rs-checkbox-green label:hover .rs-checkbox-inner::before {
3433
+ border-color: #4caf50;
3434
+ border-color: var(--rs-green-500);
3435
+ }
3436
+ .rs-checkbox-green.rs-checkbox-checked .rs-checkbox-inner::before,
3437
+ .rs-checkbox-green.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3438
+ border-color: #4caf50;
3439
+ border-color: var(--rs-green-500);
3440
+ background-color: #4caf50;
3441
+ background-color: var(--rs-green-500);
3442
+ }
3443
+ .rs-checkbox-cyan .rs-checkbox-control::before {
3444
+ border-color: #00bcd4;
3445
+ border-color: var(--rs-cyan-500);
3446
+ }
3447
+ .rs-checkbox-cyan label:hover .rs-checkbox-inner::before {
3448
+ border-color: #00bcd4;
3449
+ border-color: var(--rs-cyan-500);
3450
+ }
3451
+ .rs-checkbox-cyan.rs-checkbox-checked .rs-checkbox-inner::before,
3452
+ .rs-checkbox-cyan.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3453
+ border-color: #00bcd4;
3454
+ border-color: var(--rs-cyan-500);
3455
+ background-color: #00bcd4;
3456
+ background-color: var(--rs-cyan-500);
3457
+ }
3458
+ .rs-checkbox-blue .rs-checkbox-control::before {
3459
+ border-color: #2196f3;
3460
+ border-color: var(--rs-blue-500);
3461
+ }
3462
+ .rs-checkbox-blue label:hover .rs-checkbox-inner::before {
3463
+ border-color: #2196f3;
3464
+ border-color: var(--rs-blue-500);
3465
+ }
3466
+ .rs-checkbox-blue.rs-checkbox-checked .rs-checkbox-inner::before,
3467
+ .rs-checkbox-blue.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3468
+ border-color: #2196f3;
3469
+ border-color: var(--rs-blue-500);
3470
+ background-color: #2196f3;
3471
+ background-color: var(--rs-blue-500);
3472
+ }
3473
+ .rs-checkbox-violet .rs-checkbox-control::before {
3474
+ border-color: #673ab7;
3475
+ border-color: var(--rs-violet-500);
3476
+ }
3477
+ .rs-checkbox-violet label:hover .rs-checkbox-inner::before {
3478
+ border-color: #673ab7;
3479
+ border-color: var(--rs-violet-500);
3480
+ }
3481
+ .rs-checkbox-violet.rs-checkbox-checked .rs-checkbox-inner::before,
3482
+ .rs-checkbox-violet.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3483
+ border-color: #673ab7;
3484
+ border-color: var(--rs-violet-500);
3485
+ background-color: #673ab7;
3486
+ background-color: var(--rs-violet-500);
3487
+ }
3386
3488
  .rs-check-tree {
3387
3489
  max-height: 360px;
3388
3490
  height: 100%;
@@ -3400,7 +3502,7 @@ label:hover .rs-checkbox-wrapper .rs-checkbox-inner::before {
3400
3502
  margin: 0;
3401
3503
  padding: 1px 0 1px 42px;
3402
3504
  }
3403
- .rs-check-tree .rs-check-tree-node-label .rs-check-item .rs-checkbox-checker .rs-checkbox-wrapper {
3505
+ .rs-check-tree .rs-check-tree-node-label .rs-check-item .rs-checkbox-checker .rs-checkbox-control {
3404
3506
  left: 20px;
3405
3507
  }
3406
3508
  .rs-check-tree .rs-check-tree-node-label .rs-check-item .rs-checkbox-checker .rs-check-tree-node-label-content {
@@ -3421,7 +3523,7 @@ label:hover .rs-checkbox-wrapper .rs-checkbox-inner::before {
3421
3523
  width: 28px;
3422
3524
  margin-left: -34px;
3423
3525
  }
3424
- .rs-check-tree-without-children .rs-check-item .rs-checkbox-checker .rs-checkbox-wrapper {
3526
+ .rs-check-tree-without-children .rs-check-item .rs-checkbox-checker .rs-checkbox-control {
3425
3527
  left: 0;
3426
3528
  }
3427
3529
  .rs-check-tree-node {
package/CheckTreePicker/styles/index.css CHANGED
@@ -3188,11 +3188,11 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3188
3188
  .rs-picker-check-menu-group-children .rs-check-item .rs-checkbox-checker > label {
3189
3189
  padding-left: 52px;
3190
3190
  }
3191
- .rs-check-item .rs-checkbox-checker .rs-checkbox-wrapper {
3191
+ .rs-check-item .rs-checkbox-checker .rs-checkbox-control {
3192
3192
  left: 12px;
3193
3193
  }
3194
- .grouped .rs-check-item .rs-checkbox-checker .rs-checkbox-wrapper,
3195
- .rs-picker-check-menu-group-children .rs-check-item .rs-checkbox-checker .rs-checkbox-wrapper {
3194
+ .grouped .rs-check-item .rs-checkbox-checker .rs-checkbox-control,
3195
+ .rs-picker-check-menu-group-children .rs-check-item .rs-checkbox-checker .rs-checkbox-control {
3196
3196
  left: 26px;
3197
3197
  }
3198
3198
  .rs-checkbox {
@@ -3247,17 +3247,16 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3247
3247
  position: relative;
3248
3248
  }
3249
3249
  /* rtl:begin:ignore */
3250
- .rs-checkbox-wrapper::before,
3251
- .rs-checkbox-wrapper::after,
3252
- .rs-checkbox-wrapper .rs-checkbox-inner::before,
3253
- .rs-checkbox-wrapper .rs-checkbox-inner::after {
3250
+ .rs-checkbox-control::before,
3251
+ .rs-checkbox-control .rs-checkbox-inner::before,
3252
+ .rs-checkbox-control .rs-checkbox-inner::after {
3254
3253
  content: '';
3255
3254
  position: absolute;
3256
3255
  left: 0;
3257
3256
  top: 0;
3258
3257
  display: block;
3259
3258
  }
3260
- .rs-checkbox-wrapper .rs-checkbox-inner::after {
3259
+ .rs-checkbox-control .rs-checkbox-inner::after {
3261
3260
  opacity: 0;
3262
3261
  -webkit-transform: rotate(45deg) scale(0);
3263
3262
  transform: rotate(45deg) scale(0);
@@ -3266,12 +3265,12 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3266
3265
  transition: opacity 0.2s ease-in, transform 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46);
3267
3266
  transition: opacity 0.2s ease-in, transform 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46), -webkit-transform 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46);
3268
3267
  }
3269
- .rs-theme-high-contrast .rs-checkbox-wrapper .rs-checkbox-inner::after {
3268
+ .rs-theme-high-contrast .rs-checkbox-control .rs-checkbox-inner::after {
3270
3269
  -webkit-transition: none;
3271
3270
  transition: none;
3272
3271
  }
3273
- .rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::after,
3274
- .rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::after {
3272
+ .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::after,
3273
+ .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::after {
3275
3274
  border: solid #fff;
3276
3275
  border: solid var(--rs-checkbox-icon);
3277
3276
  width: 6px;
@@ -3280,12 +3279,12 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3280
3279
  margin-left: 5px;
3281
3280
  opacity: 1;
3282
3281
  }
3283
- .rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::after {
3282
+ .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::after {
3284
3283
  border-width: 0 2px 2px 0;
3285
3284
  -webkit-transform: rotate(45deg) scale(1);
3286
3285
  transform: rotate(45deg) scale(1);
3287
3286
  }
3288
- .rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::after {
3287
+ .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::after {
3289
3288
  border-width: 0 0 2px;
3290
3289
  -webkit-transform: rotate(0deg) scale(1);
3291
3290
  transform: rotate(0deg) scale(1);
@@ -3295,7 +3294,7 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3295
3294
  }
3296
3295
  /* rtl:end:ignore */
3297
3296
  /* stylelint-disable-next-line */
3298
- .rs-checkbox-wrapper {
3297
+ .rs-checkbox-control {
3299
3298
  position: absolute;
3300
3299
  width: 16px;
3301
3300
  height: 16px;
@@ -3303,18 +3302,22 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3303
3302
  left: 10px;
3304
3303
  top: 10px;
3305
3304
  }
3306
- .rs-checkbox-wrapper [type='checkbox'] {
3307
- width: 0;
3308
- height: 0;
3305
+ .rs-checkbox-control [type='checkbox'] {
3306
+ position: absolute;
3309
3307
  opacity: 0;
3308
+ z-index: 1;
3309
+ top: -10px;
3310
+ right: -10px;
3311
+ bottom: -10px;
3312
+ left: -10px;
3310
3313
  }
3311
- .rs-checkbox-wrapper::before,
3312
- .rs-checkbox-wrapper .rs-checkbox-inner::before,
3313
- .rs-checkbox-wrapper .rs-checkbox-inner::after {
3314
+ .rs-checkbox-control::before,
3315
+ .rs-checkbox-control .rs-checkbox-inner::before,
3316
+ .rs-checkbox-control .rs-checkbox-inner::after {
3314
3317
  width: 16px;
3315
3318
  height: 16px;
3316
3319
  }
3317
- .rs-checkbox-wrapper::before {
3320
+ .rs-checkbox-control::before {
3318
3321
  border: 1px solid #3498ff;
3319
3322
  border: 1px solid var(--rs-checkbox-checked-bg);
3320
3323
  background-color: transparent;
@@ -3328,23 +3331,17 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3328
3331
  transition: transform 0.2s linear, opacity 0.2s linear;
3329
3332
  transition: transform 0.2s linear, opacity 0.2s linear, -webkit-transform 0.2s linear;
3330
3333
  }
3331
- .rs-theme-high-contrast .rs-checkbox-wrapper::before {
3334
+ .rs-theme-high-contrast .rs-checkbox-control::before {
3332
3335
  -webkit-transition: none;
3333
3336
  transition: none;
3334
3337
  }
3335
- .rs-checkbox-checked .rs-checkbox-wrapper::before {
3338
+ .rs-checkbox-checked .rs-checkbox-control::before {
3336
3339
  -webkit-transform: scale(1.5);
3337
3340
  transform: scale(1.5);
3338
3341
  opacity: 0;
3339
3342
  visibility: visible;
3340
3343
  }
3341
- .rs-checkbox-wrapper::after {
3342
- top: -10px;
3343
- right: -10px;
3344
- bottom: -10px;
3345
- left: -10px;
3346
- }
3347
- .rs-checkbox-wrapper .rs-checkbox-inner::before {
3344
+ .rs-checkbox-control .rs-checkbox-inner::before {
3348
3345
  border: 1px solid #d9d9d9;
3349
3346
  border: 1px solid var(--rs-checkbox-border);
3350
3347
  background-color: transparent;
@@ -3354,35 +3351,140 @@ textarea.rs-input-group-inside.rs-input-group-xs > .rs-input-group-btn {
3354
3351
  transition: background 0.2s linear, border 0.2s linear, box-shadow 0.2s linear;
3355
3352
  transition: background 0.2s linear, border 0.2s linear, box-shadow 0.2s linear, -webkit-box-shadow 0.2s linear;
3356
3353
  }
3357
- .rs-theme-high-contrast .rs-checkbox-wrapper .rs-checkbox-inner::before {
3354
+ .rs-theme-high-contrast .rs-checkbox-control .rs-checkbox-inner::before {
3358
3355
  -webkit-transition: none;
3359
3356
  transition: none;
3360
3357
  }
3361
- label:hover .rs-checkbox-wrapper .rs-checkbox-inner::before {
3358
+ label:hover .rs-checkbox-control .rs-checkbox-inner::before {
3362
3359
  border-color: #3498ff;
3363
3360
  border-color: var(--rs-checkbox-checked-bg);
3364
3361
  }
3365
- .rs-checkbox-disabled:not(.rs-checkbox-checked):not(.rs-checkbox-indeterminate) .rs-checkbox-wrapper .rs-checkbox-inner::before {
3362
+ .rs-checkbox-disabled:not(.rs-checkbox-checked):not(.rs-checkbox-indeterminate) .rs-checkbox-control .rs-checkbox-inner::before {
3366
3363
  border-color: #f7f7fa;
3367
3364
  border-color: var(--rs-checkbox-disabled-bg);
3368
3365
  background-color: #f7f7fa;
3369
3366
  background-color: var(--rs-checkbox-disabled-bg);
3370
3367
  }
3371
- .rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::before,
3372
- .rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::before {
3368
+ .rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::before,
3369
+ .rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::before {
3373
3370
  border-color: #3498ff;
3374
3371
  border-color: var(--rs-checkbox-checked-bg);
3375
3372
  background-color: #3498ff;
3376
3373
  background-color: var(--rs-checkbox-checked-bg);
3377
3374
  }
3378
- .rs-checkbox-disabled.rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::before,
3379
- .rs-checkbox-disabled.rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::before {
3375
+ .rs-checkbox-disabled.rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::before,
3376
+ .rs-checkbox-disabled.rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::before {
3380
3377
  opacity: 0.3;
3381
3378
  }
3382
- .rs-theme-high-contrast .rs-checkbox-disabled.rs-checkbox-checked .rs-checkbox-wrapper .rs-checkbox-inner::before,
3383
- .rs-theme-high-contrast .rs-checkbox-disabled.rs-checkbox-indeterminate .rs-checkbox-wrapper .rs-checkbox-inner::before {
3379
+ .rs-theme-high-contrast .rs-checkbox-disabled.rs-checkbox-checked .rs-checkbox-control .rs-checkbox-inner::before,
3380
+ .rs-theme-high-contrast .rs-checkbox-disabled.rs-checkbox-indeterminate .rs-checkbox-control .rs-checkbox-inner::before {
3384
3381
  opacity: 0.5;
3385
3382
  }
3383
+ .rs-checkbox-red .rs-checkbox-control::before {
3384
+ border-color: #f44336;
3385
+ border-color: var(--rs-red-500);
3386
+ }
3387
+ .rs-checkbox-red label:hover .rs-checkbox-inner::before {
3388
+ border-color: #f44336;
3389
+ border-color: var(--rs-red-500);
3390
+ }
3391
+ .rs-checkbox-red.rs-checkbox-checked .rs-checkbox-inner::before,
3392
+ .rs-checkbox-red.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3393
+ border-color: #f44336;
3394
+ border-color: var(--rs-red-500);
3395
+ background-color: #f44336;
3396
+ background-color: var(--rs-red-500);
3397
+ }
3398
+ .rs-checkbox-orange .rs-checkbox-control::before {
3399
+ border-color: #fa8900;
3400
+ border-color: var(--rs-orange-500);
3401
+ }
3402
+ .rs-checkbox-orange label:hover .rs-checkbox-inner::before {
3403
+ border-color: #fa8900;
3404
+ border-color: var(--rs-orange-500);
3405
+ }
3406
+ .rs-checkbox-orange.rs-checkbox-checked .rs-checkbox-inner::before,
3407
+ .rs-checkbox-orange.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3408
+ border-color: #fa8900;
3409
+ border-color: var(--rs-orange-500);
3410
+ background-color: #fa8900;
3411
+ background-color: var(--rs-orange-500);
3412
+ }
3413
+ .rs-checkbox-yellow .rs-checkbox-control::before {
3414
+ border-color: #ffb300;
3415
+ border-color: var(--rs-yellow-500);
3416
+ }
3417
+ .rs-checkbox-yellow label:hover .rs-checkbox-inner::before {
3418
+ border-color: #ffb300;
3419
+ border-color: var(--rs-yellow-500);
3420
+ }
3421
+ .rs-checkbox-yellow.rs-checkbox-checked .rs-checkbox-inner::before,
3422
+ .rs-checkbox-yellow.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3423
+ border-color: #ffb300;
3424
+ border-color: var(--rs-yellow-500);
3425
+ background-color: #ffb300;
3426
+ background-color: var(--rs-yellow-500);
3427
+ }
3428
+ .rs-checkbox-green .rs-checkbox-control::before {
3429
+ border-color: #4caf50;
3430
+ border-color: var(--rs-green-500);
3431
+ }
3432
+ .rs-checkbox-green label:hover .rs-checkbox-inner::before {
3433
+ border-color: #4caf50;
3434
+ border-color: var(--rs-green-500);
3435
+ }
3436
+ .rs-checkbox-green.rs-checkbox-checked .rs-checkbox-inner::before,
3437
+ .rs-checkbox-green.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3438
+ border-color: #4caf50;
3439
+ border-color: var(--rs-green-500);
3440
+ background-color: #4caf50;
3441
+ background-color: var(--rs-green-500);
3442
+ }
3443
+ .rs-checkbox-cyan .rs-checkbox-control::before {
3444
+ border-color: #00bcd4;
3445
+ border-color: var(--rs-cyan-500);
3446
+ }
3447
+ .rs-checkbox-cyan label:hover .rs-checkbox-inner::before {
3448
+ border-color: #00bcd4;
3449
+ border-color: var(--rs-cyan-500);
3450
+ }
3451
+ .rs-checkbox-cyan.rs-checkbox-checked .rs-checkbox-inner::before,
3452
+ .rs-checkbox-cyan.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3453
+ border-color: #00bcd4;
3454
+ border-color: var(--rs-cyan-500);
3455
+ background-color: #00bcd4;
3456
+ background-color: var(--rs-cyan-500);
3457
+ }
3458
+ .rs-checkbox-blue .rs-checkbox-control::before {
3459
+ border-color: #2196f3;
3460
+ border-color: var(--rs-blue-500);
3461
+ }
3462
+ .rs-checkbox-blue label:hover .rs-checkbox-inner::before {
3463
+ border-color: #2196f3;
3464
+ border-color: var(--rs-blue-500);
3465
+ }
3466
+ .rs-checkbox-blue.rs-checkbox-checked .rs-checkbox-inner::before,
3467
+ .rs-checkbox-blue.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3468
+ border-color: #2196f3;
3469
+ border-color: var(--rs-blue-500);
3470
+ background-color: #2196f3;
3471
+ background-color: var(--rs-blue-500);
3472
+ }
3473
+ .rs-checkbox-violet .rs-checkbox-control::before {
3474
+ border-color: #673ab7;
3475
+ border-color: var(--rs-violet-500);
3476
+ }
3477
+ .rs-checkbox-violet label:hover .rs-checkbox-inner::before {
3478
+ border-color: #673ab7;
3479
+ border-color: var(--rs-violet-500);
3480
+ }
3481
+ .rs-checkbox-violet.rs-checkbox-checked .rs-checkbox-inner::before,
3482
+ .rs-checkbox-violet.rs-checkbox-indeterminate .rs-checkbox-inner::before {
3483
+ border-color: #673ab7;
3484
+ border-color: var(--rs-violet-500);
3485
+ background-color: #673ab7;
3486
+ background-color: var(--rs-violet-500);
3487
+ }
3386
3488
  .rs-check-tree {
3387
3489
  max-height: 360px;
3388
3490
  height: 100%;
@@ -3400,7 +3502,7 @@ label:hover .rs-checkbox-wrapper .rs-checkbox-inner::before {
3400
3502
  margin: 0;
3401
3503
  padding: 1px 0 1px 42px;
3402
3504
  }
3403
- .rs-check-tree .rs-check-tree-node-label .rs-check-item .rs-checkbox-checker .rs-checkbox-wrapper {
3505
+ .rs-check-tree .rs-check-tree-node-label .rs-check-item .rs-checkbox-checker .rs-checkbox-control {
3404
3506
  left: 20px;
3405
3507
  }
3406
3508
  .rs-check-tree .rs-check-tree-node-label .rs-check-item .rs-checkbox-checker .rs-check-tree-node-label-content {
@@ -3421,7 +3523,7 @@ label:hover .rs-checkbox-wrapper .rs-checkbox-inner::before {
3421
3523
  width: 28px;
3422
3524
  margin-left: -34px;
3423
3525
  }
3424
- .rs-check-tree-without-children .rs-check-item .rs-checkbox-checker .rs-checkbox-wrapper {
3526
+ .rs-check-tree-without-children .rs-check-item .rs-checkbox-checker .rs-checkbox-control {
3425
3527
  left: 0;
3426
3528
  }
3427
3529
  .rs-check-tree-node {
package/CheckTreePicker/styles/index.less CHANGED
@@ -25,7 +25,7 @@
25
25
  padding: 1px 0 1px 42px;
26
26
  }
27
27
 
28
- .rs-checkbox-wrapper {
28
+ .rs-checkbox-control {
29
29
  left: (@checkbox-sense-width + 10px);
30
30
  }
31
31
 
@@ -54,7 +54,7 @@
54
54
  }
55
55
  }
56
56
 
57
- .rs-checkbox-wrapper {
57
+ .rs-checkbox-control {
58
58
  left: 0;
59
59
  }
60
60
  }