@aivenio/aquarium 3.1.0 → 4.0.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 (94) hide show
  1. package/dist/atoms.cjs +5209 -2707
  2. package/dist/atoms.mjs +5282 -2783
  3. package/dist/src/atoms/Button/Button.d.ts +105 -0
  4. package/dist/src/atoms/Button/Button.js +117 -0
  5. package/dist/src/atoms/Dialog/Dialog.d.ts +3 -0
  6. package/dist/src/atoms/Dialog/Dialog.js +7 -1
  7. package/dist/src/atoms/Link/Link.d.ts +7 -2
  8. package/dist/src/atoms/Link/Link.js +13 -3
  9. package/dist/src/atoms/Popover/Popover.d.ts +13 -7
  10. package/dist/src/atoms/Popover/Popover.js +15 -12
  11. package/dist/src/atoms/Pressable/Pressable.d.ts +9 -0
  12. package/dist/src/atoms/Pressable/Pressable.js +24 -0
  13. package/dist/src/atoms/index.d.ts +1 -0
  14. package/dist/src/atoms/index.js +2 -1
  15. package/dist/src/icons/discoveredOrg.d.ts +9 -0
  16. package/dist/src/icons/discoveredOrg.js +11 -0
  17. package/dist/src/icons/index.d.ts +1 -0
  18. package/dist/src/icons/index.js +2 -1
  19. package/dist/src/molecules/Alert/Alert.d.ts +0 -5
  20. package/dist/src/molecules/Alert/Alert.js +5 -4
  21. package/dist/src/molecules/Banner/Banner.d.ts +0 -5
  22. package/dist/src/molecules/Banner/Banner.js +5 -4
  23. package/dist/src/molecules/Button/Button.d.ts +35 -186
  24. package/dist/src/molecules/Button/Button.js +35 -151
  25. package/dist/src/molecules/Card/Card.d.ts +0 -5
  26. package/dist/src/molecules/Card/Card.js +4 -5
  27. package/dist/src/molecules/Card/Compact.js +2 -2
  28. package/dist/src/molecules/Card/types.d.ts +0 -14
  29. package/dist/src/molecules/Carousel/Carousel.js +6 -6
  30. package/dist/src/molecules/Chip/Chip.d.ts +0 -8
  31. package/dist/src/molecules/Chip/Chip.js +2 -3
  32. package/dist/src/molecules/Combobox/Combobox.d.ts +2 -6
  33. package/dist/src/molecules/Combobox/Combobox.js +9 -16
  34. package/dist/src/molecules/DataList/DataList.d.ts +2 -2
  35. package/dist/src/molecules/DataList/DataList.js +4 -3
  36. package/dist/src/molecules/DataList/DataListGroup.js +5 -4
  37. package/dist/src/molecules/DataList/DataListToolbar.js +2 -2
  38. package/dist/src/molecules/DataTable/DataTable.d.ts +1 -1
  39. package/dist/src/molecules/DataTable/DataTable.js +2 -2
  40. package/dist/src/molecules/DatePicker/Button.d.ts +3 -8
  41. package/dist/src/molecules/DatePicker/Button.js +9 -28
  42. package/dist/src/molecules/Drawer/Drawer.js +23 -26
  43. package/dist/src/molecules/Dropdown/Dropdown.d.ts +3 -2
  44. package/dist/src/molecules/Dropdown/Dropdown.js +6 -6
  45. package/dist/src/molecules/DropdownMenu/DropdownMenu.d.ts +4 -4
  46. package/dist/src/molecules/DropdownMenu/DropdownMenu.js +7 -19
  47. package/dist/src/molecules/EmptyState/EmptyState.d.ts +3 -25
  48. package/dist/src/molecules/EmptyState/EmptyState.js +5 -35
  49. package/dist/src/molecules/Link/Link.d.ts +22 -21
  50. package/dist/src/molecules/Link/Link.js +26 -21
  51. package/dist/src/molecules/MultiInput/MultiInput.d.ts +1 -5
  52. package/dist/src/molecules/MultiInput/MultiInput.js +6 -7
  53. package/dist/src/molecules/MultiSelect/MultiSelect.d.ts +2 -2
  54. package/dist/src/molecules/MultiSelect/MultiSelect.js +9 -16
  55. package/dist/src/molecules/PageHeader/PageHeader.js +2 -2
  56. package/dist/src/molecules/Popover/Popover.d.ts +21 -30
  57. package/dist/src/molecules/Popover/Popover.js +35 -58
  58. package/dist/src/molecules/PopoverDialog/PopoverDialog.d.ts +2 -1
  59. package/dist/src/molecules/PopoverDialog/PopoverDialog.js +36 -25
  60. package/dist/src/molecules/RadioButtonGroup/RadioButtonGroup.d.ts +3 -10
  61. package/dist/src/molecules/RadioButtonGroup/RadioButtonGroup.js +8 -7
  62. package/dist/src/molecules/Section/Section.js +5 -5
  63. package/dist/src/molecules/SegmentedControl/SegmentedControl.d.ts +2 -19
  64. package/dist/src/molecules/SegmentedControl/SegmentedControl.js +3 -3
  65. package/dist/src/molecules/Select/Select.js +15 -14
  66. package/dist/src/molecules/Tooltip/Tooltip.d.ts +1 -8
  67. package/dist/src/molecules/Tooltip/Tooltip.js +3 -3
  68. package/dist/src/molecules/Typography/Typography.d.ts +0 -20
  69. package/dist/src/molecules/Typography/Typography.js +1 -27
  70. package/dist/src/molecules/index.d.ts +0 -3
  71. package/dist/src/molecules/index.js +1 -4
  72. package/dist/src/utils/ContrastRatio.js +5 -5
  73. package/dist/src/utils/actions.d.ts +5 -5
  74. package/dist/src/utils/actions.js +3 -3
  75. package/dist/src/utils/constants.d.ts +2 -2
  76. package/dist/src/utils/constants.js +9 -4
  77. package/dist/src/utils/form/HelperText/HelperText.js +4 -4
  78. package/dist/src/utils/form/InputAdornment/InputAdornment.js +3 -3
  79. package/dist/src/utils/form/Label/Label.d.ts +1 -1
  80. package/dist/styles.css +57 -119
  81. package/dist/system.cjs +4046 -1869
  82. package/dist/system.mjs +3923 -1726
  83. package/dist/tsconfig.module.tsbuildinfo +1 -1
  84. package/dist/types/ContextualMenu.d.ts +2 -7
  85. package/dist/types/tailwindGenerated.d.ts +1 -1
  86. package/package.json +1 -1
  87. package/dist/src/molecules/Flexbox/Flexbox.d.ts +0 -23
  88. package/dist/src/molecules/Flexbox/Flexbox.js +0 -22
  89. package/dist/src/molecules/Flexbox/FlexboxItem.d.ts +0 -20
  90. package/dist/src/molecules/Flexbox/FlexboxItem.js +0 -19
  91. package/dist/src/molecules/Grid/GridItem.d.ts +0 -24
  92. package/dist/src/molecules/Grid/GridItem.js +0 -23
  93. package/dist/src/molecules/Popover/PopoverOverlay.d.ts +0 -21
  94. package/dist/src/molecules/Popover/PopoverOverlay.js +0 -35
