@aws-amplify/ui-react 6.15.4 → 6.15.6

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 (30) hide show
  1. package/dist/esm/PrimitiveCatalog.mjs +18 -12
  2. package/dist/esm/version.mjs +1 -1
  3. package/dist/index.js +1 -1
  4. package/dist/internal.js +18 -12
  5. package/dist/styles/base.css +4 -4
  6. package/dist/styles/base.layer.css +4 -4
  7. package/dist/styles/button.css +58 -50
  8. package/dist/styles/button.layer.css +58 -50
  9. package/dist/styles/checkbox.css +3 -3
  10. package/dist/styles/checkbox.layer.css +3 -3
  11. package/dist/styles/fieldset.css +3 -1
  12. package/dist/styles/fieldset.layer.css +3 -1
  13. package/dist/styles/input.css +18 -16
  14. package/dist/styles/input.layer.css +18 -16
  15. package/dist/styles/loader.css +4 -2
  16. package/dist/styles/loader.layer.css +4 -2
  17. package/dist/styles/select.css +7 -5
  18. package/dist/styles/select.layer.css +7 -5
  19. package/dist/styles/stepperField.css +4 -4
  20. package/dist/styles/stepperField.layer.css +4 -4
  21. package/dist/styles/table.css +5 -3
  22. package/dist/styles/table.layer.css +5 -3
  23. package/dist/styles/textArea.css +7 -5
  24. package/dist/styles/textArea.layer.css +7 -5
  25. package/dist/styles/toggleButton.css +31 -21
  26. package/dist/styles/toggleButton.layer.css +31 -21
  27. package/dist/styles.css +144 -114
  28. package/dist/styles.layer.css +144 -114
  29. package/dist/types/version.d.ts +1 -1
  30. package/package.json +6 -4
