@aws-amplify/ui-react 6.15.3 → 6.15.5
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.
- package/dist/esm/PrimitiveCatalog.mjs +18 -12
- package/dist/esm/components/Authenticator/shared/ConfirmSignInFooter.mjs +8 -2
- package/dist/esm/version.mjs +1 -1
- package/dist/index.js +9 -3
- package/dist/internal.js +18 -12
- package/dist/styles/base.css +4 -4
- package/dist/styles/base.layer.css +4 -4
- package/dist/styles/button.css +58 -50
- package/dist/styles/button.layer.css +58 -50
- package/dist/styles/checkbox.css +3 -3
- package/dist/styles/checkbox.layer.css +3 -3
- package/dist/styles/fieldset.css +3 -1
- package/dist/styles/fieldset.layer.css +3 -1
- package/dist/styles/input.css +18 -16
- package/dist/styles/input.layer.css +18 -16
- package/dist/styles/loader.css +4 -2
- package/dist/styles/loader.layer.css +4 -2
- package/dist/styles/select.css +7 -5
- package/dist/styles/select.layer.css +7 -5
- package/dist/styles/stepperField.css +4 -4
- package/dist/styles/stepperField.layer.css +4 -4
- package/dist/styles/table.css +5 -3
- package/dist/styles/table.layer.css +5 -3
- package/dist/styles/textArea.css +7 -5
- package/dist/styles/textArea.layer.css +7 -5
- package/dist/styles/toggleButton.css +31 -21
- package/dist/styles/toggleButton.layer.css +31 -21
- package/dist/styles.css +144 -114
- package/dist/styles.layer.css +144 -114
- package/dist/types/version.d.ts +1 -1
- package/package.json +6 -4
|
@@ -7713,13 +7713,13 @@ const PrimitiveCatalog = {
|
|
|
7713
7713
|
"top": {
|
|
7714
7714
|
"type": "string"
|
|
7715
7715
|
},
|
|
7716
|
-
"
|
|
7716
|
+
"wrap": {
|
|
7717
7717
|
"type": "string"
|
|
7718
7718
|
},
|
|
7719
|
-
"
|
|
7719
|
+
"row": {
|
|
7720
7720
|
"type": "string"
|
|
7721
7721
|
},
|
|
7722
|
-
"
|
|
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
|
-
"
|
|
8008
|
+
"wrap": {
|
|
8009
8009
|
"type": "string"
|
|
8010
8010
|
},
|
|
8011
|
-
"
|
|
8011
|
+
"row": {
|
|
8012
8012
|
"type": "string"
|
|
8013
8013
|
},
|
|
8014
|
-
"
|
|
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
|
-
"
|
|
9220
|
+
"wrap": {
|
|
9221
9221
|
"type": "string"
|
|
9222
9222
|
},
|
|
9223
|
-
"
|
|
9223
|
+
"row": {
|
|
9224
9224
|
"type": "string"
|
|
9225
9225
|
},
|
|
9226
|
-
"
|
|
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
|
-
"
|
|
14333
|
+
"wrap": {
|
|
14328
14334
|
"type": "string"
|
|
14329
14335
|
},
|
|
14330
|
-
"
|
|
14336
|
+
"row": {
|
|
14331
14337
|
"type": "string"
|
|
14332
14338
|
},
|
|
14333
|
-
"
|
|
14339
|
+
"column": {
|
|
14334
14340
|
"type": "string"
|
|
14335
14341
|
},
|
|
14336
14342
|
"ariaLabel": {
|
|
@@ -7,13 +7,19 @@ import { isOtpChallenge } from '../utils.mjs';
|
|
|
7
7
|
|
|
8
8
|
const { getConfirmText, getConfirmingText, getBackToSignInText, getResendCodeText, } = authenticatorTextUtil;
|
|
9
9
|
const ConfirmSignInFooter = () => {
|
|
10
|
-
const { isPending, toSignIn, challengeName, resendCode } = useAuthenticator((context) => [
|
|
10
|
+
const { isPending, toSignIn, challengeName, resendCode, selectedAuthMethod, availableAuthMethods, } = useAuthenticator((context) => [
|
|
11
11
|
context.isPending,
|
|
12
12
|
context.toSignIn,
|
|
13
13
|
context.challengeName,
|
|
14
14
|
context.resendCode,
|
|
15
|
+
context.selectedAuthMethod,
|
|
16
|
+
context.availableAuthMethods,
|
|
15
17
|
]);
|
|
16
|
-
|
|
18
|
+
// Only show "Resend Code" for passwordless (USER_AUTH) flows.
|
|
19
|
+
// Password-based sign-in does not support resending MFA codes.
|
|
20
|
+
const hasPasswordlessMethod = (!!selectedAuthMethod && selectedAuthMethod !== 'PASSWORD') ||
|
|
21
|
+
!!availableAuthMethods?.some((m) => m !== 'PASSWORD');
|
|
22
|
+
const showResendCode = isOtpChallenge(challengeName) && hasPasswordlessMethod && resendCode;
|
|
17
23
|
return (React__default.createElement(Flex, { direction: "column" },
|
|
18
24
|
React__default.createElement(Button, { isDisabled: isPending, type: "submit", variation: "primary", isLoading: isPending, loadingText: getConfirmingText() }, getConfirmText()),
|
|
19
25
|
showResendCode && (React__default.createElement(Button, { onClick: resendCode, type: "button" }, getResendCodeText())),
|
package/dist/esm/version.mjs
CHANGED
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.
|
|
2466
|
+
const VERSION = '6.15.5';
|
|
2467
2467
|
|
|
2468
2468
|
const logger$2 = ui.getLogger('AccountSettings');
|
|
2469
2469
|
const getIsDisabled = (formValues, validationError) => {
|
|
@@ -2886,13 +2886,19 @@ const isOtpChallenge = (challengeName) => !!challengeName &&
|
|
|
2886
2886
|
|
|
2887
2887
|
const { getConfirmText, getConfirmingText, getBackToSignInText: getBackToSignInText$2, getResendCodeText: getResendCodeText$1, } = ui.authenticatorTextUtil;
|
|
2888
2888
|
const ConfirmSignInFooter = () => {
|
|
2889
|
-
const { isPending, toSignIn, challengeName, resendCode } = uiReactCore.useAuthenticator((context) => [
|
|
2889
|
+
const { isPending, toSignIn, challengeName, resendCode, selectedAuthMethod, availableAuthMethods, } = uiReactCore.useAuthenticator((context) => [
|
|
2890
2890
|
context.isPending,
|
|
2891
2891
|
context.toSignIn,
|
|
2892
2892
|
context.challengeName,
|
|
2893
2893
|
context.resendCode,
|
|
2894
|
+
context.selectedAuthMethod,
|
|
2895
|
+
context.availableAuthMethods,
|
|
2894
2896
|
]);
|
|
2895
|
-
|
|
2897
|
+
// Only show "Resend Code" for passwordless (USER_AUTH) flows.
|
|
2898
|
+
// Password-based sign-in does not support resending MFA codes.
|
|
2899
|
+
const hasPasswordlessMethod = (!!selectedAuthMethod && selectedAuthMethod !== 'PASSWORD') ||
|
|
2900
|
+
!!availableAuthMethods?.some((m) => m !== 'PASSWORD');
|
|
2901
|
+
const showResendCode = isOtpChallenge(challengeName) && hasPasswordlessMethod && resendCode;
|
|
2896
2902
|
return (React__namespace["default"].createElement(Field.Flex, { direction: "column" },
|
|
2897
2903
|
React__namespace["default"].createElement(Field.Button, { isDisabled: isPending, type: "submit", variation: "primary", isLoading: isPending, loadingText: getConfirmingText() }, getConfirmText()),
|
|
2898
2904
|
showResendCode && (React__namespace["default"].createElement(Field.Button, { onClick: resendCode, type: "button" }, getResendCodeText$1())),
|
package/dist/internal.js
CHANGED
|
@@ -7964,13 +7964,13 @@ const PrimitiveCatalog = {
|
|
|
7964
7964
|
"top": {
|
|
7965
7965
|
"type": "string"
|
|
7966
7966
|
},
|
|
7967
|
-
"
|
|
7967
|
+
"wrap": {
|
|
7968
7968
|
"type": "string"
|
|
7969
7969
|
},
|
|
7970
|
-
"
|
|
7970
|
+
"row": {
|
|
7971
7971
|
"type": "string"
|
|
7972
7972
|
},
|
|
7973
|
-
"
|
|
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
|
-
"
|
|
8259
|
+
"wrap": {
|
|
8260
8260
|
"type": "string"
|
|
8261
8261
|
},
|
|
8262
|
-
"
|
|
8262
|
+
"row": {
|
|
8263
8263
|
"type": "string"
|
|
8264
8264
|
},
|
|
8265
|
-
"
|
|
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
|
-
"
|
|
9471
|
+
"wrap": {
|
|
9472
9472
|
"type": "string"
|
|
9473
9473
|
},
|
|
9474
|
-
"
|
|
9474
|
+
"row": {
|
|
9475
9475
|
"type": "string"
|
|
9476
9476
|
},
|
|
9477
|
-
"
|
|
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
|
-
"
|
|
14584
|
+
"wrap": {
|
|
14579
14585
|
"type": "string"
|
|
14580
14586
|
},
|
|
14581
|
-
"
|
|
14587
|
+
"row": {
|
|
14582
14588
|
"type": "string"
|
|
14583
14589
|
},
|
|
14584
|
-
"
|
|
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:
|
|
1516
|
-
|
|
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:
|
|
1519
|
-
|
|
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;
|
|
@@ -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:
|
|
1517
|
-
|
|
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:
|
|
1520
|
-
|
|
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--
|
|
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-
|
|
948
|
+
--amplify-components-button-link-disabled-border-color
|
|
967
949
|
);
|
|
968
950
|
--amplify-internal-button-disabled-background-color: var(
|
|
969
|
-
--amplify-components-button-
|
|
951
|
+
--amplify-components-button-link-disabled-background-color
|
|
970
952
|
);
|
|
971
953
|
--amplify-internal-button-disabled-color: var(
|
|
972
|
-
--amplify-components-button-
|
|
954
|
+
--amplify-components-button-link-disabled-color
|
|
973
955
|
);
|
|
974
956
|
--amplify-internal-button-loading-background-color: var(
|
|
975
|
-
--amplify-components-button-
|
|
957
|
+
--amplify-components-button-link-loading-background-color
|
|
976
958
|
);
|
|
977
959
|
--amplify-internal-button-loading-border-color: var(
|
|
978
|
-
--amplify-components-button-
|
|
960
|
+
--amplify-components-button-link-loading-border-color
|
|
979
961
|
);
|
|
980
962
|
--amplify-internal-button-loading-color: var(
|
|
981
|
-
--amplify-components-button-
|
|
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);
|
|
@@ -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--
|
|
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-
|
|
949
|
+
--amplify-components-button-link-disabled-border-color
|
|
968
950
|
);
|
|
969
951
|
--amplify-internal-button-disabled-background-color: var(
|
|
970
|
-
--amplify-components-button-
|
|
952
|
+
--amplify-components-button-link-disabled-background-color
|
|
971
953
|
);
|
|
972
954
|
--amplify-internal-button-disabled-color: var(
|
|
973
|
-
--amplify-components-button-
|
|
955
|
+
--amplify-components-button-link-disabled-color
|
|
974
956
|
);
|
|
975
957
|
--amplify-internal-button-loading-background-color: var(
|
|
976
|
-
--amplify-components-button-
|
|
958
|
+
--amplify-components-button-link-loading-background-color
|
|
977
959
|
);
|
|
978
960
|
--amplify-internal-button-loading-border-color: var(
|
|
979
|
-
--amplify-components-button-
|
|
961
|
+
--amplify-components-button-link-loading-border-color
|
|
980
962
|
);
|
|
981
963
|
--amplify-internal-button-loading-color: var(
|
|
982
|
-
--amplify-components-button-
|
|
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
|
}
|
|
@@ -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);
|
|
@@ -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);
|