@react-ui-org/react-ui 0.57.0 → 0.58.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (80) hide show
  1. package/.nvmrc +1 -1
  2. package/dist/react-ui.css +14 -14
  3. package/dist/react-ui.development.css +225 -14
  4. package/dist/react-ui.development.js +102 -62
  5. package/dist/react-ui.js +1 -1
  6. package/package.json +12 -1
  7. package/src/components/Alert/Alert.jsx +3 -5
  8. package/src/components/Alert/Alert.module.scss +3 -3
  9. package/src/components/Alert/README.md +22 -10
  10. package/src/components/Badge/Badge.jsx +1 -1
  11. package/src/components/Button/Button.jsx +1 -1
  12. package/src/components/ButtonGroup/ButtonGroup.jsx +1 -1
  13. package/src/components/Card/Card.jsx +1 -1
  14. package/src/components/Card/Card.module.scss +6 -5
  15. package/src/components/Card/CardBody.jsx +1 -1
  16. package/src/components/Card/CardFooter.jsx +1 -1
  17. package/src/components/Card/README.md +22 -0
  18. package/src/components/CheckboxField/CheckboxField.jsx +9 -3
  19. package/src/components/CheckboxField/README.md +110 -5
  20. package/src/components/FileInputField/FileInputField.jsx +1 -1
  21. package/src/components/FormLayout/FormLayout.jsx +1 -1
  22. package/src/components/FormLayout/FormLayoutCustomField.jsx +1 -1
  23. package/src/components/Grid/Grid.jsx +1 -1
  24. package/src/components/Grid/GridSpan.jsx +1 -1
  25. package/src/components/InputGroup/InputGroup.jsx +2 -2
  26. package/src/components/InputGroup/InputGroup.module.scss +9 -5
  27. package/src/components/Modal/Modal.jsx +1 -1
  28. package/src/components/Modal/ModalBody.jsx +1 -1
  29. package/src/components/Modal/ModalCloseButton.jsx +3 -5
  30. package/src/components/Modal/ModalContent.jsx +1 -1
  31. package/src/components/Modal/ModalFooter.jsx +1 -1
  32. package/src/components/Modal/ModalHeader.jsx +1 -1
  33. package/src/components/Modal/ModalTitle.jsx +1 -1
  34. package/src/components/Modal/README.md +18 -18
  35. package/src/components/Paper/Paper.jsx +1 -1
  36. package/src/components/Popover/Popover.jsx +58 -13
  37. package/src/components/Popover/Popover.module.scss +37 -9
  38. package/src/components/Popover/PopoverWrapper.jsx +1 -1
  39. package/src/components/Popover/README.md +60 -3
  40. package/src/components/Popover/_helpers/cleanPlacementStyle.js +20 -0
  41. package/src/components/Radio/README.md +103 -0
  42. package/src/components/Radio/Radio.jsx +9 -3
  43. package/src/components/Radio/Radio.module.scss +4 -0
  44. package/src/components/ScrollView/ScrollView.jsx +3 -5
  45. package/src/components/SelectField/README.md +103 -0
  46. package/src/components/SelectField/SelectField.jsx +9 -3
  47. package/src/components/Table/Table.jsx +1 -1
  48. package/src/components/Tabs/Tabs.jsx +1 -1
  49. package/src/components/Tabs/TabsItem.jsx +1 -1
  50. package/src/components/Text/Text.jsx +1 -1
  51. package/src/components/TextArea/TextArea.jsx +1 -1
  52. package/src/components/TextField/README.md +14 -2
  53. package/src/components/TextField/TextField.jsx +1 -1
  54. package/src/components/TextLink/README.md +10 -3
  55. package/src/components/TextLink/TextLink.jsx +1 -1
  56. package/src/components/TextLink/_theme.scss +3 -3
  57. package/src/components/Toggle/README.md +83 -1
  58. package/src/components/Toggle/Toggle.jsx +9 -3
  59. package/src/components/Toolbar/Toolbar.jsx +1 -1
  60. package/src/components/Toolbar/ToolbarGroup.jsx +1 -1
  61. package/src/components/Toolbar/ToolbarItem.jsx +1 -1
  62. package/src/components/_helpers/resolveContextOrProp.js +6 -3
  63. package/src/index.js +3 -2
  64. package/src/providers/globalProps/GlobalPropsContext.jsx +5 -0
  65. package/src/providers/globalProps/GlobalPropsProvider.jsx +33 -0
  66. package/src/providers/globalProps/index.js +3 -0
  67. package/src/{provider → providers/globalProps}/withGlobalProps.jsx +16 -16
  68. package/src/providers/translations/TranslationsContext.jsx +6 -0
  69. package/src/providers/translations/TranslationsProvider.jsx +33 -0
  70. package/src/providers/translations/index.js +2 -0
  71. package/src/styles/elements/_links.scss +7 -2
  72. package/src/styles/theme/_form-fields.scss +19 -0
  73. package/src/styles/theme/_links.scss +4 -3
  74. package/src/styles/tools/_collections.scss +79 -5
  75. package/src/styles/tools/form-fields/_foundation.scss +6 -4
  76. package/src/styles/tools/form-fields/_variants.scss +5 -1
  77. package/src/theme.scss +2 -1
  78. package/src/provider/RUIContext.jsx +0 -9
  79. package/src/provider/RUIProvider.jsx +0 -42
  80. package/src/provider/index.js +0 -3