package/dist/styles.css CHANGED
@@ -1541,6 +1541,9 @@ input[type='number'].no-arrows {
1541
1541
  .cursor-pointer{
1542
1542
  cursor: pointer;
1543
1543
  }
1544
+ .cursor-wait{
1545
+ cursor: wait;
1546
+ }
1544
1547
  .resize-none{
1545
1548
  resize: none;
1546
1549
  }
@@ -3526,9 +3529,6 @@ input[type='number'].no-arrows {
3526
3529
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0);
3527
3530
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
3528
3531
  }
3529
- .ring-inset{
3530
- --tw-ring-inset: inset;
3531
- }
3532
3532
  .ring-primary-default{
3533
3533
  --tw-ring-color: var(--aquarium-border-color-primary-default);
3534
3534
  }
@@ -3820,6 +3820,32 @@ input[type='number'].no-arrows {
3820
3820
  color: rgba(150,150,160,1);
3821
3821
  color: var(--aquarium-text-color-inactive);
3822
3822
  }
3823
+ .before\:absolute::before{
3824
+ content: var(--tw-content);
3825
+ position: absolute;
3826
+ }
3827
+ .before\:inset-0::before{
3828
+ content: var(--tw-content);
3829
+ top: 0px;
3830
+ right: 0px;
3831
+ bottom: 0px;
3832
+ left: 0px;
3833
+ }
3834
+ .before\:rounded-sm::before{
3835
+ content: var(--tw-content);
3836
+ border-radius: 0.125rem;
3837
+ border-radius: var(--aquarium-border-radius-sm);
3838
+ }
3839
+ .before\:border::before{
3840
+ content: var(--tw-content);
3841
+ border-width: 1px;
3842
+ border-width: var(--aquarium-border-width-default);
3843
+ }
3844
+ .before\:border-primary-default::before{
3845
+ content: var(--tw-content);
3846
+ border-color: rgba(53,69,190,1);
3847
+ border-color: var(--aquarium-border-color-primary-default);
3848
+ }
3823
3849
  .before\:content-\[\'_\'\]::before{
3824
3850
  --tw-content: ' ';
3825
3851
  content: var(--tw-content);
@@ -3868,38 +3894,13 @@ input[type='number'].no-arrows {
3868
3894
  background-color: rgba(243,246,255,1);
3869
3895
  background-color: var(--aquarium-background-color-primary-active);
3870
3896
  }
3871
- .active\:bg-primary-intense:active{
3872
- background-color: rgba(34,47,149,1);
3873
- background-color: var(--aquarium-background-color-primary-intense);
3874
- }
3875
- .active\:bg-transparent:active{
3876
- background-color: transparent;
3877
- background-color: var(--aquarium-colors-transparent);
3878
- }
3879
- .active\:text-default:active{
3880
- color: rgba(74,75,87,1);
3881
- color: var(--aquarium-text-color-default);
3882
- }
3883
- .active\:text-muted:active{
3884
- color: rgba(120,120,133,1);
3885
- color: var(--aquarium-text-color-muted);
3886
- }
3887
3897
  .active\:text-primary-active:active{
3888
3898
  color: rgba(34,47,149,1);
3889
3899
  color: var(--aquarium-text-color-primary-active);
3890
3900
  }
3891
- .active\:text-primary-intense:active{
3892
- color: rgba(53,69,190,1);
3893
- color: var(--aquarium-text-color-primary-intense);
3894
- }
3895
- .active\:ring-0:active{
3896
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
3897
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
3898
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0);
3899
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
3900
- }
3901
- .active\:ring-primary-default:active{
3902
- --tw-ring-color: var(--aquarium-border-color-primary-default);
3901
+ .active\:text-white:active{
3902
+ color: white;
3903
+ color: var(--aquarium-colors-white);
3903
3904
  }
3904
3905
  .peer\/switch:checked~.peer-checked\/switch\:left-1{
3905
3906
  left: 2px;
@@ -4014,10 +4015,6 @@ input[type='number'].no-arrows {
4014
4015
  background-color: rgba(34,47,149,1);
4015
4016
  background-color: var(--aquarium-background-color-primary-intense);
4016
4017
  }
4017
- .hover\:text-intense:where([data-rac])[data-hovered]{
4018
- color: rgba(41,42,49,1);
4019
- color: var(--aquarium-text-color-intense);
4020
- }
4021
4018
  .hover\:text-primary-active:where([data-rac])[data-hovered]{
4022
4019
  color: rgba(34,47,149,1);
4023
4020
  color: var(--aquarium-text-color-primary-active);
@@ -4026,17 +4023,10 @@ input[type='number'].no-arrows {
4026
4023
  color: rgba(88,101,205,1);
4027
4024
  color: var(--aquarium-text-color-primary-default);
4028
4025
  }
4029
- .hover\:text-primary-intense:where([data-rac])[data-hovered]{
4030
- color: rgba(53,69,190,1);
4031
- color: var(--aquarium-text-color-primary-intense);
4032
- }
4033
4026
  .hover\:underline:where([data-rac])[data-hovered]{
4034
4027
  -webkit-text-decoration-line: underline;
4035
4028
  text-decoration-line: underline;
4036
4029
  }
4037
- .hover\:ring-primary-default:where([data-rac])[data-hovered]{
4038
- --tw-ring-color: var(--aquarium-border-color-primary-default);
4039
- }
4040
4030
  .hover\:checked\:bg-primary-intense:checked:where([data-rac])[data-hovered]{
4041
4031
  background-color: rgba(34,47,149,1);
4042
4032
  background-color: var(--aquarium-background-color-primary-intense);
@@ -4076,10 +4066,6 @@ input[type='number'].no-arrows {
4076
4066
  background-color: rgba(34,47,149,1);
4077
4067
  background-color: var(--aquarium-background-color-primary-intense);
4078
4068
  }
4079
- .hover\:text-intense:where(:not([data-rac])):hover{
4080
- color: rgba(41,42,49,1);
4081
- color: var(--aquarium-text-color-intense);
4082
- }
4083
4069
  .hover\:text-primary-active:where(:not([data-rac])):hover{
4084
4070
  color: rgba(34,47,149,1);
4085
4071
  color: var(--aquarium-text-color-primary-active);
@@ -4088,17 +4074,10 @@ input[type='number'].no-arrows {
4088
4074
  color: rgba(88,101,205,1);
4089
4075
  color: var(--aquarium-text-color-primary-default);
4090
4076
  }
4091
- .hover\:text-primary-intense:where(:not([data-rac])):hover{
4092
- color: rgba(53,69,190,1);
4093
- color: var(--aquarium-text-color-primary-intense);
4094
- }
4095
4077
  .hover\:underline:where(:not([data-rac])):hover{
4096
4078
  -webkit-text-decoration-line: underline;
4097
4079
  text-decoration-line: underline;
4098
4080
  }
4099
- .hover\:ring-primary-default:where(:not([data-rac])):hover{
4100
- --tw-ring-color: var(--aquarium-border-color-primary-default);
4101
- }
4102
4081
  .hover\:checked\:bg-primary-intense:checked:where(:not([data-rac])):hover{
4103
4082
  background-color: rgba(34,47,149,1);
4104
4083
  background-color: var(--aquarium-background-color-primary-intense);
@@ -4249,22 +4228,10 @@ input[type='number'].no-arrows {
4249
4228
  border-color: rgba(3,153,227,1);
4250
4229
  border-color: var(--aquarium-border-color-info-default);
4251
4230
  }
4252
- .focus-visible\:bg-muted:where([data-rac])[data-focus-visible]{
4253
- background-color: rgba(247,247,250,1);
4254
- background-color: var(--aquarium-background-color-muted);
4255
- }
4256
- .focus-visible\:text-intense:where([data-rac])[data-focus-visible]{
4257
- color: rgba(41,42,49,1);
4258
- color: var(--aquarium-text-color-intense);
4259
- }
4260
4231
  .focus-visible\:text-primary-active:where([data-rac])[data-focus-visible]{
4261
4232
  color: rgba(34,47,149,1);
4262
4233
  color: var(--aquarium-text-color-primary-active);
4263
4234
  }
4264
- .focus-visible\:text-primary-intense:where([data-rac])[data-focus-visible]{
4265
- color: rgba(53,69,190,1);
4266
- color: var(--aquarium-text-color-primary-intense);
4267
- }
4268
4235
  .focus-visible\:outline-none:where([data-rac])[data-focus-visible]{
4269
4236
  outline: 2px solid transparent;
4270
4237
  outline-offset: 2px;
@@ -4284,21 +4251,18 @@ input[type='number'].no-arrows {
4284
4251
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0);
4285
4252
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
4286
4253
  }
4287
- .focus-visible\:ring-inset:where([data-rac])[data-focus-visible]{
4288
- --tw-ring-inset: inset;
4289
- }
4290
4254
  .focus-visible\:ring-info-default:where([data-rac])[data-focus-visible]{
4291
4255
  --tw-ring-color: var(--aquarium-border-color-info-default);
4292
4256
  }
4293
4257
  .focus-visible\:ring-primary-default:where([data-rac])[data-focus-visible]{
4294
4258
  --tw-ring-color: var(--aquarium-border-color-primary-default);
4295
4259
  }
4296
- .focus-visible\:ring-primary-intense:where([data-rac])[data-focus-visible]{
4297
- --tw-ring-color: var(--aquarium-border-color-primary-intense);
4298
- }
4299
4260
  .focus-visible\:ring-offset-0:where([data-rac])[data-focus-visible]{
4300
4261
  --tw-ring-offset-width: 0px;
4301
4262
  }
4263
+ .focus-visible\:ring-offset-2:where([data-rac])[data-focus-visible]{
4264
+ --tw-ring-offset-width: 2px;
4265
+ }
4302
4266
  .focus-visible\:relative:where(:not([data-rac])).focus-visible{
4303
4267
  position: relative;
4304
4268
  }
@@ -4319,22 +4283,6 @@ input[type='number'].no-arrows {
4319
4283
  border-color: rgba(3,153,227,1);
4320
4284
  border-color: var(--aquarium-border-color-info-default);
4321
4285
  }
4322
- .focus-visible\:bg-muted:where(:not([data-rac])).focus-visible{
4323
- background-color: rgba(247,247,250,1);
4324
- background-color: var(--aquarium-background-color-muted);
4325
- }
4326
- .focus-visible\:bg-muted:where(:not([data-rac])):focus-visible{
4327
- background-color: rgba(247,247,250,1);
4328
- background-color: var(--aquarium-background-color-muted);
4329
- }
4330
- .focus-visible\:text-intense:where(:not([data-rac])).focus-visible{
4331
- color: rgba(41,42,49,1);
4332
- color: var(--aquarium-text-color-intense);
4333
- }
4334
- .focus-visible\:text-intense:where(:not([data-rac])):focus-visible{
4335
- color: rgba(41,42,49,1);
4336
- color: var(--aquarium-text-color-intense);
4337
- }
4338
4286
  .focus-visible\:text-primary-active:where(:not([data-rac])).focus-visible{
4339
4287
  color: rgba(34,47,149,1);
4340
4288
  color: var(--aquarium-text-color-primary-active);
@@ -4343,14 +4291,6 @@ input[type='number'].no-arrows {
4343
4291
  color: rgba(34,47,149,1);
4344
4292
  color: var(--aquarium-text-color-primary-active);
4345
4293
  }
4346
- .focus-visible\:text-primary-intense:where(:not([data-rac])).focus-visible{
4347
- color: rgba(53,69,190,1);
4348
- color: var(--aquarium-text-color-primary-intense);
4349
- }
4350
- .focus-visible\:text-primary-intense:where(:not([data-rac])):focus-visible{
4351
- color: rgba(53,69,190,1);
4352
- color: var(--aquarium-text-color-primary-intense);
4353
- }
4354
4294
  .focus-visible\:outline-none:where(:not([data-rac])).focus-visible{
4355
4295
  outline: 2px solid transparent;
4356
4296
  outline-offset: 2px;
@@ -4389,12 +4329,6 @@ input[type='number'].no-arrows {
4389
4329
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), 0 0 rgba(0,0,0,0);
4390
4330
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 rgba(0,0,0,0));
4391
4331
  }
4392
- .focus-visible\:ring-inset:where(:not([data-rac])).focus-visible{
4393
- --tw-ring-inset: inset;
4394
- }
4395
- .focus-visible\:ring-inset:where(:not([data-rac])):focus-visible{
4396
- --tw-ring-inset: inset;
4397
- }
4398
4332
  .focus-visible\:ring-info-default:where(:not([data-rac])).focus-visible{
4399
4333
  --tw-ring-color: var(--aquarium-border-color-info-default);
4400
4334
  }
@@ -4407,18 +4341,18 @@ input[type='number'].no-arrows {
4407
4341
  .focus-visible\:ring-primary-default:where(:not([data-rac])):focus-visible{
4408
4342
  --tw-ring-color: var(--aquarium-border-color-primary-default);
4409
4343
  }
4410
- .focus-visible\:ring-primary-intense:where(:not([data-rac])).focus-visible{
4411
- --tw-ring-color: var(--aquarium-border-color-primary-intense);
4412
- }
4413
- .focus-visible\:ring-primary-intense:where(:not([data-rac])):focus-visible{
4414
- --tw-ring-color: var(--aquarium-border-color-primary-intense);
4415
- }
4416
4344
  .focus-visible\:ring-offset-0:where(:not([data-rac])).focus-visible{
4417
4345
  --tw-ring-offset-width: 0px;
4418
4346
  }
4419
4347
  .focus-visible\:ring-offset-0:where(:not([data-rac])):focus-visible{
4420
4348
  --tw-ring-offset-width: 0px;
4421
4349
  }
4350
+ .focus-visible\:ring-offset-2:where(:not([data-rac])).focus-visible{
4351
+ --tw-ring-offset-width: 2px;
4352
+ }
4353
+ .focus-visible\:ring-offset-2:where(:not([data-rac])):focus-visible{
4354
+ --tw-ring-offset-width: 2px;
4355
+ }
4422
4356
  .pressed\:bg-intense[data-pressed]{
4423
4357
  background-color: rgba(210,210,214,1);
4424
4358
  background-color: var(--aquarium-background-color-intense);
@@ -4486,10 +4420,6 @@ input[type='number'].no-arrows {
4486
4420
  background-color: rgba(185,197,239,1);
4487
4421
  background-color: var(--aquarium-background-color-primary-muted);
4488
4422
  }
4489
- .disabled\:bg-transparent:where([data-rac])[data-disabled]{
4490
- background-color: transparent;
4491
- background-color: var(--aquarium-colors-transparent);
4492
- }
4493
4423
  .disabled\:text-inactive:where([data-rac])[data-disabled]{
4494
4424
  color: rgba(150,150,160,1);
4495
4425
  color: var(--aquarium-text-color-inactive);
@@ -4498,8 +4428,14 @@ input[type='number'].no-arrows {
4498
4428
  color: rgba(185,197,239,1);
4499
4429
  color: var(--aquarium-text-color-primary-inactive);
4500
4430
  }
4501
- .disabled\:ring-primary-muted:where([data-rac])[data-disabled]{
4502
- --tw-ring-color: var(--aquarium-border-color-primary-muted);
4431
+ .disabled\:text-white:where([data-rac])[data-disabled]{
4432
+ color: white;
4433
+ color: var(--aquarium-colors-white);
4434
+ }
4435
+ .before\:disabled\:border-primary-muted:where([data-rac])[data-disabled]::before{
4436
+ content: var(--tw-content);
4437
+ border-color: rgba(129,142,236,1);
4438
+ border-color: var(--aquarium-border-color-primary-muted);
4503
4439
  }
4504
4440
  .disabled\:cursor-not-allowed:where(:not([data-rac])):disabled{
4505
4441
  cursor: not-allowed;
@@ -4524,10 +4460,6 @@ input[type='number'].no-arrows {
4524
4460
  background-color: rgba(185,197,239,1);
4525
4461
  background-color: var(--aquarium-background-color-primary-muted);
4526
4462
  }
4527
- .disabled\:bg-transparent:where(:not([data-rac])):disabled{
4528
- background-color: transparent;
4529
- background-color: var(--aquarium-colors-transparent);
4530
- }
4531
4463
  .disabled\:text-inactive:where(:not([data-rac])):disabled{
4532
4464
  color: rgba(150,150,160,1);
4533
4465
  color: var(--aquarium-text-color-inactive);
@@ -4536,8 +4468,14 @@ input[type='number'].no-arrows {
4536
4468
  color: rgba(185,197,239,1);
4537
4469
  color: var(--aquarium-text-color-primary-inactive);
4538
4470
  }
4539
- .disabled\:ring-primary-muted:where(:not([data-rac])):disabled{
4540
- --tw-ring-color: var(--aquarium-border-color-primary-muted);
4471
+ .disabled\:text-white:where(:not([data-rac])):disabled{
4472
+ color: white;
4473
+ color: var(--aquarium-colors-white);
4474
+ }
4475
+ .before\:disabled\:border-primary-muted:where(:not([data-rac])):disabled::before{
4476
+ content: var(--tw-content);
4477
+ border-color: rgba(129,142,236,1);
4478
+ border-color: var(--aquarium-border-color-primary-muted);
4541
4479
  }
4542
4480
  .peer:checked:where([data-rac])[data-disabled]~.peer-checked\:peer-disabled\:bg-muted{
4543
4481
  background-color: rgba(247,247,250,1);