Components

1. Installation through NPM:

   Use the following command to install the SDK through NPM:

   npm i @covered/components

2. Create an AuthLeaseCallback:

   Please create the asynchronous AuthLeaseCallback as follows:

   const authLeaseCallback = async (): Promise<AuthLeaseResponse> => {
     const { data }: { data: AuthLeaseResponse } =
       await axios.post('/api/auth/covered');
     return data;
   };

3. Custom Theme Creation (Optional):

   You can develop a custom theme for the SDK as shown below:

   const customTheme: Theme = {
       brandName: 'PEX',
       logoUrl: 'https://assets.itscovered.com/partners/pex/PEX-transparent.png',
       redirectUrl: '',
       color: '#488FA2',
       coBranded: false,
   };

4. Import SDK CSS classes:

   Add the below import statement in your main.tsx file to import SDK CSS classes:

   import '../node_modules/@covered/components/style.css';

5. Instantiate the Component by passing the customTheme and authLeaseCallback as props:

   <PolicyRetrieve
     theme={customTheme}
     authLeaseCallback={authLeaseCallback}
   />

6. Sandbox Development

   For testing purposes, you can use the sandbox development mode which will return mock data. To achieve this, pass the environment argument to the component with the Environment.SANDBOX value as shown below:

<PolicyRetrieve
  environment={Environment.SANDBOX}
  theme={customTheme}
  authLeaseCallback={authLeaseCallback}
/>

7. Sandbox Testing Credentials You can utilize the following credentials to return testing policies:

• Username: user_good_home
• Password: pass_good

Follow the above steps, and you will be able to use the @covered/components within your application.