@@ -51,7 +51,8 @@
51
51
  --rui-font-size-6: 1.802rem;
52
52
  --rui-line-height-base: 1.5;
53
53
  --rui-line-height-small: 1.25;
54
- --rui-text-decoration-link: none;
54
+ --rui-underline-offset-link: 0.1875em;
55
+ --rui-text-decoration-link: underline;
55
56
  --rui-text-decoration-link-hover: underline;
56
57
  --rui-text-decoration-link-active: underline;
57
58
  --rui-list-style-unordered: square;
@@ -1096,12 +1097,18 @@
1096
1097
  a {
1097
1098
  -webkit-text-decoration: var(--rui-text-decoration-link);
1098
1099
  text-decoration: var(--rui-text-decoration-link);
1099
- color: var(--rui-color-text-link);
1100
+ text-underline-offset: var(--rui-underline-offset-link);
1101
+ color: var(--rui-local-link-color, var(--rui-color-text-link));
1100
1102
  }
1101
- a:hover, a:focus {
1103
+ a:hover {
1102
1104
  -webkit-text-decoration: var(--rui-text-decoration-link-hover);
1103
1105
  text-decoration: var(--rui-text-decoration-link-hover);
1104
- color: var(--rui-color-text-link-hover);
1106
+ color: var(--rui-local-link-color-hover, var(--rui-color-text-link-hover));
1107
+ }
1108
+ a:active {
1109
+ -webkit-text-decoration: var(--rui-text-decoration-link-active);
1110
+ text-decoration: var(--rui-text-decoration-link-active);
1111
+ color: var(--rui-local-link-color-active, var(--rui-color-text-link-active));
1105
1112
  }
1106
1113
  ol,
1107
1114
  ul {
@@ -3447,8 +3454,8 @@
3447
3454
  .Alert-module__message__oZQVuqmd {
3448
3455
  padding: var(--rui-Alert__padding);
3449
3456
  }
3450
- .Alert-module__close__zxS8ZLxY,
3451
- .Alert-module__icon__THa5zFHI {
3457
+ .Alert-module__icon__THa5zFHI,
3458
+ .Alert-module__close__zxS8ZLxY {
3452
3459
  height: calc(var(--rui-font-size-1) * var(--rui-line-height-base) + 2 * var(--rui-Alert__padding));
3453
3460
  color: var(--rui-local-foreground-color);
3454
3461
  }
@@ -3465,7 +3472,6 @@
3465
3472
  font-size: var(--rui-font-size-1);
3466
3473
  line-height: var(--rui-line-height-base);
3467
3474
  }
3468
- .Alert-module__message__oZQVuqmd a,
3469
3475
  .Alert-module__message__oZQVuqmd strong {
3470
3476
  font-weight: var(--rui-Alert__emphasis__font-weight);
3471
3477
  color: var(--rui-local-foreground-color);
@@ -3516,6 +3522,9 @@
3516
3522
  --rui-Alert--success__background-color
3517
3523
 
3518
3524
  );
3525
+ --rui-local-link-color: var(--rui-color-feedback-success);
3526
+ --rui-local-link-color-hover: var(--rui-color-feedback-success-hover);
3527
+ --rui-local-link-color-active: var(--rui-color-feedback-success-active);
3519
3528
  }
3520
3529
  .Alert-module__isRootColorWarning__Tv1F5qUb {
3521
3530
  --rui-local-color:
@@ -3533,6 +3542,9 @@
3533
3542
  --rui-Alert--warning__background-color
3534
3543
 
3535
3544
  );
3545
+ --rui-local-link-color: var(--rui-color-feedback-warning);
3546
+ --rui-local-link-color-hover: var(--rui-color-feedback-warning-hover);
3547
+ --rui-local-link-color-active: var(--rui-color-feedback-warning-active);
3536
3548
  }
3537
3549
  .Alert-module__isRootColorDanger__vSuahf3N {
3538
3550
  --rui-local-color:
@@ -3550,6 +3562,9 @@
3550
3562
  --rui-Alert--danger__background-color
3551
3563
 
3552
3564
  );
3565
+ --rui-local-link-color: var(--rui-color-feedback-danger);
3566
+ --rui-local-link-color-hover: var(--rui-color-feedback-danger-hover);
3567
+ --rui-local-link-color-active: var(--rui-color-feedback-danger-active);
3553
3568
  }