package/dist/esm/PrimitiveCatalog.mjs CHANGED
@@ -7713,13 +7713,13 @@ const PrimitiveCatalog = {
7713
7713
  "top": {
7714
7714
  "type": "string"
7715
7715
  },
7716
- "row": {
7716
+ "wrap": {
7717
7717
  "type": "string"
7718
7718
  },
7719
- "column": {
7719
+ "row": {
7720
7720
  "type": "string"
7721
7721
  },
7722
- "wrap": {
7722
+ "column": {
7723
7723
  "type": "string"
7724
7724
  },
7725
7725
  "ariaLabel": {
@@ -8005,13 +8005,13 @@ const PrimitiveCatalog = {
8005
8005
  "top": {
8006
8006
  "type": "string"
8007
8007
  },
8008
- "row": {
8008
+ "wrap": {
8009
8009
  "type": "string"
8010
8010
  },
8011
- "column": {
8011
+ "row": {
8012
8012
  "type": "string"
8013
8013
  },
8014
- "wrap": {
8014
+ "column": {
8015
8015
  "type": "string"
8016
8016
  },
8017
8017
  "ariaLabel": {
@@ -9217,13 +9217,13 @@ const PrimitiveCatalog = {
9217
9217
  "top": {
9218
9218
  "type": "string"
9219
9219
  },
9220
- "row": {
9220
+ "wrap": {
9221
9221
  "type": "string"
9222
9222
  },
9223
- "column": {
9223
+ "row": {
9224
9224
  "type": "string"
9225
9225
  },
9226
- "wrap": {
9226
+ "column": {
9227
9227
  "type": "string"
9228
9228
  },
9229
9229
  "ariaLabel": {
@@ -9704,6 +9704,12 @@ const PrimitiveCatalog = {
9704
9704
  "is": {
9705
9705
  "type": "string"
9706
9706
  },
9707
+ "exportparts": {
9708
+ "type": "string"
9709
+ },
9710
+ "part": {
9711
+ "type": "string"
9712
+ },
9707
9713
  "aria-activedescendant": {
9708
9714
  "type": "string"
9709
9715
  },
@@ -14324,13 +14330,13 @@ const PrimitiveCatalog = {
14324
14330
  "top": {
14325
14331
  "type": "string"
14326
14332
  },
14327
- "row": {
14333
+ "wrap": {
14328
14334
  "type": "string"
14329
14335
  },
14330
- "column": {
14336
+ "row": {
14331
14337
  "type": "string"
14332
14338
  },
14333
- "wrap": {
14339
+ "column": {
14334
14340
  "type": "string"
14335
14341
  },
14336
14342
  "ariaLabel": {
package/dist/esm/version.mjs CHANGED
@@ -1,3 +1,3 @@
1
- const VERSION = '6.15.4';
1
+ const VERSION = '6.15.6';
2
2
 
3
3
  export { VERSION };
package/dist/index.js CHANGED
@@ -2463,7 +2463,7 @@ const defaultDeleteUserDisplayText = {
2463
2463
  warningText: 'Deleting your account is not reversible. You will lose access to your account and all data associated with it.',
2464
2464
  };
2465
2465
 
2466
- const VERSION = '6.15.4';
2466
+ const VERSION = '6.15.6';
2467
2467
 
2468
2468
  const logger$2 = ui.getLogger('AccountSettings');
2469
2469
  const getIsDisabled = (formValues, validationError) => {
package/dist/internal.js CHANGED
@@ -7964,13 +7964,13 @@ const PrimitiveCatalog = {
7964
7964
  "top": {
7965
7965
  "type": "string"
7966
7966
  },
7967
- "row": {
7967
+ "wrap": {
7968
7968
  "type": "string"
7969
7969
  },
7970
- "column": {
7970
+ "row": {
7971
7971
  "type": "string"
7972
7972
  },
7973
- "wrap": {
7973
+ "column": {
7974
7974
  "type": "string"
7975
7975
  },
7976
7976
  "ariaLabel": {
@@ -8256,13 +8256,13 @@ const PrimitiveCatalog = {
8256
8256
  "top": {
8257
8257
  "type": "string"
8258
8258
  },
8259
- "row": {
8259
+ "wrap": {
8260
8260
  "type": "string"
8261
8261
  },
8262
- "column": {
8262
+ "row": {
8263
8263
  "type": "string"
8264
8264
  },
8265
- "wrap": {
8265
+ "column": {
8266
8266
  "type": "string"
8267
8267
  },
8268
8268
  "ariaLabel": {
@@ -9468,13 +9468,13 @@ const PrimitiveCatalog = {
9468
9468
  "top": {
9469
9469
  "type": "string"
9470
9470
  },
9471
- "row": {
9471
+ "wrap": {
9472
9472
  "type": "string"
9473
9473
  },
9474
- "column": {
9474
+ "row": {
9475
9475
  "type": "string"
9476
9476
  },
9477
- "wrap": {
9477
+ "column": {
9478
9478
  "type": "string"
9479
9479
  },
9480
9480
  "ariaLabel": {
@@ -9955,6 +9955,12 @@ const PrimitiveCatalog = {
9955
9955
  "is": {
9956
9956
  "type": "string"
9957
9957
  },
9958
+ "exportparts": {
9959
+ "type": "string"
9960
+ },
9961
+ "part": {
9962
+ "type": "string"
9963
+ },
9958
9964
  "aria-activedescendant": {
9959
9965
  "type": "string"
9960
9966
  },
@@ -14575,13 +14581,13 @@ const PrimitiveCatalog = {
14575
14581
  "top": {
14576
14582
  "type": "string"
14577
14583
  },
14578
- "row": {
14584
+ "wrap": {
14579
14585
  "type": "string"
14580
14586
  },
14581
- "column": {
14587
+ "row": {
14582
14588
  "type": "string"
14583
14589
  },
14584
- "wrap": {
14590
+ "column": {
14585
14591
  "type": "string"
14586
14592
  },
14587
14593
  "ariaLabel": {
package/dist/styles/base.css CHANGED
@@ -1512,11 +1512,11 @@
1512
1512
  --amplify-colors-black: hsl(0, 0%, 0%);
1513
1513
  --amplify-colors-white: hsl(0, 0%, 100%);
1514
1514
  --amplify-colors-transparent: transparent;
1515
- --amplify-fonts-default-variable: "InterVariable", "Inter var", "Inter", -apple-system, BlinkMacSystemFont,
1516
- "Helvetica Neue", "Segoe UI", Oxygen, Ubuntu, Cantarell, "Open Sans",
1515
+ --amplify-fonts-default-variable: 'InterVariable', 'Inter var', 'Inter', -apple-system, BlinkMacSystemFont,
1516
+ 'Helvetica Neue', 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans',
1517
1517
  sans-serif;
1518
- --amplify-fonts-default-static: "Inter", -apple-system, BlinkMacSystemFont, "Helvetica Neue",
1519
- "Segoe UI", Oxygen, Ubuntu, Cantarell, "Open Sans", sans-serif;
1518
+ --amplify-fonts-default-static: 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue',
1519
+ 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', sans-serif;
1520
1520
  --amplify-font-sizes-xxxs: 0.375rem;
1521
1521
  --amplify-font-sizes-xxs: 0.5rem;
1522
1522
  --amplify-font-sizes-xs: 0.75rem;
package/dist/styles/base.layer.css CHANGED
@@ -1513,11 +1513,11 @@
1513
1513
  --amplify-colors-black: hsl(0, 0%, 0%);
1514
1514
  --amplify-colors-white: hsl(0, 0%, 100%);
1515
1515
  --amplify-colors-transparent: transparent;
1516
- --amplify-fonts-default-variable: "InterVariable", "Inter var", "Inter", -apple-system, BlinkMacSystemFont,
1517
- "Helvetica Neue", "Segoe UI", Oxygen, Ubuntu, Cantarell, "Open Sans",
1516
+ --amplify-fonts-default-variable: 'InterVariable', 'Inter var', 'Inter', -apple-system, BlinkMacSystemFont,
1517
+ 'Helvetica Neue', 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans',
1518
1518
  sans-serif;
1519
- --amplify-fonts-default-static: "Inter", -apple-system, BlinkMacSystemFont, "Helvetica Neue",
1520
- "Segoe UI", Oxygen, Ubuntu, Cantarell, "Open Sans", sans-serif;
1519
+ --amplify-fonts-default-static: 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue',
1520
+ 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', sans-serif;
1521
1521
  --amplify-font-sizes-xxxs: 0.375rem;
1522
1522
  --amplify-font-sizes-xxs: 0.5rem;
1523
1523
  --amplify-font-sizes-xs: 0.75rem;
package/dist/styles/button.css CHANGED
@@ -334,9 +334,6 @@
334
334
  border-width: var(--amplify-components-button-menu-border-width);
335
335
  background-color: var(--amplify-components-button-menu-background-color);
336
336
  justify-content: var(--amplify-components-button-menu-justify-content);
337
- --amplify-internal-button-disabled-color: var(
338
- --amplify-components-button-menu-disabled-color
339
- );
340
337
  }
341
338
  .amplify-button--menu:hover {
342
339
  color: var(--amplify-components-button-menu-hover-color);
@@ -351,6 +348,11 @@
351
348
  color: var(--amplify-components-button-menu-active-color);
352
349
  background-color: var(--amplify-components-button-menu-active-background-color);
353
350
  }
351
+ .amplify-button--menu {
352
+ --amplify-internal-button-disabled-color: var(
353
+ --amplify-components-button-menu-disabled-color
354
+ );
355
+ }
354
356
  .amplify-button--primary {
355
357
  --amplify-internal-button-border-width: var(
356
358
  --amplify-components-button-primary-border-width
@@ -364,24 +366,6 @@
364
366
  --amplify-internal-button-color: var(
365
367
  --amplify-components-button-primary-color
366
368
  );
367
- --amplify-internal-button-disabled-border-color: var(
368
- --amplify-components-button-primary-disabled-border-color
369
- );
370
- --amplify-internal-button-disabled-background-color: var(
371
- --amplify-components-button-primary-disabled-background-color
372
- );
373
- --amplify-internal-button-disabled-color: var(
374
- --amplify-components-button-primary-disabled-color
375
- );
376
- --amplify-internal-button-loading-background-color: var(
377
- --amplify-components-button-primary-loading-background-color
378
- );
379
- --amplify-internal-button-loading-border-color: var(
380
- --amplify-components-button-primary-loading-border-color
381
- );
382
- --amplify-internal-button-loading-color: var(
383
- --amplify-components-button-primary-loading-color
384
- );
385
369
  }
386
370
  .amplify-button--primary:hover {
387
371
  --amplify-internal-button-background-color: var(
@@ -654,6 +638,26 @@
654
638
  --amplify-components-button-primary-overlay-active-color
655
639
  );
656
640
  }
641
+ .amplify-button--primary {
642
+ --amplify-internal-button-disabled-border-color: var(
643
+ --amplify-components-button-primary-disabled-border-color
644
+ );
645
+ --amplify-internal-button-disabled-background-color: var(
646
+ --amplify-components-button-primary-disabled-background-color
647
+ );
648
+ --amplify-internal-button-disabled-color: var(
649
+ --amplify-components-button-primary-disabled-color
650
+ );
651
+ --amplify-internal-button-loading-background-color: var(
652
+ --amplify-components-button-primary-loading-background-color
653
+ );
654
+ --amplify-internal-button-loading-border-color: var(
655
+ --amplify-components-button-primary-loading-border-color
656
+ );
657
+ --amplify-internal-button-loading-color: var(
658
+ --amplify-components-button-primary-loading-color
659
+ );
660
+ }
657
661
  .amplify-button--link {
658
662
  --amplify-internal-button-border-width: var(
659
663
  --amplify-components-button-link-border-width
@@ -667,24 +671,6 @@
667
671
  --amplify-internal-button-color: var(
668
672
  --amplify-components-button-link-color
669
673
  );
670
- --amplify-internal-button-disabled-border-color: var(
671
- --amplify-components-button-link-disabled-border-color
672
- );
673
- --amplify-internal-button-disabled-background-color: var(
674
- --amplify-components-button-link-disabled-background-color
675
- );
676
- --amplify-internal-button-disabled-color: var(
677
- --amplify-components-button-link-disabled-color
678
- );
679
- --amplify-internal-button-loading-background-color: var(
680
- --amplify-components-button-link-loading-background-color
681
- );
682
- --amplify-internal-button-loading-border-color: var(
683
- --amplify-components-button-link-loading-border-color
684
- );
685
- --amplify-internal-button-loading-color: var(
686
- --amplify-components-button-link-loading-color
687
- );
688
674
  }
689
675
  .amplify-button--link:hover {
690
676
  --amplify-internal-button-background-color: var(
@@ -957,30 +943,32 @@
957
943
  --amplify-components-button-link-overlay-active-color
958
944
  );
959
945
  }
960
- .amplify-button--destructive {
961
- border-width: var(--amplify-components-button-destructive-border-width);
962
- background-color: var(--amplify-components-button-destructive-background-color);
963
- border-color: var(--amplify-components-button-destructive-border-color);
964
- color: var(--amplify-components-button-destructive-color);
946
+ .amplify-button--link {
965
947
  --amplify-internal-button-disabled-border-color: var(
966
- --amplify-components-button-destructive-disabled-border-color
948
+ --amplify-components-button-link-disabled-border-color
967
949
  );
968
950
  --amplify-internal-button-disabled-background-color: var(
969
- --amplify-components-button-destructive-disabled-background-color
951
+ --amplify-components-button-link-disabled-background-color
970
952
  );
971
953
  --amplify-internal-button-disabled-color: var(
972
- --amplify-components-button-destructive-disabled-color
954
+ --amplify-components-button-link-disabled-color
973
955
  );
974
956
  --amplify-internal-button-loading-background-color: var(
975
- --amplify-components-button-destructive-loading-background-color
957
+ --amplify-components-button-link-loading-background-color
976
958
  );
977
959
  --amplify-internal-button-loading-border-color: var(
978
- --amplify-components-button-destructive-loading-border-color
960
+ --amplify-components-button-link-loading-border-color
979
961
  );
980
962
  --amplify-internal-button-loading-color: var(
981
- --amplify-components-button-destructive-loading-color
963
+ --amplify-components-button-link-loading-color
982
964
  );
983
965
  }
966
+ .amplify-button--destructive {
967
+ border-width: var(--amplify-components-button-destructive-border-width);
968
+ background-color: var(--amplify-components-button-destructive-background-color);
969
+ border-color: var(--amplify-components-button-destructive-border-color);
970
+ color: var(--amplify-components-button-destructive-color);
971
+ }
984
972
  .amplify-button--destructive:hover {
985
973
  background-color: var(--amplify-components-button-destructive-hover-background-color);
986
974
  border-color: var(--amplify-components-button-destructive-hover-border-color);
@@ -997,6 +985,26 @@
997
985
  border-color: var(--amplify-components-button-destructive-active-border-color);
998
986
  color: var(--amplify-components-button-destructive-active-color);
999
987
  }
988
+ .amplify-button--destructive {
989
+ --amplify-internal-button-disabled-border-color: var(
990
+ --amplify-components-button-destructive-disabled-border-color
991
+ );
992
+ --amplify-internal-button-disabled-background-color: var(
993
+ --amplify-components-button-destructive-disabled-background-color
994
+ );
995
+ --amplify-internal-button-disabled-color: var(
996
+ --amplify-components-button-destructive-disabled-color
997
+ );
998
+ --amplify-internal-button-loading-background-color: var(
999
+ --amplify-components-button-destructive-loading-background-color
1000
+ );
1001
+ --amplify-internal-button-loading-border-color: var(
1002
+ --amplify-components-button-destructive-loading-border-color
1003
+ );
1004
+ --amplify-internal-button-loading-color: var(
1005
+ --amplify-components-button-destructive-loading-color
1006
+ );
1007
+ }
1000
1008
  .amplify-button--warning {
1001
1009
  background-color: var(--amplify-components-button-warning-background-color);
1002
1010
  border-color: var(--amplify-components-button-warning-border-color);
package/dist/styles/button.layer.css CHANGED
@@ -335,9 +335,6 @@
335
335
  border-width: var(--amplify-components-button-menu-border-width);
336
336
  background-color: var(--amplify-components-button-menu-background-color);
337
337
  justify-content: var(--amplify-components-button-menu-justify-content);
338
- --amplify-internal-button-disabled-color: var(
339
- --amplify-components-button-menu-disabled-color
340
- );
341
338
  }
342
339
  .amplify-button--menu:hover {
343
340
  color: var(--amplify-components-button-menu-hover-color);
@@ -352,6 +349,11 @@
352
349
  color: var(--amplify-components-button-menu-active-color);
353
350
  background-color: var(--amplify-components-button-menu-active-background-color);
354
351
  }
352
+ .amplify-button--menu {
353
+ --amplify-internal-button-disabled-color: var(
354
+ --amplify-components-button-menu-disabled-color
355
+ );
356
+ }
355
357
  .amplify-button--primary {
356
358
  --amplify-internal-button-border-width: var(
357
359
  --amplify-components-button-primary-border-width
@@ -365,24 +367,6 @@
365
367
  --amplify-internal-button-color: var(
366
368
  --amplify-components-button-primary-color
367
369
  );
368
- --amplify-internal-button-disabled-border-color: var(
369
- --amplify-components-button-primary-disabled-border-color
370
- );
371
- --amplify-internal-button-disabled-background-color: var(
372
- --amplify-components-button-primary-disabled-background-color
373
- );
374
- --amplify-internal-button-disabled-color: var(
375
- --amplify-components-button-primary-disabled-color
376
- );
377
- --amplify-internal-button-loading-background-color: var(
378
- --amplify-components-button-primary-loading-background-color
379
- );
380
- --amplify-internal-button-loading-border-color: var(
381
- --amplify-components-button-primary-loading-border-color
382
- );
383
- --amplify-internal-button-loading-color: var(
384
- --amplify-components-button-primary-loading-color
385
- );
386
370
  }
387
371
  .amplify-button--primary:hover {
388
372
  --amplify-internal-button-background-color: var(
@@ -655,6 +639,26 @@
655
639
  --amplify-components-button-primary-overlay-active-color
656
640
  );
657
641
  }
642
+ .amplify-button--primary {
643
+ --amplify-internal-button-disabled-border-color: var(
644
+ --amplify-components-button-primary-disabled-border-color
645
+ );
646
+ --amplify-internal-button-disabled-background-color: var(
647
+ --amplify-components-button-primary-disabled-background-color
648
+ );
649
+ --amplify-internal-button-disabled-color: var(
650
+ --amplify-components-button-primary-disabled-color
651
+ );
652
+ --amplify-internal-button-loading-background-color: var(
653
+ --amplify-components-button-primary-loading-background-color
654
+ );
655
+ --amplify-internal-button-loading-border-color: var(
656
+ --amplify-components-button-primary-loading-border-color
657
+ );
658
+ --amplify-internal-button-loading-color: var(
659
+ --amplify-components-button-primary-loading-color
660
+ );
661
+ }
658
662
  .amplify-button--link {
659
663
  --amplify-internal-button-border-width: var(
660
664
  --amplify-components-button-link-border-width
@@ -668,24 +672,6 @@
668
672
  --amplify-internal-button-color: var(
669
673
  --amplify-components-button-link-color
670
674
  );
671
- --amplify-internal-button-disabled-border-color: var(
672
- --amplify-components-button-link-disabled-border-color
673
- );
674
- --amplify-internal-button-disabled-background-color: var(
675
- --amplify-components-button-link-disabled-background-color
676
- );
677
- --amplify-internal-button-disabled-color: var(
678
- --amplify-components-button-link-disabled-color
679
- );
680
- --amplify-internal-button-loading-background-color: var(
681
- --amplify-components-button-link-loading-background-color
682
- );
683
- --amplify-internal-button-loading-border-color: var(
684
- --amplify-components-button-link-loading-border-color
685
- );
686
- --amplify-internal-button-loading-color: var(
687
- --amplify-components-button-link-loading-color
688
- );
689
675
  }
690
676
  .amplify-button--link:hover {
691
677
  --amplify-internal-button-background-color: var(
@@ -958,30 +944,32 @@
958
944
  --amplify-components-button-link-overlay-active-color
959
945
  );
960
946
  }
961
- .amplify-button--destructive {
962
- border-width: var(--amplify-components-button-destructive-border-width);
963
- background-color: var(--amplify-components-button-destructive-background-color);
964
- border-color: var(--amplify-components-button-destructive-border-color);
965
- color: var(--amplify-components-button-destructive-color);
947
+ .amplify-button--link {
966
948
  --amplify-internal-button-disabled-border-color: var(
967
- --amplify-components-button-destructive-disabled-border-color
949
+ --amplify-components-button-link-disabled-border-color
968
950
  );
969
951
  --amplify-internal-button-disabled-background-color: var(
970
- --amplify-components-button-destructive-disabled-background-color
952
+ --amplify-components-button-link-disabled-background-color
971
953
  );
972
954
  --amplify-internal-button-disabled-color: var(
973
- --amplify-components-button-destructive-disabled-color
955
+ --amplify-components-button-link-disabled-color
974
956
  );
975
957
  --amplify-internal-button-loading-background-color: var(
976
- --amplify-components-button-destructive-loading-background-color
958
+ --amplify-components-button-link-loading-background-color
977
959
  );
978
960
  --amplify-internal-button-loading-border-color: var(
979
- --amplify-components-button-destructive-loading-border-color
961
+ --amplify-components-button-link-loading-border-color
980
962
  );
981
963
  --amplify-internal-button-loading-color: var(
982
- --amplify-components-button-destructive-loading-color
964
+ --amplify-components-button-link-loading-color
983
965
  );
984
966
  }
967
+ .amplify-button--destructive {
968
+ border-width: var(--amplify-components-button-destructive-border-width);
969
+ background-color: var(--amplify-components-button-destructive-background-color);
970
+ border-color: var(--amplify-components-button-destructive-border-color);
971
+ color: var(--amplify-components-button-destructive-color);
972
+ }
985
973
  .amplify-button--destructive:hover {
986
974
  background-color: var(--amplify-components-button-destructive-hover-background-color);
987
975
  border-color: var(--amplify-components-button-destructive-hover-border-color);
@@ -998,6 +986,26 @@
998
986
  border-color: var(--amplify-components-button-destructive-active-border-color);
999
987
  color: var(--amplify-components-button-destructive-active-color);
1000
988
  }
989
+ .amplify-button--destructive {
990
+ --amplify-internal-button-disabled-border-color: var(
991
+ --amplify-components-button-destructive-disabled-border-color
992
+ );
993
+ --amplify-internal-button-disabled-background-color: var(
994
+ --amplify-components-button-destructive-disabled-background-color
995
+ );
996
+ --amplify-internal-button-disabled-color: var(
997
+ --amplify-components-button-destructive-disabled-color
998
+ );
999
+ --amplify-internal-button-loading-background-color: var(
1000
+ --amplify-components-button-destructive-loading-background-color
1001
+ );
1002
+ --amplify-internal-button-loading-border-color: var(
1003
+ --amplify-components-button-destructive-loading-border-color
1004
+ );
1005
+ --amplify-internal-button-loading-color: var(
1006
+ --amplify-components-button-destructive-loading-color
1007
+ );
1008
+ }
1001
1009
  .amplify-button--warning {
1002
1010
  background-color: var(--amplify-components-button-warning-background-color);
1003
1011
  border-color: var(--amplify-components-button-warning-border-color);
package/dist/styles/checkbox.css CHANGED
@@ -42,6 +42,9 @@
42
42
  border-color: var(--amplify-internal-checkbox_button-focused-before-border-color);
43
43
  box-shadow: var(--amplify-internal-checkbox_button-focused-before-box-shadow);
44
44
  }
45
+ .amplify-checkbox__button--error::before {
46
+ border-color: var(--amplify-components-checkbox-button-error-border-color);
47
+ }
45
48
  .amplify-checkbox__button--error {
46
49
  --amplify-internal-checkbox_button-focused-before-border-color: var(
47
50
  --amplify-components-checkbox-button-error-focus-border-color
@@ -50,9 +53,6 @@
50
53
  --amplify-components-checkbox-button-error-focus-box-shadow
51
54
  );
52
55
  }
53
- .amplify-checkbox__button--error::before {
54
- border-color: var(--amplify-components-checkbox-button-error-border-color);
55
- }
56
56
  .amplify-checkbox__button--disabled::before {
57
57
  border-color: var(--amplify-components-checkbox-button-disabled-border-color);
58
58
  }
package/dist/styles/checkbox.layer.css CHANGED
@@ -43,6 +43,9 @@
43
43
  border-color: var(--amplify-internal-checkbox_button-focused-before-border-color);
44
44
  box-shadow: var(--amplify-internal-checkbox_button-focused-before-box-shadow);
45
45
  }
46
+ .amplify-checkbox__button--error::before {
47
+ border-color: var(--amplify-components-checkbox-button-error-border-color);
48
+ }
46
49
  .amplify-checkbox__button--error {
47
50
  --amplify-internal-checkbox_button-focused-before-border-color: var(
48
51
  --amplify-components-checkbox-button-error-focus-border-color
@@ -51,9 +54,6 @@
51
54
  --amplify-components-checkbox-button-error-focus-box-shadow
52
55
  );
53
56
  }
54
- .amplify-checkbox__button--error::before {
55
- border-color: var(--amplify-components-checkbox-button-error-border-color);
56
- }
57
57
  .amplify-checkbox__button--disabled::before {
58
58
  border-color: var(--amplify-components-checkbox-button-disabled-border-color);
59
59
  }
package/dist/styles/fieldset.css CHANGED
@@ -4,7 +4,6 @@
4
4
  flex-direction: var(--amplify-components-fieldset-flex-direction);
5
5
  gap: var(--amplify-components-fieldset-gap);
6
6
  /* Sizes */
7
- /* Variations */
8
7
  }
9
8
  .amplify-fieldset--small {
10
9
  gap: var(--amplify-components-fieldset-small-gap);
@@ -12,6 +11,9 @@
12
11
  .amplify-fieldset--large {
13
12
  gap: var(--amplify-components-fieldset-large-gap);
14
13
  }
14
+ .amplify-fieldset {
15
+ /* Variations */
16
+ }
15
17
  .amplify-fieldset--outlined {
16
18
  border: var(--amplify-components-fieldset-outlined-border-width) var(--amplify-components-fieldset-outlined-border-style) var(--amplify-components-fieldset-outlined-border-color);
17
19
  padding: var(--amplify-components-fieldset-outlined-padding);
package/dist/styles/fieldset.layer.css CHANGED
@@ -5,7 +5,6 @@
5
5
  flex-direction: var(--amplify-components-fieldset-flex-direction);
6
6
  gap: var(--amplify-components-fieldset-gap);
7
7
  /* Sizes */
8
- /* Variations */
9
8
  }
10
9
  .amplify-fieldset--small {
11
10
  gap: var(--amplify-components-fieldset-small-gap);
@@ -13,6 +12,9 @@
13
12
  .amplify-fieldset--large {
14
13
  gap: var(--amplify-components-fieldset-large-gap);
15
14
  }
15
+ .amplify-fieldset {
16
+ /* Variations */
17
+ }
16
18
  .amplify-fieldset--outlined {
17
19
  border: var(--amplify-components-fieldset-outlined-border-width) var(--amplify-components-fieldset-outlined-border-style) var(--amplify-components-fieldset-outlined-border-color);
18
20
  padding: var(--amplify-components-fieldset-outlined-padding);
package/dist/styles/input.css CHANGED
@@ -17,22 +17,6 @@
17
17
  outline-style: var(--amplify-components-fieldcontrol-outline-style);
18
18
  outline-width: var(--amplify-components-fieldcontrol-outline-width);
19
19
  outline-offset: var(--amplify-components-fieldcontrol-outline-offset);
20
- -webkit-user-select: text;
21
- -moz-user-select: text;
22
- user-select: text;
23
- display: inline-block;
24
- --amplify-components-fieldcontrol-color: var(
25
- --amplify-components-input-color
26
- );
27
- --amplify-components-fieldcontrol-border-color: var(
28
- --amplify-components-input-border-color
29
- );
30
- --amplify-components-fieldcontrol-font-size: var(
31
- --amplify-components-input-font-size
32
- );
33
- --amplify-components-fieldcontrol-focus-border-color: var(
34
- --amplify-components-input-focus-border-color
35
- );
36
20
  }
37
21
  .amplify-input:focus {
38
22
  border-color: var(--amplify-components-fieldcontrol-focus-border-color);
@@ -81,4 +65,22 @@
81
65
  cursor: var(--amplify-components-fieldcontrol-disabled-cursor);
82
66
  border-color: var(--amplify-components-fieldcontrol-disabled-border-color);
83
67
  background-color: var(--amplify-components-fieldcontrol-disabled-background-color);
68
+ }
69
+ .amplify-input {
70
+ -webkit-user-select: text;
71
+ -moz-user-select: text;
72
+ user-select: text;
73
+ display: inline-block;
74
+ --amplify-components-fieldcontrol-color: var(
75
+ --amplify-components-input-color
76
+ );
77
+ --amplify-components-fieldcontrol-border-color: var(
78
+ --amplify-components-input-border-color
79
+ );
80
+ --amplify-components-fieldcontrol-font-size: var(
81
+ --amplify-components-input-font-size
82
+ );
83
+ --amplify-components-fieldcontrol-focus-border-color: var(
84
+ --amplify-components-input-focus-border-color
85
+ );
84
86
  }