@aws-amplify/ui-react 2.15.6 → 2.16.0

package/dist/styles.css

@@ -4,7 +4,7 @@
 
 /**
  * Do not edit directly
- * Generated on Tue, 26 Apr 2022 22:04:22 GMT
+ * Generated on Tue, 03 May 2022 22:09:05 GMT
  */
 
 :root, [data-amplify-theme] {
@@ -1676,6 +1676,23 @@ h6.amplify-heading {
   }
 }
 
+.amplify-authenticator__column {
+  display: flex;
+  flex-direction: column;
+}
+
+.amplify-authenticator__subtitle {
+  margin-bottom: var(--amplify-space-medium);
+}
+
+.amplify-authenticator__heading {
+  font-size: var(--amplify-font-sizes-xl);
+}
+
+.amplify-authenticator__federated-text {
+  align-self: center;
+}
+
 .amplify-card {
   background-color: var(--amplify-components-card-background-color);
   border-radius: var(--amplify-components-card-border-radius);

package/dist/types/components/Authenticator/Authenticator.d.ts

@@ -1,29 +1,27 @@
-/// <reference types="react" />
+import * as React from 'react';
 import { AuthenticatorMachineOptions } from '@aws-amplify/ui';
-import { RouterProps } from './Router';
 import { ComponentsProviderProps } from './hooks/useCustomComponents';
-export interface ComponentsProp {
-}
-export declare type AuthenticatorProps = AuthenticatorMachineOptions & RouterProps & ComponentsProviderProps;
-export declare function Authenticator({ children, className, components: customComponents, initialState, loginMechanisms, services, signUpAttributes, socialProviders, variation, hideSignUp, formFields, }: AuthenticatorProps): JSX.Element;
+import { RouterProps } from './Router';
+export declare type AuthenticatorProps = Partial<AuthenticatorMachineOptions & ComponentsProviderProps & RouterProps>;
+export declare function Authenticator({ children, className, components: customComponents, formFields, hideSignUp, initialState, loginMechanisms, signUpAttributes, services, socialProviders, variation, }: AuthenticatorProps): JSX.Element;
 export declare namespace Authenticator {
     var Provider: ({ children }: {
-        children: any;
+        children: React.ReactNode;
     }) => JSX.Element;
     var ResetPassword: {
-        (): JSX.Element;
+        ({ className, variation, }: import("./RouteContainer").RouteProps): JSX.Element;
         Header(): JSX.Element;
         Footer(): JSX.Element;
     };
     var SetupTOTP: {
-        (): JSX.Element;
+        ({ className, variation, }: import("./RouteContainer").RouteProps): JSX.Element;
         Header(): JSX.Element;
         Footer(): JSX.Element;
     };
     var SignIn: typeof import("./SignIn").SignIn;
     var SignUp: typeof import("./SignUp").SignUp;
     var ForceNewPassword: {
-        (): JSX.Element;
+        ({ className, variation, }: import("./RouteContainer").RouteProps): JSX.Element;
         FormFields(): JSX.Element;
     };
 }

package/dist/types/components/Authenticator/ConfirmSignIn/ConfirmSignIn.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
+import { RouteProps } from '../RouteContainer';
 export declare const ConfirmSignIn: {
-    (): JSX.Element;
+    ({ className, variation, }: RouteProps): JSX.Element;
     Header: typeof Header;
     Footer(): JSX.Element;
 };

package/dist/types/components/Authenticator/ConfirmSignUp/ConfirmSignUp.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-export declare function ConfirmSignUp(): JSX.Element;
+import { RouteProps } from '../RouteContainer';
+export declare function ConfirmSignUp({ className, variation }: RouteProps): JSX.Element;
 export declare namespace ConfirmSignUp {
     var Header: () => JSX.Element;
     var Footer: () => JSX.Element;

package/dist/types/components/Authenticator/ForceNewPassword/ForceNewPassword.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
+import { RouteProps } from '../RouteContainer';
 export declare const ForceNewPassword: {
-    (): JSX.Element;
+    ({ className, variation, }: RouteProps): JSX.Element;
     FormFields(): JSX.Element;
 };

package/dist/types/components/Authenticator/ResetPassword/ConfirmResetPassword.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
+import { RouteProps } from '../RouteContainer';
 export declare const ConfirmResetPassword: {
-    (): JSX.Element;
+    ({ className, variation, }: RouteProps): JSX.Element;
     Header(): JSX.Element;
     Footer(): JSX.Element;
 };

package/dist/types/components/Authenticator/ResetPassword/ResetPassword.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
+import { RouteProps } from '../RouteContainer';
 export declare const ResetPassword: {
-    (): JSX.Element;
+    ({ className, variation, }: RouteProps): JSX.Element;
     Header(): JSX.Element;
     Footer(): JSX.Element;
 };

package/dist/types/components/Authenticator/RouteContainer/RouteContainer.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { RouteContainerProps } from './types';
+export declare function RouteContainer({ children, className, variation, }: RouteContainerProps): JSX.Element;

package/dist/types/components/Authenticator/RouteContainer/index.d.ts

@@ -0,0 +1,2 @@
+export { RouteContainer } from './RouteContainer';
+export { RouteContainerProps, RouteProps } from './types';

package/dist/types/components/Authenticator/RouteContainer/types.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+export declare type RouteProps = {
+    className: string;
+    variation: 'default' | 'modal';
+};
+export declare type RouteContainerProps = {
+    children: React.ReactNode;
+} & RouteProps;

package/dist/types/components/Authenticator/Router/Router.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { RouterProps } from './types';
+export declare function useRouterChildren(children: RouterProps['children']): (props?: Omit<RouterProps, 'children'>) => JSX.Element;
+export declare function Router({ children, className, hideSignUp, variation, }: RouterProps): JSX.Element;

package/dist/types/components/Authenticator/Router/index.d.ts

@@ -1,15 +1,3 @@
-import * as React from 'react';
-import { CognitoUserAmplify } from '@aws-amplify/ui';
-import { useAuthenticator } from '../hooks/useAuthenticator';
-declare type AuthenticatorChildren = React.ReactNode | (({ signOut, user, }: {
-    signOut?: ReturnType<typeof useAuthenticator>['signOut'];
-    user?: CognitoUserAmplify;
-}) => React.ReactNode);
-export declare type RouterProps = {
-    className?: string;
-    children?: AuthenticatorChildren;
-    variation?: 'default' | 'modal';
-    hideSignUp?: boolean;
-};
-export declare function Router({ children, className, variation, hideSignUp, }: RouterProps): JSX.Element;
-export {};
+export { RouteContainer } from '../RouteContainer/RouteContainer';
+export { Router } from './Router';
+export { RouterProps } from './types';

package/dist/types/components/Authenticator/Router/types.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { CognitoUserAmplify } from '@aws-amplify/ui';
+import { RouteProps } from '../RouteContainer';
+import { UseAuthenticator } from '../hooks/useAuthenticator';
+export declare type RouterProps = {
+    children: React.ReactNode | ((props?: {
+        signOut?: UseAuthenticator['signOut'];
+        user?: CognitoUserAmplify;
+    }) => React.ReactNode);
+    hideSignUp: boolean;
+} & RouteProps;

package/dist/types/components/Authenticator/SetupTOTP/SetupTOTP.d.ts

@@ -1,6 +1,8 @@
 /// <reference types="react" />
+import { RouteProps } from '../RouteContainer';
+export declare const getTotpCode: (issuer: string, username: string, secret: string) => string;
 export declare const SetupTOTP: {
-    (): JSX.Element;
+    ({ className, variation, }: RouteProps): JSX.Element;
     Header(): JSX.Element;
     Footer(): JSX.Element;
 };

package/dist/types/components/Authenticator/VerifyUser/ConfirmVerifyUser.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
+import { RouteProps } from '../RouteContainer';
 export declare const ConfirmVerifyUser: {
-    (): JSX.Element;
+    ({ className, variation, }: RouteProps): JSX.Element;
     Header(): JSX.Element;
     Footer(): JSX.Element;
 };

package/dist/types/components/Authenticator/VerifyUser/VerifyUser.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
+import { RouteProps } from '../RouteContainer';
 export declare const VerifyUser: {
-    (): JSX.Element;
+    ({ className, variation, }: RouteProps): JSX.Element;
     Header(): JSX.Element;
     Footer(): JSX.Element;
 };

package/dist/types/components/Authenticator/hooks/useAuthenticator/index.d.ts

@@ -11,7 +11,7 @@ export declare type AuthenticatorContextValue = {
  */
 export declare const AuthenticatorContext: React.Context<AuthenticatorContextValue>;
 export declare const Provider: ({ children }: {
-    children: any;
+    children: React.ReactNode;
 }) => JSX.Element;
 /**
  * These are the "facades" that we provide, which contains contexts respective
@@ -36,16 +36,14 @@ export declare type InternalAuthenticatorContext = {
 export declare type Selector = (context: AuthenticatorContext) => Array<any>;
 export declare const useAuthenticator: (selector?: Selector) => {
     /** @deprecated For internal use only */
-    _state: AuthMachineState;
+    _state: import("xstate").State<import("@aws-amplify/ui").AuthContext, import("@aws-amplify/ui").AuthEvent, any, any, any>;
     /** @deprecated For internal use only */
-    _send: (event: import("xstate").SCXML.Event<import("@aws-amplify/ui").AuthEvent> | import("xstate").SingleOrArray<import("xstate").Event<import("@aws-amplify/ui").AuthEvent>>, payload?: import("xstate").EventData) => import("xstate").State<import("@aws-amplify/ui").AuthContext, import("@aws-amplify/ui").AuthEvent, any, {
-        value: any;
-        context: import("@aws-amplify/ui").AuthContext;
-    }, import("xstate").TypegenDisabled>;
+    _send: (event: import("xstate").SingleOrArray<import("xstate").Event<import("@aws-amplify/ui").AuthEvent>> | import("xstate").SCXML.Event<import("@aws-amplify/ui").AuthEvent>, payload?: import("xstate").EventData) => import("xstate").State<import("@aws-amplify/ui").AuthContext, import("@aws-amplify/ui").AuthEvent, any, any, any>;
     error: string;
     hasValidationErrors: boolean;
     isPending: boolean;
     route: string;
+    authStatus: string;
     user: import("@aws-amplify/ui").CognitoUserAmplify;
     validationErrors: {
         [x: string]: string | string[];
@@ -62,3 +60,4 @@ export declare const useAuthenticator: (selector?: Selector) => {
     toSignUp: (data?: import("@aws-amplify/ui").AuthEventData) => void;
     skipVerification: (data?: import("@aws-amplify/ui").AuthEventData) => void;
 };
+export declare type UseAuthenticator = ReturnType<typeof useAuthenticator>;

package/dist/types/components/Authenticator/shared/SignInSignUpTabs.d.ts

@@ -1,4 +1,5 @@
 /// <reference types="react" />
-export declare const SignInSignUpTabs: ({ hideSignUp, }: {
+import { RouteProps } from '../RouteContainer';
+export declare const SignInSignUpTabs: ({ className, hideSignUp, variation, }: {
     hideSignUp: boolean;
-}) => JSX.Element;
+} & RouteProps) => JSX.Element;

package/dist/types/components/Authenticator/utils.d.ts

@@ -0,0 +1 @@
+export declare const isSignInOrSignUpRoute: (route: string) => boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aws-amplify/ui-react",
-  "version": "2.15.6",
+  "version": "2.16.0",
   "main": "dist/index.js",
   "module": "dist/esm/index.js",
   "exports": {
@@ -50,20 +50,20 @@
     "build:icons": "yarn run clean:icons && node scripts/generateIcons.js",
     "clean": "rimraf dist node_modules",
     "clean:icons": "rimraf ./src/primitives/Icon/icons",
-    "lint": "tsc --noEmit && yarn eslint ./src --ext .js,.ts,.tsx",
+    "lint": "tsc --noEmit --project tsconfig.dev.json && yarn eslint ./src --ext .js,.ts,.tsx",
     "test": "yarn test:unit",
     "test:watch": "yarn test:unit:watch",
     "test:unit": "jest",
     "test:unit:watch": "jest --watch"
   },
   "dependencies": {
-    "@aws-amplify/ui": "3.6.6",
+    "@aws-amplify/ui": "3.7.0",
     "@aws-amplify/ui-react-v1": "npm:@aws-amplify/ui-react@1.2.9",
     "@radix-ui/react-accordion": "0.1.6",
     "@radix-ui/react-dropdown-menu": "0.1.6",
     "@radix-ui/react-slider": "0.1.4",
     "@radix-ui/react-tabs": "0.1.5",
-    "@xstate/react": "1.6.3",
+    "@xstate/react": "3.0.0",
     "classnames": "2.3.1",
     "deepmerge": "4.2.2",
     "lodash": "4.17.21",
@@ -94,11 +94,19 @@
     "@types/jest": "^26.0.23",
     "@types/qrcode": "^1.4.2",
     "@types/testing-library__jest-dom": "^5.14.1",
-    "@typescript-eslint/eslint-plugin": "^5.6.0",
-    "@typescript-eslint/parser": "^5.6.0",
+    "@typescript-eslint/eslint-plugin": "^5.20.0",
+    "@typescript-eslint/parser": "^5.20.0",
     "degit": "^2.8.4",
-    "eslint": "^8.4.1",
-    "eslint-plugin-react-hooks": "^4.3.0",
+    "eslint": "^8.13.0",
+    "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-airbnb-typescript": "^17.0.0",
+    "eslint-config-prettier": "^8.5.0",
+    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-jest": "^26.1.4",
+    "eslint-plugin-jsx-a11y": "^6.5.1",
+    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-react": "^7.29.4",
+    "eslint-plugin-react-hooks": "^4.4.0",
     "jest": "^27.0.4",
     "jest-matchmedia-mock": "^1.1.0",
     "react-router-dom": "^6.2.1",

package/dist/esm/components/Authenticator/Router/index.js

@@ -1 +0,0 @@
-import{jsx as r,Fragment as e,jsxs as i}from"react/jsx-runtime";import{useAuthenticator as s}from"../hooks/useAuthenticator/index.js";import{View as t}from"../../../primitives/View/View.js";import{ConfirmSignUp as n}from"../ConfirmSignUp/ConfirmSignUp.js";import{ForceNewPassword as o}from"../ForceNewPassword/ForceNewPassword.js";import{useCustomComponents as a}from"../hooks/useCustomComponents/index.js";import{SetupTOTP as m}from"../SetupTOTP/SetupTOTP.js";import"@aws-amplify/ui";import"../../../primitives/TextField/TextField.js";import"../../../primitives/Button/Button.js";import"../../../primitives/Flex/Flex.js";import"../../../primitives/Alert/Alert.js";import{SignInSignUpTabs as u}from"../shared/SignInSignUpTabs.js";import{ConfirmVerifyUser as p}from"../VerifyUser/ConfirmVerifyUser.js";import{VerifyUser as c}from"../VerifyUser/VerifyUser.js";import{ConfirmSignIn as f}from"../ConfirmSignIn/ConfirmSignIn.js";import{ConfirmResetPassword as d}from"../ResetPassword/ConfirmResetPassword.js";import{ResetPassword as l}from"../ResetPassword/ResetPassword.js";const g=r=>"signIn"===r||"signUp";function j({children:j,className:h,variation:w="default",hideSignUp:U}){const{route:y,signOut:P,user:S}=s((r=>[r.route,r.signOut,r.user])),{components:{Header:O,Footer:v}}=a();return["authenticated","signOut"].includes(y)?j?r(e,{children:"function"==typeof j?j({signOut:P,user:S}):j}):null:r(e,{children:r(t,Object.assign({className:h,"data-amplify-authenticator":"","data-variation":w},{children:i(t,Object.assign({"data-amplify-container":""},{children:[r(O,{}),r(t,Object.assign({"data-amplify-router":"","data-amplify-router-content":g(y)?void 0:""},{children:(()=>{switch(y){case"idle":case"setup":return null;case"confirmSignUp":return r(n,{});case"confirmSignIn":return r(f,{});case"setupTOTP":return r(m,{});case"signIn":case"signUp":return r(u,{hideSignUp:U});case"forceNewPassword":return r(o,{});case"resetPassword":return r(l,{});case"confirmResetPassword":return r(d,{});case"verifyUser":return r(c,{});case"confirmVerifyUser":return r(p,{});default:return console.warn("Unhandled Authenicator route – please open an issue: ",y),null}})()})),r(v,{})]}))}))})}export{j as Router};