3554
3569
  .Alert-module__isRootColorInfo__CydUTawd {
3555
3570
  --rui-local-color:
@@ -3567,6 +3582,9 @@
3567
3582
  --rui-Alert--info__background-color
3568
3583
 
3569
3584
  );
3585
+ --rui-local-link-color: var(--rui-color-feedback-info);
3586
+ --rui-local-link-color-hover: var(--rui-color-feedback-info-hover);
3587
+ --rui-local-link-color-active: var(--rui-color-feedback-info-active);
3570
3588
  }
3571
3589
  .Alert-module__isRootColorHelp__ftSYT6_4 {
3572
3590
  --rui-local-color:
@@ -3584,6 +3602,9 @@
3584
3602
  --rui-Alert--help__background-color
3585
3603
 
3586
3604
  );
3605
+ --rui-local-link-color: var(--rui-color-feedback-help);
3606
+ --rui-local-link-color-hover: var(--rui-color-feedback-help-hover);
3607
+ --rui-local-link-color-active: var(--rui-color-feedback-help-active);
3587
3608
  }
3588
3609
  .Alert-module__isRootColorNote__tl_nYMy0 {
3589
3610
  --rui-local-color:
@@ -3601,6 +3622,9 @@
3601
3622
  --rui-Alert--note__background-color
3602
3623
 
3603
3624
  );
3625
+ --rui-local-link-color: var(--rui-color-feedback-note);
3626
+ --rui-local-link-color-hover: var(--rui-color-feedback-note-hover);
3627
+ --rui-local-link-color-active: var(--rui-color-feedback-note-active);
3604
3628
  }
3605
3629
  .Alert-module__isRootColorLight__LBWCo24o {
3606
3630
  --rui-local-color:
@@ -3618,6 +3642,9 @@
3618
3642
  --rui-Alert--light__background-color
3619
3643
 
3620
3644
  );
3645
+ --rui-local-link-color: var(--rui-color-neutral-dark);
3646
+ --rui-local-link-color-hover: var(--rui-color-neutral-dark-hover);
3647
+ --rui-local-link-color-active: var(--rui-color-neutral-dark-active);
3621
3648
  }
3622
3649
  .Alert-module__isRootColorDark__ro4AYKc8 {
3623
3650
  --rui-local-color:
@@ -3635,6 +3662,9 @@
3635
3662
  --rui-Alert--dark__background-color
3636
3663
 
3637
3664
  );
3665
+ --rui-local-link-color: var(--rui-color-neutral-light);
3666
+ --rui-local-link-color-hover: var(--rui-color-neutral-light-hover);
3667
+ --rui-local-link-color-active: var(--rui-color-neutral-light-active);
3638
3668
  }
3639
3669
  }
3640
3670
  /*!***********************************************************************************************************************************************************************************************************************************!*\
@@ -6374,6 +6404,10 @@
6374
6404
  .Card-module__isRootRaised__mrD5KMAs {
6375
6405
  box-shadow: var(--rui-Card--raised__box-shadow);
6376
6406
  }
6407
+ .Card-module__isRootDisabled__Wm_9A4kS {
6408
+ background-color: var(--rui-Card--disabled__background-color);
6409
+ opacity: var(--rui-Card--disabled__opacity);
6410
+ }
6377
6411
  .Card-module__isRootColorSuccess__yi_tFR5R {
6378
6412
  --rui-local-color:
6379
6413
  var(
@@ -6390,6 +6424,9 @@
6390
6424
  --rui-Card--success__background-color
6391
6425
 
6392
6426
  );
6427
+ --rui-local-link-color: var(--rui-color-feedback-success);
6428
+ --rui-local-link-color-hover: var(--rui-color-feedback-success-hover);
6429
+ --rui-local-link-color-active: var(--rui-color-feedback-success-active);
6393
6430
  }
6394
6431
  .Card-module__isRootColorWarning__Dqf8jQFM {
6395
6432
  --rui-local-color:
@@ -6407,6 +6444,9 @@
6407
6444
  --rui-Card--warning__background-color
6408
6445
 
6409
6446
  );
6447
+ --rui-local-link-color: var(--rui-color-feedback-warning);
6448
+ --rui-local-link-color-hover: var(--rui-color-feedback-warning-hover);
6449
+ --rui-local-link-color-active: var(--rui-color-feedback-warning-active);
6410
6450
  }
6411
6451
  .Card-module__isRootColorDanger__NJZCO0YY {
6412
6452
  --rui-local-color:
@@ -6424,6 +6464,9 @@
6424
6464
  --rui-Card--danger__background-color
6425
6465
 
6426
6466
  );
6467
+ --rui-local-link-color: var(--rui-color-feedback-danger);
6468
+ --rui-local-link-color-hover: var(--rui-color-feedback-danger-hover);
6469
+ --rui-local-link-color-active: var(--rui-color-feedback-danger-active);
6427
6470
  }
6428
6471
  .Card-module__isRootColorInfo__xdYwYAWt {
6429
6472
  --rui-local-color:
@@ -6441,6 +6484,9 @@
6441
6484
  --rui-Card--info__background-color
6442
6485
 
6443
6486
  );
6487
+ --rui-local-link-color: var(--rui-color-feedback-info);
6488
+ --rui-local-link-color-hover: var(--rui-color-feedback-info-hover);
6489
+ --rui-local-link-color-active: var(--rui-color-feedback-info-active);
6444
6490
  }
6445
6491
  .Card-module__isRootColorHelp__lc5Omloh {
6446
6492
  --rui-local-color:
@@ -6458,6 +6504,9 @@
6458
6504
  --rui-Card--help__background-color
6459
6505
 
6460
6506
  );
6507
+ --rui-local-link-color: var(--rui-color-feedback-help);
6508
+ --rui-local-link-color-hover: var(--rui-color-feedback-help-hover);
6509
+ --rui-local-link-color-active: var(--rui-color-feedback-help-active);
6461
6510
  }
6462
6511
  .Card-module__isRootColorNote__Jd0fjU8q {
6463
6512
  --rui-local-color:
@@ -6475,6 +6524,9 @@
6475
6524
  --rui-Card--note__background-color
6476
6525
 
6477
6526
  );
6527
+ --rui-local-link-color: var(--rui-color-feedback-note);
6528
+ --rui-local-link-color-hover: var(--rui-color-feedback-note-hover);
6529
+ --rui-local-link-color-active: var(--rui-color-feedback-note-active);
6478
6530
  }
6479
6531
  .Card-module__isRootColorLight__iCf72IJr {
6480
6532
  --rui-local-color:
@@ -6492,6 +6544,9 @@
6492
6544
  --rui-Card--light__background-color
6493
6545
 
6494
6546
  );
6547
+ --rui-local-link-color: var(--rui-color-neutral-dark);
6548
+ --rui-local-link-color-hover: var(--rui-color-neutral-dark-hover);
6549
+ --rui-local-link-color-active: var(--rui-color-neutral-dark-active);
6495
6550
  }
6496
6551
  .Card-module__isRootColorDark__qqlYTf5V {
6497
6552
  --rui-local-color:
@@ -6509,10 +6564,9 @@
6509
6564
  --rui-Card--dark__background-color
6510
6565
 
6511
6566
  );
6512
- }
6513
- .Card-module__isRootDisabled__Wm_9A4kS {
6514
- background-color: var(--rui-Card--disabled__background-color);
6515
- opacity: var(--rui-Card--disabled__opacity);
6567
+ --rui-local-link-color: var(--rui-color-neutral-light);
6568
+ --rui-local-link-color-hover: var(--rui-color-neutral-light-hover);
6569
+ --rui-local-link-color-active: var(--rui-color-neutral-light-active);
6516
6570
  }
6517
6571
  }
6518
6572
  /*!*********************************************************************************************************************************************************************************************************************************************!*\
@@ -6643,6 +6697,11 @@
6643
6697
  content: var(--rui-FormField--required__sign);
6644
6698
  color: var(--rui-FormField--required__sign__color);
6645
6699
  }
6700
+ .FormLayoutCustomField-module__isRootStateInvalid__OhuSVPjE {
6701
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
6702
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
6703
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
6704
+ }
6646
6705
  .FormLayoutCustomField-module__isRootStateInvalid__OhuSVPjE, .FormLayoutCustomField-module__isRootStateInvalid__OhuSVPjE:hover {
6647
6706
  --rui-local-color: var(--rui-FormField--invalid--default__color);
6648
6707
  --rui-local-border-color: var(--rui-FormField--invalid--default__border-color);
@@ -6707,6 +6766,11 @@
6707
6766
  var(--rui-FormField--invalid--checked__check-background-color)
6708
6767
  );
6709
6768
  }
6769
+ .FormLayoutCustomField-module__isRootStateValid__ROOaFW0P {
6770
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
6771
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
6772
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
6773
+ }
6710
6774
  .FormLayoutCustomField-module__isRootStateValid__ROOaFW0P, .FormLayoutCustomField-module__isRootStateValid__ROOaFW0P:hover {
6711
6775
  --rui-local-color: var(--rui-FormField--valid--default__color);
6712
6776
  --rui-local-border-color: var(--rui-FormField--valid--default__border-color);
@@ -6771,6 +6835,11 @@
6771
6835
  var(--rui-FormField--valid--checked__check-background-color)
6772
6836
  );
6773
6837
  }
6838
+ .FormLayoutCustomField-module__isRootStateWarning__HG_NKMXd {
6839
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
6840
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
6841
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
6842
+ }
6774
6843
  .FormLayoutCustomField-module__isRootStateWarning__HG_NKMXd, .FormLayoutCustomField-module__isRootStateWarning__HG_NKMXd:hover {
6775
6844
  --rui-local-color: var(--rui-FormField--warning--default__color);
6776
6845
  --rui-local-border-color: var(--rui-FormField--warning--default__border-color);
@@ -7098,6 +7167,11 @@
7098
7167
  content: var(--rui-FormField--required__sign);
7099
7168
  color: var(--rui-FormField--required__sign__color);
7100
7169
  }
7170
+ .CheckboxField-module__isRootStateInvalid__vPPd19_Y {
7171
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
7172
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
7173
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
7174
+ }
7101
7175
  .CheckboxField-module__isRootStateInvalid__vPPd19_Y, .CheckboxField-module__isRootStateInvalid__vPPd19_Y:hover {
7102
7176
  --rui-local-color: var(--rui-FormField--invalid--default__color);
7103
7177
  --rui-local-border-color: var(--rui-FormField--invalid--default__border-color);
@@ -7162,6 +7236,11 @@
7162
7236
  var(--rui-FormField--invalid--checked__check-background-color)
7163
7237
  );
7164
7238
  }
7239
+ .CheckboxField-module__isRootStateValid__r8FOGTne {
7240
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
7241
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
7242
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
7243
+ }
7165
7244
  .CheckboxField-module__isRootStateValid__r8FOGTne, .CheckboxField-module__isRootStateValid__r8FOGTne:hover {
7166
7245
  --rui-local-color: var(--rui-FormField--valid--default__color);
7167
7246
  --rui-local-border-color: var(--rui-FormField--valid--default__border-color);
@@ -7226,6 +7305,11 @@
7226
7305
  var(--rui-FormField--valid--checked__check-background-color)
7227
7306
  );
7228
7307
  }
7308
+ .CheckboxField-module__isRootStateWarning__evYzQZrD {
7309
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
7310
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
7311
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
7312
+ }
7229
7313
  .CheckboxField-module__isRootStateWarning__evYzQZrD, .CheckboxField-module__isRootStateWarning__evYzQZrD:hover {
7230
7314
  --rui-local-color: var(--rui-FormField--warning--default__color);
7231
7315
  --rui-local-border-color: var(--rui-FormField--warning--default__border-color);
@@ -7382,6 +7466,11 @@
7382
7466
  content: var(--rui-FormField--required__sign);
7383
7467
  color: var(--rui-FormField--required__sign__color);
7384
7468
  }
7469
+ .FileInputField-module__isRootStateInvalid__qpLo9mVU {
7470
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
7471
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
7472
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
7473
+ }
7385
7474
  .FileInputField-module__isRootStateInvalid__qpLo9mVU, .FileInputField-module__isRootStateInvalid__qpLo9mVU:hover {
7386
7475
  --rui-local-color: var(--rui-FormField--invalid--default__color);
7387
7476
  --rui-local-border-color: var(--rui-FormField--invalid--default__border-color);
@@ -7446,6 +7535,11 @@
7446
7535
  var(--rui-FormField--invalid--checked__check-background-color)
7447
7536
  );
7448
7537
  }
7538
+ .FileInputField-module__isRootStateValid__kd8G0bYh {
7539
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
7540
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
7541
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
7542
+ }
7449
7543
  .FileInputField-module__isRootStateValid__kd8G0bYh, .FileInputField-module__isRootStateValid__kd8G0bYh:hover {
7450
7544
  --rui-local-color: var(--rui-FormField--valid--default__color);
7451
7545
  --rui-local-border-color: var(--rui-FormField--valid--default__border-color);
@@ -7510,6 +7604,11 @@
7510
7604
  var(--rui-FormField--valid--checked__check-background-color)
7511
7605
  );
7512
7606
  }
7607
+ .FileInputField-module__isRootStateWarning__jnC_TrpN {
7608
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
7609
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
7610
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
7611
+ }
7513
7612
  .FileInputField-module__isRootStateWarning__jnC_TrpN, .FileInputField-module__isRootStateWarning__jnC_TrpN:hover {
7514
7613
  --rui-local-color: var(--rui-FormField--warning--default__color);
7515
7614
  --rui-local-border-color: var(--rui-FormField--warning--default__border-color);
@@ -8234,6 +8333,11 @@
8234
8333
  content: var(--rui-FormField--required__sign);
8235
8334
  color: var(--rui-FormField--required__sign__color);
8236
8335
  }
8336
+ .InputGroup-module__isRootStateInvalid__Atu0FWW_ {
8337
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
8338
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
8339
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
8340
+ }
8237
8341
  .InputGroup-module__isRootStateInvalid__Atu0FWW_, .InputGroup-module__isRootStateInvalid__Atu0FWW_:hover {
8238
8342
  --rui-local-color: var(--rui-FormField--invalid--default__color);
8239
8343
  --rui-local-border-color: var(--rui-FormField--invalid--default__border-color);
@@ -8298,6 +8402,11 @@
8298
8402
  var(--rui-FormField--invalid--checked__check-background-color)
8299
8403
  );
8300
8404
  }
8405
+ .InputGroup-module__isRootStateValid__ykb1SzPU {
8406
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
8407
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
8408
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
8409
+ }
8301
8410
  .InputGroup-module__isRootStateValid__ykb1SzPU, .InputGroup-module__isRootStateValid__ykb1SzPU:hover {
8302
8411
  --rui-local-color: var(--rui-FormField--valid--default__color);
8303
8412
  --rui-local-border-color: var(--rui-FormField--valid--default__border-color);
@@ -8362,6 +8471,11 @@
8362
8471
  var(--rui-FormField--valid--checked__check-background-color)
8363
8472
  );
8364
8473
  }
8474
+ .InputGroup-module__isRootStateWarning__wK1Lp0ri {
8475
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
8476
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
8477
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
8478
+ }
8365
8479
  .InputGroup-module__isRootStateWarning__wK1Lp0ri, .InputGroup-module__isRootStateWarning__wK1Lp0ri:hover {
8366
8480
  --rui-local-color: var(--rui-FormField--warning--default__color);
8367
8481
  --rui-local-border-color: var(--rui-FormField--warning--default__border-color);
@@ -8432,6 +8546,7 @@
8432
8546
  flex-direction: column;
8433
8547
  min-width: 0;
8434
8548
  max-width: 100%;
8549
+ max-width: none;
8435
8550
  }
8436
8551
  .InputGroup-module__isRootLayoutVertical__Kh7ukFER .InputGroup-module__label__KUZV3N9L,
8437
8552
  .InputGroup-module__isRootLayoutHorizontal__E9aM__PG .InputGroup-module__label__KUZV3N9L {
@@ -8779,6 +8894,24 @@
8779
8894
  border-width: calc((1rem + 2px) / 2) calc((1rem + 2px) / 2) 0;
8780
8895
  border-top-color: var(--rui-Popover__background-color);
8781
8896
  }
8897
+ .Popover-module__controlledPopover__bAdOI7sf {
8898
+ display: none;
8899
+ }
8900
+ .Popover-module__helper__qu_fiEGq {
8901
+ position: fixed;
8902
+ inset: unset;
8903
+ top: 0;
8904
+ right: 0;
8905
+ width: auto;
8906
+ height: auto;
8907
+ padding: 0;
8908
+ border: none;
8909
+ background: transparent;
8910
+ pointer-events: none;
8911
+ }
8912
+ .Popover-module__helper__qu_fiEGq:popover-open ~ .Popover-module__controlledPopover__bAdOI7sf {
8913
+ display: block;
8914
+ }
8782
8915
  .Popover-module__isRootAtTop__GHVVe2Fu {
8783
8916
  bottom: calc(100% + 1px - 1px);
8784
8917
  }
@@ -9098,6 +9231,14 @@
9098
9231
  content: var(--rui-FormField--required__sign);
9099
9232
  color: var(--rui-FormField--required__sign__color);
9100
9233
  }
9234
+ .Radio-module__isRootRequired__pIsCmVdz .Radio-module__optionLabel__D7ODZEbC {
9235
+ color: var(--rui-local-surrounding-text-color, var(--rui-FormField--required__label__color));
9236
+ }
9237
+ .Radio-module__isRootStateInvalid__zn0zdKi2 {
9238
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
9239
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
9240
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
9241
+ }
9101
9242
  .Radio-module__isRootStateInvalid__zn0zdKi2, .Radio-module__isRootStateInvalid__zn0zdKi2:hover {
9102
9243
  --rui-local-color: var(--rui-FormField--invalid--default__color);
9103
9244
  --rui-local-border-color: var(--rui-FormField--invalid--default__border-color);
@@ -9162,6 +9303,11 @@
9162
9303
  var(--rui-FormField--invalid--checked__check-background-color)
9163
9304
  );
9164
9305
  }
9306
+ .Radio-module__isRootStateValid__uliUzaIp {
9307
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
9308
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
9309
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
9310
+ }
9165
9311
  .Radio-module__isRootStateValid__uliUzaIp, .Radio-module__isRootStateValid__uliUzaIp:hover {
9166
9312
  --rui-local-color: var(--rui-FormField--valid--default__color);
9167
9313
  --rui-local-border-color: var(--rui-FormField--valid--default__border-color);
@@ -9226,6 +9372,11 @@
9226
9372
  var(--rui-FormField--valid--checked__check-background-color)
9227
9373
  );
9228
9374
  }
9375
+ .Radio-module__isRootStateWarning__t9RqjOJP {
9376
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
9377
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
9378
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
9379
+ }
9229
9380
  .Radio-module__isRootStateWarning__t9RqjOJP, .Radio-module__isRootStateWarning__t9RqjOJP:hover {
9230
9381
  --rui-local-color: var(--rui-FormField--warning--default__color);
9231
9382
  --rui-local-border-color: var(--rui-FormField--warning--default__border-color);
@@ -9923,6 +10074,11 @@
9923
10074
  opacity: var(--rui-FormField--disabled__opacity);
9924
10075
  cursor: var(--rui-FormField--disabled__cursor);
9925
10076
  }
10077
+ .SelectField-module__isRootStateInvalid__ygifhBAb {
10078
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
10079
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
10080
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
10081
+ }
9926
10082
  .SelectField-module__isRootStateInvalid__ygifhBAb, .SelectField-module__isRootStateInvalid__ygifhBAb:hover {
9927
10083
  --rui-local-color: var(--rui-FormField--invalid--default__color);
9928
10084
  --rui-local-border-color: var(--rui-FormField--invalid--default__border-color);
@@ -9987,6 +10143,11 @@
9987
10143
  var(--rui-FormField--invalid--checked__check-background-color)
9988
10144
  );
9989
10145
  }
10146
+ .SelectField-module__isRootStateValid__LD4mrVeo {
10147
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
10148
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
10149
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
10150
+ }
9990
10151
  .SelectField-module__isRootStateValid__LD4mrVeo, .SelectField-module__isRootStateValid__LD4mrVeo:hover {
9991
10152
  --rui-local-color: var(--rui-FormField--valid--default__color);
9992
10153
  --rui-local-border-color: var(--rui-FormField--valid--default__border-color);
@@ -10051,6 +10212,11 @@
10051
10212
  var(--rui-FormField--valid--checked__check-background-color)
10052
10213
  );
10053
10214
  }
10215
+ .SelectField-module__isRootStateWarning__fE5GNhNK {
10216
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
10217
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
10218
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
10219
+ }
10054
10220
  .SelectField-module__isRootStateWarning__fE5GNhNK, .SelectField-module__isRootStateWarning__fE5GNhNK:hover {
10055
10221
  --rui-local-color: var(--rui-FormField--warning--default__color);
10056
10222
  --rui-local-border-color: var(--rui-FormField--warning--default__border-color);
@@ -10751,6 +10917,11 @@
10751
10917
  opacity: var(--rui-FormField--disabled__opacity);
10752
10918
  cursor: var(--rui-FormField--disabled__cursor);
10753
10919
  }
10920
+ .TextArea-module__isRootStateInvalid__5juQGER0 {
10921
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
10922
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
10923
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
10924
+ }
10754
10925
  .TextArea-module__isRootStateInvalid__5juQGER0, .TextArea-module__isRootStateInvalid__5juQGER0:hover {
10755
10926
  --rui-local-color: var(--rui-FormField--invalid--default__color);
10756
10927
  --rui-local-border-color: var(--rui-FormField--invalid--default__border-color);
@@ -10815,6 +10986,11 @@
10815
10986
  var(--rui-FormField--invalid--checked__check-background-color)
10816
10987
  );
10817
10988
  }
10989
+ .TextArea-module__isRootStateValid__Ih6AFuas {
10990
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
10991
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
10992
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
10993
+ }
10818
10994
  .TextArea-module__isRootStateValid__Ih6AFuas, .TextArea-module__isRootStateValid__Ih6AFuas:hover {
10819
10995
  --rui-local-color: var(--rui-FormField--valid--default__color);
10820
10996
  --rui-local-border-color: var(--rui-FormField--valid--default__border-color);
@@ -10879,6 +11055,11 @@
10879
11055
  var(--rui-FormField--valid--checked__check-background-color)
10880
11056
  );
10881
11057
  }
11058
+ .TextArea-module__isRootStateWarning__T_TCx1R_ {
11059
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
11060
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
11061
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
11062
+ }
10882
11063
  .TextArea-module__isRootStateWarning__T_TCx1R_, .TextArea-module__isRootStateWarning__T_TCx1R_:hover {
10883
11064
  --rui-local-color: var(--rui-FormField--warning--default__color);
10884
11065
  --rui-local-border-color: var(--rui-FormField--warning--default__border-color);
@@ -11372,6 +11553,11 @@
11372
11553
  opacity: var(--rui-FormField--disabled__opacity);
11373
11554
  cursor: var(--rui-FormField--disabled__cursor);
11374
11555
  }
11556
+ .TextField-module__isRootStateInvalid__bxsnTMJY {
11557
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
11558
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
11559
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
11560
+ }
11375
11561
  .TextField-module__isRootStateInvalid__bxsnTMJY, .TextField-module__isRootStateInvalid__bxsnTMJY:hover {
11376
11562
  --rui-local-color: var(--rui-FormField--invalid--default__color);
11377
11563
  --rui-local-border-color: var(--rui-FormField--invalid--default__border-color);
@@ -11436,6 +11622,11 @@
11436
11622
  var(--rui-FormField--invalid--checked__check-background-color)
11437
11623
  );
11438
11624
  }
11625
+ .TextField-module__isRootStateValid__IEIWMvE8 {
11626
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
11627
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
11628
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
11629
+ }
11439
11630
  .TextField-module__isRootStateValid__IEIWMvE8, .TextField-module__isRootStateValid__IEIWMvE8:hover {
11440
11631
  --rui-local-color: var(--rui-FormField--valid--default__color);
11441
11632
  --rui-local-border-color: var(--rui-FormField--valid--default__border-color);
@@ -11500,6 +11691,11 @@
11500
11691
  var(--rui-FormField--valid--checked__check-background-color)
11501
11692
  );
11502
11693
  }
11694
+ .TextField-module__isRootStateWarning__OI5XUWPf {
11695
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
11696
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
11697
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
11698
+ }
11503
11699
  .TextField-module__isRootStateWarning__OI5XUWPf, .TextField-module__isRootStateWarning__OI5XUWPf:hover {
11504
11700
  --rui-local-color: var(--rui-FormField--warning--default__color);
11505
11701
  --rui-local-border-color: var(--rui-FormField--warning--default__border-color);
@@ -11770,17 +11966,17 @@
11770
11966
  .TextLink-module__root__yRDpdHz1 {
11771
11967
  -webkit-text-decoration: var(--rui-TextLink__text-decoration);
11772
11968
  text-decoration: var(--rui-TextLink__text-decoration);
11773
- color: var(--rui-TextLink__color);
11969
+ color: var(--rui-local-link-color, var(--rui-TextLink__color));
11774
11970
  }
11775
11971
  .TextLink-module__root__yRDpdHz1:hover {
11776
11972
  -webkit-text-decoration: var(--rui-TextLink--hover__text-decoration);
11777
11973
  text-decoration: var(--rui-TextLink--hover__text-decoration);
11778
- color: var(--rui-TextLink--hover__color);
11974
+ color: var(--rui-local-link-color-hover, var(--rui-TextLink--hover__color));
11779
11975
  }
11780
11976
  .TextLink-module__root__yRDpdHz1:active {
11781
11977
  -webkit-text-decoration: var(--rui-TextLink--active__text-decoration);
11782
11978
  text-decoration: var(--rui-TextLink--active__text-decoration);
11783
- color: var(--rui-TextLink--active__color);
11979
+ color: var(--rui-local-link-color-active, var(--rui-TextLink--active__color));
11784
11980
  }
11785
11981
  }
11786
11982
  /*!*************************************************************************************************************************************************************************************************************************************!*\
@@ -11965,6 +12161,11 @@
11965
12161
  content: var(--rui-FormField--required__sign);
11966
12162
  color: var(--rui-FormField--required__sign__color);
11967
12163
  }
12164
+ .Toggle-module__isRootStateInvalid__YeydgHoH {
12165
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
12166
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
12167
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
12168
+ }
11968
12169
  .Toggle-module__isRootStateInvalid__YeydgHoH, .Toggle-module__isRootStateInvalid__YeydgHoH:hover {
11969
12170
  --rui-local-color: var(--rui-FormField--invalid--default__color);
11970
12171
  --rui-local-border-color: var(--rui-FormField--invalid--default__border-color);
@@ -12029,6 +12230,11 @@
12029
12230
  var(--rui-FormField--invalid--checked__check-background-color)
12030
12231
  );
12031
12232
  }
12233
+ .Toggle-module__isRootStateValid__YjDzLP2F {
12234
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
12235
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
12236
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
12237
+ }
12032
12238
  .Toggle-module__isRootStateValid__YjDzLP2F, .Toggle-module__isRootStateValid__YjDzLP2F:hover {
12033
12239
  --rui-local-color: var(--rui-FormField--valid--default__color);
12034
12240
  --rui-local-border-color: var(--rui-FormField--valid--default__border-color);
@@ -12093,6 +12299,11 @@
12093
12299
  var(--rui-FormField--valid--checked__check-background-color)
12094
12300
  );
12095
12301
  }
12302
+ .Toggle-module__isRootStateWarning__vhYc4kYJ {
12303
+ --rui-local-link-color: map.get(theme.$link-validation-colors, $variant, default);
12304
+ --rui-local-link-color-hover: map.get(theme.$link-validation-colors, $variant, hover);
12305
+ --rui-local-link-color-active: map.get(theme.$link-validation-colors, $variant, active);
12306
+ }
12096
12307
  .Toggle-module__isRootStateWarning__vhYc4kYJ, .Toggle-module__isRootStateWarning__vhYc4kYJ:hover {
12097
12308
  --rui-local-color: var(--rui-FormField--warning--default__color);
12098
12309
  --rui-local-border-color: var(--rui-FormField--warning--default__border-color);